Echarts在线免费图表

 
            
  let option = {
      xAxis: {
        type: 'value',
        min: 0,
        max: 12,
        axisLabel: {
          formatter: '{value}'
        },
        splitLine: {
          show: false  // 隐藏网格线
        },
        axisLine: {
          show: true,
          lineStyle: {
            color: '#fff',  // X 轴实线颜色
            type: 'solid',    // X 轴实线类型
            width: 2,
            dashOffset: 10
          }
        },
        axisTick: {
          show: false  // 隐藏刻度
        }

      },
      yAxis: {
        type: 'category',
        data: ['组1', '组2', '组3', '组4', '组5', '组6'],
        splitLine: {
          show: false  // 隐藏网格线
        },
        axisLine: {
          lineStyle: {
            color: '#fff',  // Y 轴实线颜色
            type: 'solid',    // Y 轴实线类型
            width: 2
          }
        },
        axisTick: {
          show: false  // 隐藏刻度
        },
      },
      series: [{
        type: 'bar',
        data: [1, 2, 3, 4, 5, 6],
        showBackground: true,
        backgroundStyle: {
          color: '#5A85B5'
        },
        barWidth: '15',
        itemStyle: {
          color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [
            { offset: 0, color: '#7effdb' },   // 渐变色起始颜色
            { offset: 1, color: '#FFA500' }    // 渐变色结束颜色
          ])
        },
        label: {
          show: true, //开启显示
          position: 'right', //在上方显示
          align: 'left',
          textStyle: {
            color: '#fff',
            fontSize: 12,
            fontWeight: 400,
          },
          //数值样式
          formatter: '{c}',
        },
      }]
    }