Echarts在线免费图表

 
            let yData = [2001, 2588, 3242, 4465, 3000, 1203, 857];
let xData = ['2023-12-11', '2023-12-12', '2023-12-13', '2023-12-14', '2023-12-15', '2023-12-16', '2023-12-17'];
let maxData = Math.max.apply(null, yData);

option = {
   grid: {
      top: "10%",
      bottom: "15%",
      right: "15%"
   },
   tooltip: {
      show: true,
      trigger: 'axis',
      backgroundColor: '#fff',
      textStyle: {
         color: '#333',
      },
      borderColor: '#eee'
   },
   xAxis: {
      type: 'category',
      data: xData,
      axisLine: {
         show: false //隐藏X轴轴线
      },
      axisTick: {
         show: false //隐藏X轴轴线
      },

      axisLabel: {
         show: true,
         margin: 14,
         fontSize: 16,
         textStyle: {
            color: "#758396" //X轴文字颜色
         }
      }
   },
   yAxis: {
      type: "value",
      min: 0,
      // max: maxData,
      // interval: 25,
      // splitNumber: 4,
      splitLine: {
      show: true,
      lineStyle: {
         color: "rgba(52,78,130,0.2)",
         width: 2
      }
      },
      axisTick: {
      show: false
      },
      axisLine: {
      show: true,
      lineStyle: {
         color: "rgba(52,78,130,0.2)"
      }
      },
      axisLabel: {
      show: true,
      margin: 14,
      fontSize: 16,
      textStyle: {
         color: "#758396"
      }
      }
   },
   series: {
      name: "登陆用户数",
      type: "line",
      smooth: true, //平滑曲线显示
      showAllSymbol: false, //显示所有图形。
      symbolSize: 5,
      symbolColor: '#eee',
      symbol: 'circle',
      lineStyle: {
      width: 3,
      color: '#3C97F2'
      },
      itemStyle: {
      color: '#3C97F2',
      shadowColor: '#3C97F2',
      shadowBlur: 10,
      borderColor: '#3C97F2',
      borderWidth: 2,
      },
      areaStyle: {
      color: {
         colorStops: [{
            offset: 0,
            color: 'rgba(50, 147, 255, 1)' // 0% 处的颜色
         },
         {
            offset: 1,
            color: '#eee' // 100% 处的颜色
         }
         ]
      }
      },
      // symbolOffset: [0,-0],
      data: yData,
      z: 15,
      zlevel: 2
   }
}