PHP柱状图函数
原始HTML大概是从BLUEIDEA得来的吧,记不清了。
PHP我写的,也写了好久了。
现在不用了,在BLOG上留个记录。
CSS部分:
<style type="text/css">
<!--
ul.q-graph {border:2px solid #0063be; background:#ffc url(images/graphbg.png) repeat-x scroll 0 0 !important;background:#ffc repeat-x scroll 0 0; position:relative;list-style:none;margin:1.1em 0 3.5em 0; padding:0;}
.q-graph li { position:absolute;text-align:center;bottom:0;padding:0;margin:0;}
li.qtr {border-right:1px dotted #41a3e2; word-wrap:break-word; z-index:2;}
.q-graph ul {list-style:none;}
li.bar {width:34px; font-size:9px; color:#fff; background:#ddd url('images/graphbar.gif') no-repeat -34px 0;}
li.ticks {left:0;width:100%;z-index:1;}
div.ticks {position:relative;margin:0;border-top:1px dotted #41a3e2;}
div.ticks:first-child {border-top:none;} /*only4 Firefx IE 7+*/
div.ticks p {position:absolute;left:101%;top:-2px;margin:0;color:#f00; font-weight:bold;}
-->
</style>
PHP部分:
//PHP生成柱状图表 By LiuYuanjun.com
//数组格式array(array(数量,文字,提示文字),array(数量,文字,提示文字))
function mkgraph($array,$total){
$barwidth = 70;//柱宽度
$barnum = count($array);//数组个数,柱个数
$graphwidth = $barwidth*$barnum+20;//图表宽度
$graphheight = 300;//图表高度
$barleft = ($barwidth-34)/2;//计算柱左间距
echo "<ul class=\"q-graph\" style=\"height:".$graphheight."px !important;height:".($graphheight+4)."px; width:".$graphwidth."px;\">";
for($i=0;$i<$barnum;$i++){
$thispercent = round($array[$i][0]/$total*100,2);
//计算柱高度
$thisbarheight = round(($graphheight-5)*$array[$i][0]/$total+1);
$thisbarheight = $thisbarheight<9?9:$thisbarheight;//柱高小于9的显示为9,以便正常显示文字
echo "<li class=\"qtr\" style=\"left:".($barwidth*$i)."px;width:".$barwidth."px;height:".$graphheight."px;\">".$array[$i][1]."\n";
echo "<ul>";
echo "<li class=\"bar\" style=\"left:".$barleft."px;height:".$thisbarheight."px;\" title=\"".$array[$i][2]."数量:".$array[$i][0]." 割合:".$thispercent."%\">".$array[$i][0]."</li>";
echo "</ul>";
echo "</li>";
}
$ticksheight = $graphheight/5;
echo "<li class=\"ticks\" style=\"height:".$graphheight."px;\">";
echo "<div class=\"ticks\" style=\"height:".$ticksheight."px;\"><p>100%</p></div>";
echo "<div class=\"ticks\" style=\"height:".$ticksheight."px;\"><p>80%</p></div>";
echo "<div class=\"ticks\" style=\"height:".$ticksheight."px;\"><p>60%</p></div>";
echo "<div class=\"ticks\" style=\"height:".$ticksheight."px;\"><p>40%</p></div>";
echo "<div class=\"ticks\" style=\"height:".$ticksheight."px;\"><p>20%</p></div>";
echo "</li>";
echo "</ul>";
}

你的那个热门标签的颜色要改改,现在很难看清楚文本。