Echarts在线免费图表

 
            let barData = {
   name: '出库',
   data: [100, 110, 130, 90, 100, 102, 110,100],
   name: '入库',
   data2: [115, 225, 110, 135, 200, 260, 100, 190],
   xAxis: ['04-18', '04-19', '04-20', '04-21', '04-22', '04-23','04-24'],
}
let option = {
   //你的代码
   backgroundColor: "#081A52",
   tooltip: {
      trigger: 'axis',
      axisPointer: {
         // 坐标轴指示器，坐标轴触发有效
         type: 'shadow', // 默认为直线，可选为：'line' | 'shadow'
      },
   },
   legend: {
      show: true,
      top: 50,
      right: 50,
      itemGap: 20,
      textStyle: {
         color: '#fff',
      },
   },
   grid: {
      top: '18%',
      left: '3%',
      right: '3%',
      bottom: '2%',
      containLabel: true,
   },
   xAxis: [
      {
         type: 'category',
         data: barData.xAxis,
         axisTick: {
            show: false,
            alignWithLabel: true,
         },
         axisLine: {
            lineStyle: {
               color: '#394458',
            },
         },
         axisLabel: {
            interval: 0,
            margin: 10,
            color: '#05D5FF',
            textStyle: {
               fontSize: 14,
               color: '#fff'
            },
         },
      },
   ],
   yAxis: [
      {
         type: 'value',
         axisLabel: {
            formatter: '{value}',
            color: 'rgba(95, 187, 235, 1)',
            textStyle: {
               fontSize: 14,
               color: '#fff',
               lineHeight: 16
            },
         },
         axisTick: {
            show: false,
         },
         axisLine: {
            lineStyle: {
               color: '#394458',
            },
         },
         splitLine: {
            lineStyle: {
               color: '#394458',
            },
         },
      },
   ],
   series: [
      {
         name: '入库',
         type: 'bar',
         barWidth: '12',
         data: barData.data,
         itemStyle: {
            normal: {
               color: 'rgba(255, 204, 0,.3)',
               borderColor: '#ffcc00',
            },
         },
      },
      {
         name: '出库',
         type: 'bar',
         barWidth: '12',
         data: barData.data2,
         itemStyle: {
            normal: {
               color: 'rgba(0, 255, 255, 0.3)',
               borderColor: '#00ffff',
            },
         },
      },
   ],
};