Echarts直角坐标系下的网格及坐标轴

使用ECharts绘制图表时，可能会发现图表真正的绘图区域和图表容器之间有一些间隔，有时看上去不太协调。查看相关API可以得知，可以通过调整几个属性值控制绘图区域与容器之间的间距。 因此，需要了解直角坐标系下如何绘制网格（grid）及其作用、如何绘制直角坐标系下的x轴（xAxis）和y轴（yAxis） 。 在ECharts的直角坐标系下，有两个重要的组件：网格（grid）和坐标轴（axis）。 ECharts中的网格是直角坐标系下定义网格布局和大小及其颜色的组件，用于定义直角坐标系整体布局。ECharts中的网格组件中所有参数的属性如表所示。

定义网格布局和大小的6个参数如图所示。 由ECharts网格组件参数表和下图可知，共有6个主要参数定义网格布局和大小。其中，x与y用于定义网格的左上角的位置；x2与y2用于定义网格的右下角的位置；width与height用于定义网格的宽度和高度；指定width后将忽略x2，指定height后将忽略y2

利用某一时间未来一周气温变化数据绘制折线图，并为图表配置网格组件，如图所示