Home > Backend Development > PHP Tutorial > echarts 通过php 动态填充数据,请赐教,谢谢!

echarts 通过php 动态填充数据,请赐教,谢谢!

WBOY
Release: 2016-06-23 13:26:13
Original
1243 people have browsed it

我的显示页面:

  <script type="text/javascript">         function xName()		 {				var arr=new Array();				$.ajax(				{					url:"http://localhost:8080/POS/dbfun/report.db.php",					dataType:"json",					async:false,					success:function(data)					{						//调用函数获取值,转换成数组模式												 //var ss=eval(data);						 // alert(111);						 //for(var i=0;i<ss.length;i++)						 //{						 //  arr.push(ss[i].day);						 //  alert(arr[i]);						 //}                         //var ss=data[0].day;						 //alert(ss);				    },					timeout: 5000,                      error: function (XMLHttpRequest, textStatus, errorThrown) 						{                                                 alert(errorThrown); 						}				 				});				return arr;		}               // 路径配置        require.config({            paths:{                 'echarts' : '../echarts/ejs/echarts',                'echarts/chart/pie' : '../echarts/ejs/echarts'            }        });                        // 使用        require(            [                'echarts',                'echarts/chart/pie',				'echarts/chart/bar' // 使用柱状图就加载bar模块,按需加载            ],            function (ec) {                // 基于准备好的dom,初始化echarts图表                var myChart = ec.init(document.getElementById('main'));                                 //option = {                //	    title : {                //	        text: '某站点用户访问来源',               // 	        subtext: '纯属虚构',               // 	        x:'center'               // 	    },               // 	    tooltip : {               // 	        trigger: 'item',               // 	        formatter: "{a} <br/>{b} : {c} ({d}%)"               // 	    },               // 	    legend: {               // 	        orient : 'vertical',               // 	        x : 'left',               // 	        data:['直接访问','邮件营销','联盟广告','视频广告','搜索引擎']               // 	    },                //	    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:[               // 	                {value:335, name:'直接访问'},               // 	                {value:310, name:'邮件营销'},               // 	                {value:234, name:'联盟广告'},               // 	                {value:135, name:'视频广告'},               // 	                {value:1548, name:'搜索引擎'}               // 	            ]               // 	        }               // 	    ]               // 	};               			   option = {					title : {						text: '某地区蒸发量和降水量',						subtext: '纯属虚构'					},					tooltip : {						trigger: 'axis'					},					legend: {						data:['蒸发量','降水量']					},					toolbox: {						show : true,						feature : {							mark : {show: true},							dataView : {show: true, readOnly: false},							magicType : {show: true, type: ['line', 'bar']},							restore : {show: true},							saveAsImage : {show: true}						}					},					calculable : true,					xAxis : [						{							type : 'category',							data : ['1月','2月','3月','4月','5月','6月','7月','8月','9月','10月','11月','12月']						}					],					yAxis : [						{							type : 'value'						}					],					series : [						{							name:'蒸发量',							type:'bar',							data:[2.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6, 162.2, 32.6, 20.0, 6.4, 3.3],							markPoint : {								data : [									{type : 'max', name: '最大值'},									{type : 'min', name: '最小值'}								]							},							markLine : {								data : [									{type : 'average', name: '平均值'}								]							}						},						{							name:'降水量',							type:'bar',							data:[2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3],							markPoint : {								data : [									{name : '年最高', value : 182.2, xAxis: 7, yAxis: 183, symbolSize:18},									{name : '年最低', value : 2.3, xAxis: 11, yAxis: 3}								]							},							markLine : {								data : [									{type : 'average', name : '平均值'}								]							}						}					]				};                // 为echarts对象加载数据                 myChart.setOption(option);             }        );         </script>
Copy after login


这个链接:
http://localhost:8080/POS/dbfun/report.db.php
获取的数据格式是json
[{"total":"167","day":"20"},{"total":"650","day":"21"}]
Copy after login


请问我需要怎么修改代码,让数据能填充到echars 里面去,谢谢!


回复讨论(解决方案)

我的$.ajax 怎么不执行,没有进入success  也没报错,请问是怎么回事?

http://ask.csdn.net/questions/161294#answer_30688

我也想知道这个问题的答案,不知道楼主有没有解决,求解决方案476926020@qq.com,谢谢了

source:php.cn
Statement of this Website
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
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template