EChats结合PHP,MYSQL，利用ajax动态数据添加。

最新推荐文章于 2022-10-06 19:40:42 发布

置顶 Hunaiyo

最新推荐文章于 2022-10-06 19:40:42 发布

阅读量4.5k

点赞数

分类专栏： echarts 文章标签：数据 mysql ajax php 数据库

本文链接：https://blog.csdn.net/u012312373/article/details/38503793

版权

echarts 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

用过echarts的人对于它的亮点我就不多说啦，下面我就分享一下我最近发现的一些小想法吧。

1、我首先建立VisualService.php用来对数据的操作。

      源代码：
<?php
require_once 'SQLHelper.php';
    $str=$_POST['name'];
   if($str=="Pie"){
       $help=new SQLHelper() ;
        $sql="select name,value from Pie";
        $result=$help->execute_dql($sql);
        $result=json_encode($result);
        echo $result;
    }
    else if($str=="Bar"){
   $help=new SQLHelper();
   $sql="select year,guangdong,jiangsu,shandong from bar";
   $result=$help->execute_dql($sql);
   $result=json_encode($result);
   echo $result;
}else {
   echo "程序执行完毕";
}

?>

先将数据从数据库里面取出来，然后转化为json格式，传到前台。SQLHelper()是我自己封装的一个对数据库执行的类，可以用我们平时用的Mysql数据库操作语言代替。下面我们来看看前台代码。

该数据是从JSon数组里面提取出来，通过后台返回的msg数组将其取出，然后放入一个数组中，再返回给data，值得一提的是，请记住方法的最后必须得有()不然，图是出不来的。具体什么原因，我也在探索中哦，希望会的朋友也多想想。
                                       var arr=new Array();
                                       for(var i=0;i<msg.length;i++){
                                           arr.push(msg[i].name);
                                       }
                                       return arr;
                                    }()
                                },
                                toolbox: {
                                    show : true,
                                    feature : {
                                        mark : {show: true},
                                        dataView : {show: true, readOnly: false},
                                        restore : {show: true},
                                        saveAsImage : {show: true}
                                    }
                                },
                                calculable : true,
                                series : [
                                    {
                                        name:'产业结果',
                                        type:'pie',
                                        radius : '55%',
                                        center: ['50%', '60%'],
                                        data:function(){
                                           var arr=[];
                                           for(var i=0;i<msg.length;i++)
                                               {
                                                   arr.push({
                                                       name:msg[i].name,
                                                       value:msg[i].value
                                                   });
                                               }
                                           return arr;
                                        }()
                                    }
                                ]
                           };


                        myChart.setOption(option);
                    }
            );
           }
       });
</script>