Echarts在线免费图表

 
            let data = [
   { value: 666, name: '刘亦菲' },
   { value: 193, name: '赵丽颖' },
   { value: 300, name: '刘诗诗' },
   { value: 200, name: '高圆圆' },
   { value: 200, name: '古力娜扎' },
];
let color = [
   '#98EECC', '#FF78C4', '#E4A5FF', '#30A2FF', '#FC4F00'
];
data.map((v, k) => {
   v['itemStyle'] = {
      borderColor: color[k],
      borderWidth: 6,
   }
})
option = {
   backgroundColor: "#000",
   color: color,
   series: [
      {
         name: '',
         type: 'pie',
         radius: ['40%', '70%'],
         center: ['50%', '50%'], // 修改为居中
         emphasis: {
            label: {
               show: true
            },
            scale: false,
            scaleSize: 0,
            labelLine: {
               show: true,
               lineStyle: {
                  color: "#fff"
               }
            },
            itemStyle: {
               borderColor: "#fff"
            }
         },
         label: {
            show: false,
            color: '#fff',
            // formatter: '{name|{b}}\n\n{num|{c}}条 {zb|{d}}%',
            formatter: (fp)=>{
               console.log(fp)
               return `{name|${fp.data.name}}\n\n{num|${fp.data.value}}条 {zb|${fp.percent}}%`
            },
            position: 'outside',
            distanceToLabelLine: -40,
            rich: {
               num: {
                  fontSize: 12,
                  color: '#0be5ff'
               },
               zb: {
                  fontSize: 12,
                  color: '#0be5ff'
               }
            }
         },
         labelLine: {
            show: false,
            length: 40,
            length2: 50,
         },
         data: data
      }
   ]
};

let bu = 0;
setInterval(() => {
   if (bu > data.length) {
      bu = 0
   }
   myChart.dispatchAction({
      type: 'highlight',//默认显示江苏的提示框
      seriesIndex: 0,//这行不能省
      dataIndex: bu
   });
   myChart.dispatchAction({
      type: 'downplay',//默认显示江苏的提示框
      seriesIndex: 0,//这行不能省
      dataIndex: bu - 1
   });
   bu++
}, 1000)