一.js对象
data:[ {value:335, name:'直接访问'},
{value:310, name:'邮件营销'},
{value:274, name:'联盟广告'},
{value:235, name:'视频广告'},
{value:400, name:'搜索引擎'}
]
二.php对象
$data=array( array ('value'=>335, 'name'=>'直接访问'), array ('value'=>310, 'name'=>'邮件营销'), array ('value'=>274, 'name'=>'联盟广告'), array ('value'=>235, 'name'=>'视频广告'), array ('value'=>100, 'name'=>'搜索引擎'), );
转化js对象:'data'=>json_encode($data),
三.js文件
<script type="text/javascript"> // 基于准备好的dom,初始化echarts实例 var myChart = echarts.init(document.getElementById('main')); var jsData=<?=$data?>; // 指定图表的配置项和数据 option = { backgroundColor: '#2c343c', title: { text: 'Customized Pie', left: 'center', top: 20, textStyle: { color: '#ccc' } }, tooltip : { trigger: 'item', formatter: "{a} <br/>{b} : {c} ({d}%)" }, visualMap: { show: false, min: 80, max: 600, inRange: { colorLightness: [0, 1] } }, series : [ { name:'访问来源', type:'pie', radius : '55%', center: ['50%', '50%'], data:jsData.sort(function (a, b) { return a.value - b.value; }),//. roseType: 'radius', label: { normal: { textStyle: { color: 'rgba(255, 255, 255, 0.3)' } } }, labelLine: { normal: { lineStyle: { color: 'rgba(255, 255, 255, 0.3)' }, smooth: 0.2, length: 10, length2: 20 } }, itemStyle: { normal: { color: '#c23531', shadowBlur: 200, shadowColor: 'rgba(0, 0, 0, 0.5)' } }, animationType: 'scale', animationEasing: 'elasticOut', animationDelay: function (idx) { return Math.random() * 200; } } ] }; // 使用刚指定的配置项和数据显示图表。 myChart.setOption(option); </script>