echart画饼图

2020-02-13  本文已影响0人  前端来入坑
<script src="echarts.js"></script>
<div id="pie" style="width: 100%;height: 300px;"></div>
          function pie(piedata) {
            // 基于准备好的dom,初始化echarts实例
            var myChart2 = echarts.init(document.getElementById('pie'));

            // 指定图表的配置项和数据
            var option = {
                color: ['#00A1E9', '#7AD038', '#F1C14F' ],
                series: [{
                    name: '',
                    type: 'pie',
                    radius: '55%',
                    center: ['50%', '55%'],
                    data: piedata,
                    // data: jyzbdata,
                    itemStyle: {
                        emphasis: {
                            shadowBlur: 10,
                            shadowOffsetX: 0,
                            shadowColor: 'rgba(0, 0, 0, 0.5)'
                        },
                        normal: {
                            label: {
                                textStyle: {
                                    fontSize: '130%'
                                }
                            }
                        }
                    },
                    label: {
                        normal: {
                            show: true,
                            formatter: '{b}' + '\n\r' + '{d}%',
                        }
                    }
                }]
            };

            // 使用刚指定的配置项和数据显示图表。
            myChart2.setOption(option);
        }

        var piedata = [{value: 10, name: '分类一'},{value: 30, name: '分类二'},{value: 60, name: '分类三'}];
        pie(data);
上一篇下一篇

猜你喜欢

热点阅读