Echarts在线免费图表

 
              let option = {
    backgroundColor: 'blck',

    tooltip: {
      trigger: 'axis',
      backgroundColor: "rgba(1, 13, 19, 0.5)",
      borderWidth: 0,
      axisPointer: { // 坐标轴指示器，坐标轴触发有效
        type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
      },
      textStyle: {
        color: "rgba(212, 232, 254, 1)",
        // fontSize: fontChart(0.24),
      },
      confine: true
    },
    grid: {
      top: '25%',
      left: '5%',
      right: '5%',
      bottom: '8%',
      containLabel: true,
    },
    
    xAxis: {
      type: 'category',
      data: ['11', '12', '13', '14'],
      axisLine: {
        show: false,
        lineStyle: {
          color: '#ECECEC'
        }
      },
      axisTick: {
        show: false,
      },
      axisLabel: {
        // interval: 0,
        // rotate: 40,
        show: true,
        textStyle: {
          fontFamily: 'Microsoft YaHei',
          color: '#fff'
        }
      },
    },

    yAxis: {
      name: '',
      nameTextStyle: {
        color: "#000",
        fontFamily: "Alibaba PuHuiTi",
        fontSize: 14,
        fontWeight: 600,
        padding: [10, 0, 0, -30]
      },
      nameGap: 25,  // 表现为上下位置
      type: 'value',
      //max:'5000',
      axisLine: {
        show: false,
        lineStyle: {
          color: '#666666',
        }
      },
      splitLine: {
        show: true,
        lineStyle: {
          color: '#eff6ff'
        }
      },
      axisLabel: {
        textStyle: {
          fontFamily: 'Microsoft YaHei',
          color: '#fff',
          fontSize: 12
        }
      }
    },
    series: [{
      name: '因毒失驾车辆预警',
      type: 'bar',
      barWidth: '25',
      itemStyle: {
        normal: {
          color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
            offset: 0,
            color: '#2a77ea'
          }, {
            offset: 1,
            color: '#00c0fa'
          }]),

        },
      },
      data: [3000, 2000, 1500, 2500,]
    },
    ]
  };