Echarts在线免费图表

 
              var datas = [];
  var probSeveritys=
  [
     {severity:"一般",count:100,percent:60},
  {severity:"严重",count:4,percent:30},
  {severity:"较严重",count:3,percent:20},
  {severity:"重大",count:1,percent:10}
  ];
    probSeveritys.forEach(data => {
      var color="";
      if(data.severity=='一般'){
        color='#F1D90B';
      }else if(data.severity=='严重'){
        color='#F3B50B';
      }else if(data.severity=='较严重'){
        color='#F3730B';
      }else{
        color='#F3370B'
      }
      datas.push({ name: data.severity, value: data.count,percent:data.percent, itemStyle:{color:color}});
    })
    datas.reverse()
    option = {
       backgroundColor:"#333333",
      calculable: true,
      color: ['#F3370B', '#F3730B', '#F3B50B', '#F1D90B'],
      series: [
        {
          name: '漏斗图',
          type: 'funnel',
          left: '5%',
          top: '10%',
          bottom: '10%',
          width: '50%',
          min: 100,
          max: 0,
          minSize: '0%',
          maxSize: '100%',
          gap: 10,
          label: {
            show: true,
            formatter: function (value) {
              var formatterData=value.data;
              return '{a|' + formatterData.name + '}  {b|' + formatterData.percent + '}{un|%}  {c|' + formatterData.value + '}{un|个}'
            },
            rich: {
              a: {
                color: '#ffffff',
                fontSize: 14,
                fontWeight:"900",
              },
              b: {
                color: 'auto',
                fontSize: 16,
                fontWeight:"900",
                textBorderWidth:0  //去掉字体的白色外框
              },
              c: {
                // color: auto,
                fontSize: 16,
                fontWeight:"900",
                textBorderWidth:0  //去掉字体的白色外框
              },
              un:{
                color: '#ffffff',
                fontSize: 14
              }
            }
          },
          labelLine: {
            length: 50,
            lineStyle: {
              width: 1,
              type: 'solid'
            }
          },
          itemStyle: {  //去掉默认白色边框线
            borderWidth: 0,
            borderColor: '#fff'
          },
          data: datas,
          colorBy: "data"
        }
      ]
    }