27

我正在尝试合并百度的 echarts（看起来非常好）。然而，当一个人没有设置标题也没有使用他们的工具栏时，实际图表周围会有很多空白。有没有办法让图形/图表使用更多的画布？

我目前的解决方案是在容器内添加一个额外的内容，然后将其宽度和高度设置为更大，因为我要删除的边距并通过将“顶部”和“左侧”设置为相应边距的负值来偏移它。不优雅，更重要的是，不健壮，但它暂时有效。

4

6 回答 6

47

在 ECharts 4、5

正如其他一些海报所提到的，摆脱空白的正确方法是改变options.grid.

https://echarts.apache.org/en/option.html#grid

grid: {
  left: 0,
  top: 0,
  right: 0,
  bottom: 0
}

在 ECharts 4 中，网格属性的名称已更改为left、right、top和bottom。

感谢上面的答案为我指明了正确的方向！

option.legend此外，如上所述，更改对我的图表没有影响。

于 2018-06-21T04:28:10.187 回答
7

您可以使用网格上定义的属性（x、y、x2 和 y2）。文档中提到了这些属性：http: //echarts.baidu.com/doc/doc-en.html#Grid

于 2015-04-10T14:48:12.267 回答
7

在 ECharts 3中，您可以使用选项grid.left、和/或。根据文档，left 和 right 默认为 10%，top 和 bottom 默认为 60 (px)。grid.topgrid.rightgrid.bottom

文档：https ://ecomfe.github.io/echarts-doc/public/en/option.html#grid 。

const option = {
  // these are the grid default values
  grid: {
    top:    60,
    bottom: 60,
    left:   '10%',
    right:  '10%',
  },
  // your other options...
}
于 2017-08-14T00:45:23.353 回答
6

向主题网格对象添加值，如下所示：

var theme = {

    grid: {
        x: 40,
        y: 20,
        x2: 40,
        y2: 20
    }

}
于 2016-09-12T13:58:30.707 回答
0 
legend: {
padding: 0,
itemGap: 0,
data: [' ', ' ']
    },

在这里，我们可以简单地删除图例的填充。即使您没有指定一个，它也会采用默认值。不幸的是，eCharts 没有提供通过选项设置 chartArea 的灵活选项。在谷歌图表中，您可以 100% 提及它，它将覆盖所有可用区域。我尝试了上述解决方法，之后可以覆盖更多空间。

于 2018-04-09T08:26:19.133 回答
-1

在 Echart 中，您可以使用图表组合制作图表/图形，并且每个图表部分的配置太多，例如图例等......只需在他们的网站和示例页面上查看他们的api 文档（组合部分）

于 2015-01-24T09:45:05.760 回答