常见问题

Apache ECharts^TM

主题

通用问题

遇到技术问题怎么办？

1) 提问前，建议您先阅读配置项手册左侧的导航。在配置项手册中，您可以了解 ECharts 有哪些配置项。您可以在相关组件下找到是否有可以实现您需要的功能的配置项。

2) 浏览本页的常见问题。

3) 在官方编辑器、CodePen、CodeSandbox 或 JSFiddle 上创建一个简单的例子来复现您的问题。如果您无法用代码描述需求，可以尝试提供设计稿或画一张草图。

4) 在 stackoverflow 上提问并附上示例链接。

ECharts 可以免费使用吗？

是的，ECharts 在 Apache License 2.0 许可下开源。

坐标轴

坐标轴标签显示空间不足怎么办？

您可以使用 interval 来控制显示多少个标签，将其设置为 0 以显示所有标签。

或者您可以设置 axisLabel.rotate 来将标签旋转一定角度。

为什么想把坐标轴放在右侧时不起作用？

您需要将 onZero 设置为 false。

如何强制显示坐标轴的第一个/最后一个标签？

自 ECharts 3.5.2 版本起，支持 axisLabel.showMinLabel 和 axisLabel.showMaxLabel。它们可用于控制是否强制显示第一个/最后一个标签。

图例

图例区域与图表重叠怎么办？

您可以通过设置 grid 来控制图表区域的位置。例如，设置一个更大的 grid.top 将绘图区域下移。

我们计划在未来的版本中让布局更加智能。

折线图

坐标轴上的刻度似乎与数据不符？

请检查您是否设置了 stack。如果您不想制作堆叠折线图，应该移除它。

柱状图

为什么当数值很小时，y 轴刻度会消失？

ECharts 3.5 版本已修复此问题。

地图

省份名称在图表上重叠。如何修改名称的位置？

您可以在地图文件（JS 或 JSON）中修改对应省份的 cp 坐标，或者修改已通过 echarts.getMap('china') 加载的地图数据。

更多详情，请参考 GitHub。

在哪里可以下载其他国家的地图？

其他国家的地图信息可以从这里下载。

如何获取地图的缩放事件？

首先，您需要将系列的 roam 设置为 true，然后监听 'georoam' 事件。例如

myChart.on('georoam', function (params) {
   console.log(params);
});

如何制作自定义地图？

ECharts 地图是在原始坐标的基础上进行了额外编码。您可以使用 mapshaper-plus 工具上传自定义的 geojson 文件，然后生成可以在 ECharts 中使用的地图文件。

百度地图

如何将 ECharts 与百度地图结合使用？

引入 echarts.js、bmap.js 和 https://api.map.baidu.com/api?v=3.0&ak=这里是您在百度开发者平台获取的密钥。
在 option 中设置 bmap，您可以参考这个示例。
如果您需要获取百度地图实例，可以使用 chart.getModel().getComponent('bmap').getBMap()，然后根据百度地图 API 进行设置。

仪表盘

如何设置仪表盘颜色？

您可以使用 axisLine.lineStyle.color。

事件处理

如何获取图表点击等事件？

请阅读官方教程。ECharts 支持的事件类型可以在相关 API 中找到。

其他

为什么图表不显示？

您可以检查以下情况：

echarts.js 是否正常加载。
echarts 变量是否存在。
调用 echarts.init 时，DOM 容器是否具有宽度或高度。

为什么在 Vue 中使用 ECharts 时图表无法正常工作？

如果您正在使用 Vue 3，请避免使用 reactive 和 ref。
如果您正在使用 Vue 2，请避免在 data 函数中声明 ECharts 实例对象或使用 Vue.observable API。

以上所有操作都会导致 ECharts 实例对象被代理为响应式对象，这可能会影响 ECharts 内部模型的属性访问，并带来一些意想不到的问题和糟糕的性能。

建议将 ECharts 实例对象声明为普通变量，或使用 shallowRef / shallowReactive / markRaw API 来防止实例对象被代理。

另请参阅 #17723 和 Vue 文档中的使用注意事项。

是否有更多学习 ECharts 的资源？

请参考 awesome-echarts 获取更多相关项目和资源。