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":"\u4e0a\u6d77","y":28.2},{"name":"\u5317\u4eac","y":48.2},{"name":"\u5e7f\u4e1c","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" style="min-width: 310px; height: 400px; margin: 0 auto"></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: [

						ds[2], ds[3]

					]



												


											
highchats与php结合生成动态统计图的更多相关文章
	

    
								
  1. 告别.NET生成报表统计图的烦恼
		
    告别.NET生成报表统计图的烦恼 标签: 报表.netstatistics图形数据库文档 2009-10-09 12:00 635人阅读 评论(0) 收藏 举报  分类: .net程序设计(C#)(2 ...
    
		
    2. 
						
  2. ABP项目中使用Swagger生成动态WebAPI
		
    本文是根据角落的白板报的<使用ABP实现SwaggerUI,生成动态webapi>一文的学习总结,感谢原文作者角落的白板报. 1 安装Swashbuckle.core 1.1 选择WebA ...
    
		
    3. 
						
  3. T-SQL Recipes之生成动态列表数据
		
    Problem 首先什么是动态列表?举个示例,假设你想输出以逗号分隔的IDs,如: 1,45,67,199,298 Solution 生成动态列表数据在我们生活场景中很常见,比如在 Dynamic P ...
    
		
    4. 
						
  4. 【转】Hibernate利用@DynamicInsert和@DynamicUpdate生成动态SQL语句
		
    原文链接:http://www.cnblogs.com/quanyongan/p/3152290.html 最近在使用Hibernate4中,发现两个很有奥秘的注解 @DynamicInsert 和  ...
    
		
    5. 
						
  5. DB2存储过程实现查询表数据，生成动态SQL，并执行
		
    一.动态执行SQL PREPARE S1 FROM 'delete from test'; EXECUTE S1; 二.使用游标 DECLARE V_CURSOR CURSOR FOR SELECT  ...
    
		
    6. 
						
  6. Linux生成动态库系统
		
    Linux生成动态库系统 一个.说明 Linux下动态库文件的扩展名为 ".so"(Shared Object). 依照约定,全部动态库文件名称的形式是libname.so(可能在 ...
    
		
    7. 
						
  7. 如何用phpcms将静态网页生成动态网页？
		
    在前两篇随笔中已经简单介绍了phpcms,那么现在让我们来看一下如何用phpcms将静态网页生成动态网页? 1.在templates文件夹下新建模板文件夹ceshi(名字可以自己随笔起) 2.在ces ...
    
		
    8. 
						
  8. 如何使用 VS生成动态库？
		
    如何使用 VS生成动态库? //.cpp 文件默认定义了 __cplusplus 宏 #ifdef __cplusplus extern "C"{ #endif xxx #ifde ...
    
		
    9. 
						
  9. CGLIB 和 JDK生成动态代理类的区别（转）
		
    文章转自http://luyuanliang.iteye.com/blog/1137292 AOP 使用的设计模式就是代理模式,是对IOC设计的补充.为了扩展性,往往会加上反射,动态生成字节码,生成代 ...
    
		
    10. 
		

	


随机推荐
	

    
									
  1. python自定义排序函数
			
    Python内置的 sorted()函数可对list进行排序: >>>sorted([36, 5, 12, 9, 21]) [5, 9, 12, 21, 36] 但 sorted() ...
    
			
    2. 
						
  2. appium获取app应用的package和 activity。---新手总结（大牛勿喷，新手互相交流）
			
    从网上搜索的方法: 如下: 1.查看源码 2.日志法a.启动待测apkb.开启日志输出:adb logcat>D:/log.txtc.关闭日志输出:ctrl+cd.查看日志直接搜索 :Displ ...
    
			
    3. 
						
  3. inline-block 垂直居中
			
    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
    
			
    4. 
						
  4. JQuery 限制文本框只能输入数字和小数点
			
    $(function(){ /*JQuery 限制文本框只能输入数字*/ $(".NumText").keyup(function(){ $(this).val($(this).v ...
    
			
    5. 
						
  5. LintCode-最长公共子串
			
    题目描述: 给出两个字符串,找到最长公共子串,并返回其长度. 注意事项 子串的字符应该连续的出现在原字符串中,这与子序列有所不同. 样例 给出A=“ABCD”,B=“CBCE”,返回 2 public ...
    
			
    6. 
						
  6. C语言数组内存初始化
			
    内存初始化当然有必然,但是不用memset,直接这样写就可以了:char* szRemoteFile = new char[MAX_LENGTH](); http://blog.csdn.net/pa ...
    
			
    7. 
						
  7. python+opencv
			
    $cd numpy $ sudo python setup.py build $ sudo python setup.py installRunning from numpy source direc ...
    
			
    8. 
						
  8. php定界符 <<< 的作用及使用注意事项
			
    按照原样输出,包括换行符.特殊字符等 任何特殊字符都不需要转义,比如双引号.单引号,它会按照原样输出 像在双引号字符串中一样使用php的变量输出 定界符<<<,当需要输出大段文本时, ...
    
			
    9. 
						
  9. IOS_OC_id ,NSObject, id&lt;NSObject&gt;差别
			
    我们常常会混淆下面三种申明(我是没有留意过):     1. id foo1;     2. NSObject *foo2;     3. id<NSObject> foo3;     第 ...
    
			
    10. 
						
  10. Android中库项目、jar包等的使用方法
			
    在软件开发过程中,程序代码的复用,是非常重要的概念.我们总是需要使用一些现有的模块.包.框架,或开发自己的模块.包.框架,来实现对程序代码的复用.比如在JavaWeb编程过程中,经常使用的Struts ...
    
			
    11.