Home >php教程 >php手册 >php+highchats生成动态统计图实例代码

php+highchats生成动态统计图实例代码

WBOYOriginal: 2016-06-13 09:34:52859browse

分享下php+highchats生成动态统计图的方法。

例子：

series:<span> [{ 
type</span>: 'pie',<span> 
name</span>: 'Browser share',<span> 
data</span>:<span> [ 
[</span>'Firefox', 45.0],<span> 
[</span>'IE', 26.8],<span> 
{ 
name</span>: 'Chrome',<span> 
y</span>: 12.8,<span> 
sliced</span>: <span>true</span>,<span> 
selected</span>: <span>true</span><span> 
}</span>,<span> 
[</span>'Safari', 8.5],<span> 
[</span>'Opera', 6.2],<span> 
[</span>'Others', 0.7<span>] 
] 
}] </span>

主要看这段：

<span>{ 
name</span>: 'Chrome',<span> 
y</span>: 12.8,<span> 
sliced</span>: <span>true</span>,<span> 
selected</span>: <span>true</span><span> 
}</span>

您可能感兴趣的文章：

Highcharts教程(22) 柱状图例子
Highcharts教程(21) 条状图例子
Highcharts教程(20) 曲线图例子二
Highcharts教程(19) 曲线图例子一
Highcharts教程(18) xAxis x轴样式二
Highcharts教程(17) xAxis x轴的样式一
Highcharts教程(16) tooltip工具提示
Highcharts教程(15) title标题、subtitle副标题
Highcharts教程(14) Series数据列选项
Highcharts教程(13) Pie饼图与其他图形
Highcharts教程(12) gauge测量图
Highcharts教程(11) bar条状图、Column柱状图、Columnrange柱状排列图
Highcharts教程(10) arearange区域排列图VSareaspline区域曲线图VSareasplinerangeVSbar条状图
Highcharts教程(9) PlotOptions之area区域图
Highcharts教程(8) Pane窗格选项、PlotOptions绘图选项概览
Highcharts教程(7) loading加载选项、navigation 选项
Highcharts教程(6) legend 图例选项
Highcharts教程(5) Lang语言选项
Highcharts教程(4) global全局选项和labels标签选项
Highcharts教程(3) exporting导出和打印选项
Highcharts教程(2) colors颜色与credits名片选项
Highcharts教程(1) chart 图表选项

代码：

<!DOCTYPE HTML> 

<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
<title>FusionCharts</title> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> 
<script type="text/javascript"><span> 
$(</span><span>function</span><span> () { 
</span><span>var</span> ds = [{"name":"\u4e0a\u6d77","y":28.2},{"name":"\u5317\u4eac","y":48.2},{"name":"\u5e7f\u4e1c","y":18.2<span>}]; 
</span><span>//</span><span>其实只要按照例子中的json显示方式展示就行了,如chrome。 
// Radialize the colors </span>
Highcharts.getOptions().colors = Highcharts.map(Highcharts.getOptions().colors, <span>function</span><span>(color) { 
</span><span>return</span><span> { 
radialGradient</span>: { cx: 0.5, cy: 0.3, r: 0.7 },<span> 
stops</span>:<span> [ 
[</span>0, color],<span> 
[</span>1, Highcharts.Color(color).brighten(-0.3).get('rgb')] <span>//</span><span> darken </span>
<span>] 
}; 
}); 
</span><span>//</span><span> Build the chart </span>
$('#container').<span>highcharts({ 
chart</span>:<span> { 
plotBackgroundColor</span>: <span>null</span>,<span> 
plotBorderWidth</span>: <span>null</span>,<span> 
plotShadow</span>: <span>false</span><span> 
}</span>,<span> 
title</span>:<span> { 
text</span>: 'Browser market shares at a specific website, 2010'<span> 
}</span>,<span> 
tooltip</span>:<span> { 
pointFormat</span>: '{series.name}: <b>{point.percentage:.1f}%</b>'<span> 
}</span>,<span> 
plotOptions</span>:<span> { 
pie</span>:<span> { 
allowPointSelect</span>: <span>true</span>,<span> 
cursor</span>: 'pointer',<span> 
dataLabels</span>:<span> { 
enabled</span>: <span>true</span>,<span> 
color</span>: '#000000',<span> 
connectorColor</span>: '#000000',<span> 
formatter</span>: <span>function</span><span>() { 
</span><span>return</span> '<b>'+ this.point.name +'</b>: '+ this.percentage +' %'<span>; 
} 
} 
} 
}</span>,<span> 
series</span>:<span> [{ 
type</span>: 'pie',<span> 
name</span>: 'Browser share',<span> 
data</span>: ds,<span> 
}] 
}); 
}); 
</span></script> 
</head> 
<body> 
<script src="js/hc.js"></script> 
<script src="js/modules/exporting.js"></script> 
<div id="container">php 
area(); 
</span><span>/*</span><span>* 
* 地区接口 
* name名称 
* y数据值 
* 
</span><span>*/</span> 
<span>function</span><span> area() 
{ 
</span><span>$b</span> = <span>array</span><span>( 
</span><span>array</span>('name'=>'上海', 'y'=>28.2), 
<span>array</span>('name'=>'北京', 'y'=>48.2), 
<span>array</span>('name'=>'广东', 'y'=>18.2),<span> 
); 
</span><span>$data</span> = json_encode(<span>$b</span><span>); 
</span><span>echo</span>(<span>$data</span><span>); 
} 
</span>?> 
</body> 
</html><span> 
以下是php输出json数据，供js使用</span>:


