Echarts在线免费图表

 
            //亮色图片


var zongjine = [2000, 3000, 4000, 5000, 6000, 7000];
var xingm = ['广州市粤芯12英寸集成电路生产线项目', '广州市美华航空电子研发建设项目', '欣旺达汇总新能源项目', '广州市中国电科华南电子信息产业园项目', '东莞欧菲光电影像产业项目'];
option = {
   xAxis: [{
      show: false,
   },
   //由于下边X轴已经是百分比刻度了,所以需要在顶部加一个X轴,刻度是金额,也隐藏掉
   {
      show: false,
   }
   ],
   yAxis: [{
      type: 'category',
      axisLabel: {
         show: false, //让Y轴数据不显示
      },
      itemStyle: {

      },
      axisTick: {
         show: false, //隐藏Y轴刻度
      },
      axisLine: {
         show: false, //隐藏Y轴线段
      },
      data: xingm,
   }, {
      show: true,
      inverse: true,
      data: zongjine,
      axisLabel: {
         show: false
      },
      axisLine: {
         show: false
      },
      splitLine: {
         show: false
      },
      axisTick: {
         show: false
      },
   }],
   series: [

      //蓝条--------------------我是分割线君------------------------------//
      {
         show: true,
         type: 'bar',
         barGap: '-100%',
         barWidth: 22, //统计条宽度
         itemStyle: {
            color: "#707dff"
         },
         label: {
            show: true,
            position: "insideRight"
         },
         max: 1,
         labelLine: {
            show: false,
         },
         z: 2,
         data: zongjine,
      },
      //数据条--------------------我是分割线君------------------------------//
      {
         show: true,
         type: 'bar',
         xAxisIndex: 1, //代表使用第二个X轴刻度!!!!!!!!!!!!!!!!!!!!!!!!
         barGap: '-100%',
         barWidth: 22, //统计条宽度
         itemStyle: {
            color: 'transparent'
         },
         label: {
            show: true,
            //label 的position位置可以是top bottom left,right,也可以是固定值
            //在这里需要上下统一对齐,所以用固定值
            position: [0, '-100%'],
            rich: {
               gray: {
                  color: '#7e7e7e'
               }
            },
            formatter: function (data) {
               //富文本固定格式{colorName|这里填你想要写的内容}
               return '{gray|' + xingm[data.dataIndex] + '}';

            },
         },
         data: zongjine
      }

   ]
};