echarts修改上下左右的边距

对你何止一句中意

前端QQ群: 981668406 在此附上我的QQ: 2489757828 有问题的话可以一同探讨 我的github: 李大玄 我的私人博客: 李大玄 我的npm开源库: 李大玄
我的简书: 李大玄 我的CSDN: 李大玄 我的掘金: 李大玄 哔哩哔哩: 李大玄

import _ from 'lodash';
import { EChartOption } from 'echarts';
// 这里修改=============================================
const grid = {
  left: 10,
  right: 10,
  bottom: 40,
  top: 10,
  containLabel: true
};
// 这里修改=============================================
const xAxis: any = [
  {
    type: 'category',
    boundaryGap: false,
    data: [],
    axisLine: {
      show: true,
      lineStyle: {
        color: '#28428D',
      }
    },
    axisTick: {
      show: false
    },
  }
];

const yAxis: any = [
  {
    type: 'value',
    name: '',
    nameLocation: 'start',
    axisLabel: {
      fontSize: 12,
      color: '#5C7AD1'
    },
    nameTextStyle: {
      fontSize: 12,
      color: '#5C7AD1'
    },
    axisTick: {
      show: false
    },
    axisLine: {
      show: false
    },
    splitLine: {
      show: true,
      lineStyle: {
        color: '#28428D'
      }
    },
  },
];

const textStyle = {
  color: '#fff'
};

let views: number[] = [];
let reportDates: string[] = [];
// let clicks: number[] = [];

function getOption (view: number, reportDate: string): EChartOption {
  const xAxisClone = _.cloneDeep(xAxis);

  views.push(view);
  reportDates.push(reportDate);

  xAxisClone[0].data = reportDates;
  
  if (views.length >= 5) {
    views = views.slice(-5);
  }
  if (reportDates.length >= 5) {
    reportDates = reportDates.slice(-5);
  }

  return {
    color: ['#4EE5F8', '#5C7AD1'],
    grid,
    xAxis: xAxisClone,
    yAxis,
    textStyle,
    series: [
      {
        name: '曝光',
        type: 'line',
        stack: 'data-view',
        areaStyle: {},
        yAxisIndex: 0,
        symbol:'none',
        smooth: true,
        data: views
      }
    ],
  };
}

export default getOption;