<?<span>php 
</span><span>$strs</span> = @<span>file</span>("/proc/net/dev"<span>); 
</span><span>for</span> (<span>$i</span> = 2; <span>$i</span> < <span>count</span>(<span>$strs</span>); <span>$i</span>++<span> ) 
{ 
</span><span>preg_match_all</span>( "/([^\s]+):[\s]{0,}(\d+)\s+(\d+)\s+(\d+)\s+(\d+)\s+(\d+)\s+(\d+)\s+(\d+)\s+(\d+)\s+(\d+)\s+(\d+)\s+(\d+)/", <span>$strs</span>[<span>$i</span>], <span>$info</span><span> ); 
</span><span>/*</span><span> $NetInput[$i] = formatsize($info[2][0]); 
$NetOut[$i] = formatsize($info[10][0]); 
</span><span>*/</span> 
<span>$tmo</span> = <span>round</span>(<span>$info</span>[2][0]/1024/1024, 5<span>); 
</span><span>$tmo2</span> = <span>round</span>(<span>$tmo</span> / 1024, 5<span>); 
</span><span>$NetInput</span>[<span>$i</span>] = <span>$tmo2</span><span>; 
</span><span>$tmp</span> = <span>round</span>(<span>$info</span>[10][0]/1024/1024, 5<span>); 
</span><span>$tmp2</span> = <span>round</span>(<span>$tmp</span> / 1024, 5<span>); 
</span><span>$NetOut</span>[<span>$i</span>] = <span>$tmp2</span><span>;

}

</span><span>$arr</span> = <span>array</span><span>(); 
</span><span>if</span> (<span>false</span> !== (<span>$strs</span> = @<span>file</span>("/proc/net/dev"))) : 
<span>for</span> (<span>$i</span> = 2; <span>$i</span> < <span>count</span>(<span>$strs</span>); <span>$i</span>++ ) : 
<span>preg_match_all</span>( "/([^\s]+):[\s]{0,}(\d+)\s+(\d+)\s+(\d+)\s+(\d+)\s+(\d+)\s+(\d+)\s+(\d+)\s+(\d+)\s+(\d+)\s+(\d+)\s+(\d+)/", <span>$strs</span>[<span>$i</span>], <span>$info</span><span> ); 
</span><span>$arr</span>[<span>$i</span>]["name"] = <span>$info</span>[1][0<span>]; 
</span><span>$arr</span>[<span>$i</span>]["data"][0] = <span>$NetInput</span>[<span>$i</span><span>]; 
</span><span>$arr</span>[<span>$i</span>]["data"][1] = <span>$NetOut</span>[<span>$i</span><span>];

</span><span>endfor</span><span>; 
</span><span>endif</span><span>; 
</span><span>echo</span>(json_encode(<span>$arr</span><span>)); 
</span>?>

输出：

{"2":{"name":"lo","data":[0,0]},"3":{"name":"eth0","data":[0.40377,0.00353]}}
js调用:

series:<span> [ 
</span><span>] 
</span><span style="white-space:pre"> </span>]

Statement：

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Previous article：PHP开发札记-星期/周操作中常用的日期获取方法Next article：php 验证上传图片尺寸

See more

php+highchats生成动态统计图实例代码

您可能感兴趣的文章：

Related articles