Echarts在线免费图表

 
            let xData = ["2015", "2016","2017"]
let seriesData = [
   {
      name: "营业总收入",
      value: [95.04, 96.13, 94.76]
   },
   {
      name: "营业总成本",
      value: [94.96, 96.02, 94.68]
   },
   {
      name: "净利润",
      value: [-94.96, -96.02, -94.68]
   },
   {
      name: "归属母公司净利润",
      value: [-94.96, -96.02, -94.68]
   }
]
option = {
   grid: {
        left: '4%',
        right: '6%',
        bottom: '15%',
        top: '23%',
        containLabel: true,
      },
   color: ["rgb(91, 143, 249)", "rgb(90, 216, 166)","rgb(93, 112, 146)","rgb(246, 189, 22)"],
   tooltip: {
      trigger: "axis",
   },
   legend: {
      data: seriesData,
      right: '4%',
        top: '10%',
        align: 'left',
        itemHeight: 10,
        icon: 'rect',
        itemWidth: 8,
        itemHeight: 8,
        borderRiudis:'50%',
        textStyle: {
         fontSize: 14,
         color:"#333"
      }
   },
   xAxis: {
        axisLine: {
          show: false, //隐藏X轴轴线
          lineStyle: {
            color: '#555f58'
          }
        },
        axisLabel: {
          interval: 0,
          formatter:(name)=>{
            return `${name}年`
          },
          textStyle: {
            color: '#333' //坐标轴字颜色
          },
          margin: 15
        },
        axisTick: {
          show: false //隐藏X轴刻度
        },
        splitLine: {     //网格线
          show: false
        },
        data: xData,
        type: "category"
      },
   yAxis:{
        axisLine: {
          show: true, //隐藏X轴轴线
          lineStyle: {
            color: 'rgba(220,220,220,0.3)'
          }
        },
        axisTick: {
          show: false //隐藏X轴刻度
        },
        axisLabel: {
          textStyle: {
            color: '#333'
          }
        },
        splitLine: {     //网格线
          show: true,
          lineStyle: {
            color: 'rgba(220,220,220,0.3)'
          }
        }
      },
   series: function () {
      let series = []
      for (let i = 0; i < seriesData.length; i++) {
         let serie = {
            name: seriesData[i].name,
            type: "bar",
            barWidth: "13%",
            data: seriesData[i].value
         }
         series.push(serie)
      }
      return series
   }()
}