php+highchats生成动态统计图


Posted in PHP onMay 21, 2014
    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: [  
    <span style="white-space:pre">                      </span>ds[2], ds[3]  
    <span style="white-space:pre">                  </span>] 
PHP 相关文章推荐
用PHP伪造referer突破网盘禁止外连的代码
Jun 15 PHP
用php的ob_start来生成静态页面的方法分析
Mar 09 PHP
jQuery EasyUI API 中文文档 - DateBox日期框
Oct 15 PHP
PHP正则提取不包含指定网址的图片地址的例子
Apr 21 PHP
Linux下安装oracle客户端并配置php5.3
Oct 12 PHP
php修改上传图片尺寸的方法
Apr 14 PHP
php单链表实现代码分享
Jul 04 PHP
php实现文章置顶功能的方法
Oct 20 PHP
使用正则去除php代码中的注释方法
Nov 03 PHP
php.ini中date.timezone设置详解
Nov 20 PHP
thinkPHP中钩子的使用方法实例分析
Nov 16 PHP
php curl获取到json对象并转成数组array的方法
May 31 PHP
PhpDocumentor 2安装以及生成API文档的方法
May 21 #PHP
Smarty模板学习笔记之Smarty简介
May 20 #PHP
php实例分享之mysql数据备份
May 19 #PHP
dedecms函数分享之获取某一栏目所有子栏目
May 19 #PHP
ECMall支持SSL连接邮件服务器的配置方法详解
May 19 #PHP
PHP小技巧之JS和CSS优化工具Minify的使用方法
May 19 #PHP
php开启openssl的方法
May 15 #PHP
You might like
教你如何解密 “ PHP 神盾解密工具 ”
2014/06/20 PHP
laravel-admin 管理平台获取当前登陆用户信息的例子
2019/10/08 PHP
利用javascript中的call实现继承
2007/01/22 Javascript
提示$ is not defined错误分析及解决
2013/04/09 Javascript
基于jQuery实现下拉框
2014/11/24 Javascript
javascript框架设计读书笔记之数组的扩展与修复
2014/12/02 Javascript
js实现带关闭按钮始终显示在网页最底部工具条的方法
2015/03/02 Javascript
JavaScript 事件对象介绍
2015/04/13 Javascript
jQuery实现简单下拉导航效果
2015/09/07 Javascript
JS常见问题之为什么点击弹出的i总是最后一个
2016/01/05 Javascript
Fullpage.js固定导航栏-实现定位导航栏
2016/03/17 Javascript
详解Backbone.js框架中的模型Model与其集合collection
2016/05/05 Javascript
js返回顶部实例分享
2016/12/21 Javascript
JS实现控制图片显示大小的方法【图片等比例缩放功能】
2017/02/18 Javascript
基于Bootstrap框架实现图片切换
2017/03/10 Javascript
js中DOM三级列表(代码分享)
2017/03/20 Javascript
JS库particles.js创建超炫背景粒子插件(附源码下载)
2017/09/13 Javascript
JS实现的简单表单验证功能示例
2017/10/13 Javascript
webpack+vue中使用别名路径引用静态图片地址
2017/11/20 Javascript
vuex进阶知识点巩固
2018/05/20 Javascript
Vue2 轮播图slide组件实例代码
2018/05/31 Javascript
[06:43]DAC2018 4.5 SOLO赛 Maybe vs Paparazi
2018/04/06 DOTA
使用Python机器学习降低静态日志噪声
2018/09/29 Python
Python发展史及网络爬虫
2019/06/19 Python
Python缓存技术实现过程详解
2019/09/25 Python
python给指定csv表格中的联系人群发邮件(带附件的邮件)
2019/12/31 Python
Python3+selenium实现cookie免密登录的示例代码
2020/03/18 Python
python利用platform模块获取系统信息
2020/10/09 Python
CheapTickets泰国:廉价航班,查看促销价格并预订机票
2019/12/28 全球购物
SheIn沙特阿拉伯:女装在线
2020/03/23 全球购物
vue项目实现分页效果
2021/03/24 Vue.js
优秀毕业生求职推荐信范文
2013/11/21 职场文书
大学生职业生涯规划范文
2014/01/22 职场文书
在校实习生求职信
2014/06/18 职场文书
供用电专业求职信
2014/07/07 职场文书
售后服务质量承诺书
2015/04/29 职场文书