Echarts在线免费图表

 
            let xAxisData = ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'];
let legendData = ['销售额', '订单量'];
let serieData = [];
let metaDate = [
   ['', 58, 58.5, 59.3, 58, 57, 56, 55.5, 55.8, 56, 56.1, 56.2, 59],
   [58, 59, 61, 54, 53, 51, 51, 53, 58, 58, 57, 57]
];

for (let v = 0; v < legendData.length; v++) {
   let serie = {
      name: legendData[v],
      type: 'line',
      symbol: "none",
      symbolSize: 10,
      data: metaDate[v]
   };
   serieData.push(serie);
}
let colors = ["#46F0CB", "#F5D527 "];
option = {
   backgroundColor: '#032927',
   legend: {
      show: true, left: "right", data: legendData, y: "5%",
      itemWidth: 12, itemHeight: 12, textStyle: { color: "#D4F6F6", fontSize: 14 },
   },
   color: colors,
   grid: { left: '2%', top: "12%", bottom: "5%", right: "5%", containLabel: true },
   tooltip: { trigger: 'axis', axisPointer: { type: 'shadow' } },
   xAxis: [
      {
         type: 'category',
         axisLine: { show: true, lineStyle: { color: '#D4F6F6' } },
         axisLabel: { interval: 0, textStyle: { color: '#D4F6F6', fontSize: 14 } },
         axisTick: { show: false },
         data: xAxisData,
      },
   ],
   yAxis: [
      {
         type: 'value',
         name: "单位：万元",
         nameTextStyle: {
            color: "#D4F6F6",
            fontFamily: "Alibaba PuHuiTi",
            fontSize: 14,
            // fontWeight: 600,
            padding: [0, 0, 0, 30]
         },
         splitLine: {

         },
         axisTick: { show: false },
         splitLine: {
            lineStyle: {
               type: 'dashed'//虚线
            },
            show: true //隐藏
         },
         axisLabel: { textStyle: { color: '#D4F6F6', fontSize: 14 } },
         axisLine: { show: true, lineStyle: { color: '#D4F6F6' } },
      },
   ],
   series: serieData
};