SOURCE

console 命令行工具 X clear

                    
>
console
window.onload = () => {
    var myChart = echarts.init(document.getElementById('main'));
    // var myChart = echarts.init(document.getElementById('main'),'dark'); // 第二个参数是主题
    myChart.setOption({
        backgroundColor : '#2c343c', // 全局背景色
        visualMap : { // 效果跟实例上并不一致,可能版本变更
            show: false,
            min: 80,
            max: 600,
            inRange: {
                colorLightness: [0 , 1]
            },
        },
        // textStyle : { // 全局的文本样式
        //     color : 'rgba(255,255,255,1)',
        // },
        // labelLine : { // 线条颜色
        //     lineStyle : {
        //         color : 'rgba(255,255,255,1)',
        //     }
        // },
        // itemStyle: { // 扇形样式
        //   color: '#c23531', // 扇形颜色
        //   shadowBlur : 200,
        //   shadowColor : 'rgba(0,0,0,0.5)',
        // },
        series : [
            {
                name : '访问来源',
                type : 'pie', // 饼图
                radius : '55%',
                roseType : 'angle', // 南丁格尔图

                // 此系列的调色盘
                color: ['#dd6b66','#759aa0','#e69d87','#8dc1a9','#ea7e53','#eedd78','#73a373','#73b9bc','#7289ab', '#91ca8c','#f49f42'],
                data : [
                    {value:235, name:'视频广告'},
                    {value:274, name:'联盟广告'},
                    {value:310, name:'邮件营销'},
                    {value:335, name:'直接访问'},
                    {value:400, name:'搜索引擎'},
                ],
                label : { // 每个文本
                    normal : {
                        textStyle : {
                            color: 'rgba(255,255,255,1)',
                        }
                    }
                },
                labelLine : { // 每个线条
                    normal: {
                        lineStyle: {
                            color: 'rgba(255,255,255,1)',
                        }
                    }
                },
                // itemStyle: { // 每个扇形
                //     normal : {
                //         color: '#c23531',
                //         shadowBlur: 200,
                //         shadowColor: 'rgba(0,0,0,0.5)',
                //     },
                // },
                // 高亮样式。
                emphasis: {
                    itemStyle: {
                        // 高亮时点的颜色。
                        color: 'blue'
                    },
                    label: {
                        show: true,
                        // 高亮时标签的文字。
                        formatter: 'This is a emphasis label.'
                    }
                },
            }
        ]
    })
}
<div id="main" style="width: 600px;height: 400px;"></div>

本项目引用的自定义外部资源