用Echarts2画饼图配置 itemStyle

首先去百度下载Echarts2,然后引入。
默认的案例够画饼图了,但是我为了去除饼图的指示线和指示名称,所以用了itemStyle。


<script type="text/javascript">
    require.config({
        paths : {
            'echarts' : 'js/echarts',
            'echarts/chart/pie' : 'js/echarts'
        }
    });

    // 使用
    require(
            [ 
              'echarts', 'echarts/chart/pie' // 按需加载
            ],
            function(ec) {
                var myChart = ec.init(document.getElementById('main2'));
                var option = {
                        tooltip: {
                            trigger: 'item',
                            formatter: "{a} <br/>{b}: {c} ({d}%)"
                        },
                        color:['#AD3733', '#CD5C5C'], 

                        series: [
                            {
                                type:'pie',
                                radius: ['20%', '60%'],
                                avoidLabelOverlap: false,
                                itemStyle: {
                                            normal: {
                                                label: {
                                                    show: true,
                                                    //formatter: '{d}%'
                                                },
                                                labelLine: {
                                                    show: true
                                                }
                                            },
                                            emphasis: {
                                                label: {
                                                    show: true
                                                },
                                                labelLine: {
                                                    show: true
                                                }
                                            }
                                        },
                                data:[
                                     {value:1200, name:'未超时',selected:true},
                                     {value:315, name:'超时'}
                                ]
                            }
                        ]
                    };

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

版权声明:本文为woerry原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。