php+highchats生成动态统计图
php+highchats生成动态统计图
发布时间:2016-12-29 来源:查字典编辑
摘要:复制代码代码如下:series:[{type:'pie',name:'Browsershare',data:[['Firefox',45.0...

复制代码 代码如下:

series: [{

type: 'pie',

name: 'Browser share',

data: [

['Firefox', 45.0],

['IE', 26.8],

{

name: 'Chrome',

y: 12.8,

sliced: true,

selected: true

},

['Safari', 8.5],

['Opera', 6.2],

['Others', 0.7]

]

}]

主要看这段:

复制代码 代码如下:

{

name: 'Chrome',

y: 12.8,

sliced: true,

selected: true

}

复制代码 代码如下:

<!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">

$(function () {

var ds = [{"name":"u4e0au6d77","y":28.2},{"name":"u5317u4eac","y":48.2},{"name":"u5e7fu4e1c","y":18.2}];

//其实只要按照例子中的json显示方式展示就行了,如chrome。

// Radialize the colors

Highcharts.getOptions().colors = Highcharts.map(Highcharts.getOptions().colors, function(color) {

return {

radialGradient: { cx: 0.5, cy: 0.3, r: 0.7 },

stops: [

[0, color],

[1, Highcharts.Color(color).brighten(-0.3).get('rgb')] // darken

]

};

});

// Build the chart

$('#container').highcharts({

chart: {

plotBackgroundColor: null,

plotBorderWidth: null,

plotShadow: false

},

title: {

text: 'Browser market shares at a specific website, 2010'

},

tooltip: {

pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'

},

plotOptions: {

pie: {

allowPointSelect: true,

cursor: 'pointer',

dataLabels: {

enabled: true,

color: '#000000',

connectorColor: '#000000',

formatter: function() {

return '<b>'+ this.point.name +'</b>: '+ this.percentage +' %';

}

}

}

},

series: [{

type: 'pie',

name: 'Browser share',

data: ds,

}]

});

});

</script>

</head>

<body>

<script src="js/hc.js"></script>

<script src="js/modules/exporting.js"></script>

<div id="container"></div>

<?php

area();

/**

* 地区接口

* name名称

* y数据值

*

*/

function area()

{

$b = array(

array('name'=>'上海', 'y'=>28.2),

array('name'=>'北京', 'y'=>48.2),

array('name'=>'广东', 'y'=>18.2),

);

$data = json_encode($b);

echo($data);

}

?>

</body>

</html>

以下是php输出json数据,供js使用:

复制代码 代码如下:

<?php

$strs = @file("/proc/net/dev");

for ($i = 2; $i < count($strs); $i++ )

{

preg_match_all( "/([^s]+):[s]{0,}(d+)s+(d+)s+(d+)s+(d+)s+(d+)s+(d+)s+(d+)s+(d+)s+(d+)s+(d+)s+(d+)/", $strs[$i], $info );

/* $NetInput[$i] = formatsize($info[2][0]);

$NetOut[$i] = formatsize($info[10][0]);

*/

$tmo = round($info[2][0]/1024/1024, 5);

$tmo2 = round($tmo / 1024, 5);

$NetInput[$i] = $tmo2;

$tmp = round($info[10][0]/1024/1024, 5);

$tmp2 = round($tmp / 1024, 5);

$NetOut[$i] = $tmp2;

}

$arr = array();

if (false !== ($strs = @file("/proc/net/dev"))) :

for ($i = 2; $i < count($strs); $i++ ) :

preg_match_all( "/([^s]+):[s]{0,}(d+)s+(d+)s+(d+)s+(d+)s+(d+)s+(d+)s+(d+)s+(d+)s+(d+)s+(d+)s+(d+)/", $strs[$i], $info );

$arr[$i]["name"] = $info[1][0];

$arr[$i]["data"][0] = $NetInput[$i];

$arr[$i]["data"][1] = $NetOut[$i];

endfor;

endif;

echo(json_encode($arr));

?>

输出:

复制代码 代码如下:

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

js调用:

复制代码 代码如下:

series: [

<span> </span>ds[2], ds[3]

<span> </span>]

推荐文章
猜你喜欢
附近的人在看
推荐阅读
拓展阅读
相关阅读
网友关注
最新php教程学习
热门php教程学习
编程开发子分类