grid直角坐标系内绘图网格

简介：

单个 grid 内最多可以放置上下两个 X 轴，左右两个 Y 轴，可以绘制折线，散点，柱状图
可以是对象，只绘制一个坐标系，可以是数组，绘制多个坐标系，如：

多个坐标系

多个X轴Y轴，要设置相应的xAxis和yAxis轴数据，并和series中对应上
例：

grid: [
    { left: '7%', top: '7%', width: '38%', height: '38%' },
    { right: '7%', top: '7%', width: '38%', height: '38%' },
    { left: '7%', bottom: '7%', width: '38%', height: '38%' },
    { right: '7%', bottom: '7%', width: '38%', height: '38%' }
  ],
xAxis: [
    { gridIndex: 0, min: 0, max: 20 },
    { gridIndex: 1, min: 0, max: 20 },
    { gridIndex: 2, min: 0, max: 20 },
    { gridIndex: 3, min: 0, max: 20 }
],
yAxis: [
    { gridIndex: 0, min: 0, max: 15 },
    { gridIndex: 1, min: 0, max: 15 },
    { gridIndex: 2, min: 0, max: 15 },
    { gridIndex: 3, min: 0, max: 15 }
],
series: [
    {
      name: 'I',
      type: 'scatter',
      xAxisIndex: 0,
      yAxisIndex: 0,
      ...
    },
    {
      name: 'II',
      type: 'scatter',
      xAxisIndex: 1,
      yAxisIndex: 1,
      ...
    },
    {
      name: 'III',
      type: 'scatter',
      xAxisIndex: 2,
      yAxisIndex: 2,
      ...
    },
    {
      name: 'IV',
      type: 'scatter',
      xAxisIndex: 3,
      yAxisIndex: 3,
      ...
    }
  ]

包含的属性

grid的属性

关于show影响的东西

只有当show为true时候，backgroundColor,border与shadow相关的才会显示

关于containLabel属性与left等的关系

1、containLabel为true时，left等属性决定的是包括了坐标轴标签在内的所有内容所形成的矩形的位置
2、containLabel为false时，left等属性决定的是由坐标轴形成的矩形的尺寸和位置

坐标轴标签