Echarts在线免费图表

 
            const monthList = Array.from(new Array(12), ((m, i) => (i + 1 + "月")));
const seriesData = monthList.map(name => {
   return {
      name: name,
      type: "line",
      symbolSize: 0, //标记的大小
      data: Array.from(new Array(12), (() => (Math.random() * 100))),
      markLine: {
         silent: true,
         lineStyle: {
            type: "solid"
         },
         data: [
            {
               yAxis: Math.random() * 100
            },
         ]
      },
   }
})
const color = [
   "#fa8d49", "#ebc93d", "#62dc82", "#7692fe",
   "#fab27b", "#f3715c", "#401c44", "#afb4db",
   "#f2eada", "#5e7c85", "#ffd400", "#817936"
];
option = {
   color: color,
   backgroundColor:'white',
   tooltip: {
      trigger: "axis",
      backgroundColor: "rgba(1, 13, 19, 0.5)",
      borderWidth: 1,
      axisPointer: {
         type: "shadow"
      },
      formatter: function (params) {
         var str = "";
         if (params.length > 0) {
            str = params[0].name + "<br/>";
         }
         for (var i = 0; i < params.length; i++) {
            if (params[i].seriesName !== "") {
               str += params[i].seriesName + ":" + params[i].value + "<br/>";
            }
         }
         return str;
      },
      textStyle: {
         color: "rgba(212, 232, 254, 1)"
      },
      extraCssText: "z-index:2"
   },
   xAxis: {
      type: "category",
      data: monthList,
      axisLine: {
         show: false
      },
      axisTick: {
         show: false
      },
      axisLabel: {
         show: true,
         textStyle: {
            color: "#393939" //X轴文字颜色
         }
      }
   },
   yAxis: [
      {
         type: "value",
         axisLine: {
            show: false,
            lineStyle: {
               color: "#eeeeee"
            }
         },
         axisTick: {
            show: false
         },
         axisLabel: {
            color: "#393939",
            fontSize: 14
         },
         splitLine: {
            show: true,
            lineStyle: {
               color: "#e7e9ef",
               type: "dashed"
            }
         }
      }
   ],
   series: seriesData
};