Echarts的座标调整,调整内部网格和外部的间隔

[摘要]: 很多人在用ECharts图表组件后会发现图表真正的绘图区域和图表容器之间有很大一块间隔,看上去有些很不饱满。我么可以将其调整至容器大小?可以调整吗? 通过查看相关API得知,绘图区域与容器之间的间距是由几个属性值控制,我们有必要先来了解一下grid节点的一下几个属性以及作用: grid 直角座标系内绘图网格 名称 默认值 描述 {number} x 80 直角座标系内绘图网格左上角横座标,数值单位px {numb...
     很多人在用ECharts图表组件后会发现图表真正的绘图区域和图表容器之间有很大一块间隔,看上去有些很不饱满。我么可以将其调整至容器大小?可以调整吗?
    通过查看相关API得知,绘图区域与容器之间的间距是由几个属性值控制,我们有必要先来了解一下grid节点的一下几个属性以及作用:
grid
直角座标系内绘图网格

163927u8896fz0b6bbn8sy.png



图形表现如下:

163942sb030cu8c6el6u64.jpg



    这样我们就不难理解为何默认情况下绘图区域的边缘与容器之间存在一定的间距。都是因为默认情况下grid的x、x2、y、y2做了数据设置。

倘若我们需要缩小它们两者之间的间距,我们需要自己在options内对图表参数进行设置,示例代码形如:

grid:{
    x:0,
    y:0,
    x2:0,
    y2:0
  },
有其他任何ECharts图表的使用问题敬请留言讨论,谢谢您的关注!


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章