Echarts在线免费图表

 
            var myColor = ['#62dcaa', '#dca762', '#e36b8a', '#d7c24b', '#62c6dc', '#62dc6d', '#dc62b2', '#9962dc', '#62a4dc',
   '#626edc'
];
var option = {
   backgroundColor: '#010414',
   grid: {
      left: '10%',
      top: '10',
      right: '3%',
      bottom: '10',
      containLabel: true
   },
   xAxis: [{
      show: false,
   }],
   yAxis: [{
      axisTick: 'none',
      axisLine: 'none',
      offset: '27',
      axisLabel: {
         textStyle: {
            color: '#fff',
            fontSize: '12',
            align: 'center',
         }
      },
      data: ['其他', '骨伤', '损伤', '创伤', '伤筋', '脱位', '骨折', '皮肤', '脾', '肺']
   }, {
      axisTick: 'none',
      axisLine: 'none',
      axisLabel: {
         textStyle: {
            color: '#fff',
            fontSize: '12',
            align: 'center'
         }
      },
      data: ['10', '9', '8', '7', '6', '5', '4', '3', '2', '1']
   }, {
      name: '单位：件',
      nameGap: '5',
      nameTextStyle: {
         color: '#fff',
         fontSize: '10',
      },
      show: false,
      axisLine: {
         lineStyle: {
            color: 'rgba(0,0,0,0)'
         }
      },
      data: [],
   }],
   series: [{
         name: '条',
         type: 'bar',
         yAxisIndex: 0,
         gap: 2,
         data: [52, 60, 22, 33, 44, 78, 59, 15, 11, 58],
         barWidth: 5,
         barHight: 5,
         itemStyle: {
            normal: {
               color: function(params) {
                  var num = myColor.length;
                  return myColor[params.dataIndex % num]
               },
            }
         },
         z: 2
      }, {
         name: '白框',
         type: 'bar',
         yAxisIndex: 1,
         barGap: '-100%',
         data: [99.5, 99.5, 99.5, 99.5, 99.5, 99.5, 99.5, 99.5, 99.5, 99.5],
         barWidth: 12,
         itemStyle: {
            normal: {
               color: '#fff',
               barBorderRadius: 12,
            }
         },
         z: 1
      }, {
         name: '外框',
         type: 'bar',
         yAxisIndex: 2,
         barGap: '-100%',
         data: [100, 100, 100, 100, 100, 100, 100, 100, 100, 100],
         barWidth: 14,
         itemStyle: {
            normal: {
               color: function(params) {
                  var num = myColor.length;
                  return myColor[params.dataIndex % num]
               },
               barBorderRadius: 14,
            }
         },
         z: 0
      },
      {
         name: '外圆',
         type: 'scatter',
         hoverAnimation: false,
         data: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
         yAxisIndex: 2,
         symbolSize: 14,
         itemStyle: {
            normal: {
               color: function(params) {
                  var num = myColor.length;
                  return myColor[params.dataIndex % num]
               },
               opacity: 1,
            }
         },
         z: 2
      }
   ]
};