请访问 Apache ECharts 的官网  

https://echarts.apache.org
访问官网
x

FAQ

常见问题的解答

Apache EChartsTM

常见问题

    通用问题

    有技术问题怎么办？

    1）建议您在提问前，大致阅读一下配置项手册左侧导航，了解 ECharts 有哪些配置项，并且在相关的组件下查找是否有实现您需要功能的配置项；

    2）查看本页常见问题的解答；

    3）建议使用官方编辑器、CodePen、CodeSandbox 或 JSFiddle 添加图表，复现你的问题，如果无法使用代码描述需求，可以尝试提供设计稿或画个草图；

    4）推荐在 stackoverflow.com、开源中国 或 segmentfault.com 等问答平台上提问，附上图表链接。

    ECharts 可以免费商用吗？

    可以，ECharts 基于 Apache License 2.0 开源。

    坐标轴

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

    可以用 interval 控制每隔多少显示标签，设为 0 则显示所有标签。

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

    把坐标轴设置在右侧好像没有效果？

    需要将 onZero 设为 false 才行。

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

    ECharts 3.5.2 版本起，支持 axisLabel.showMinLabel 以及 axisLabel.showMaxLabel，分别用来控制第一个/最后一个标签是否强制显示，设为 true 则强制显示。

    图例 legend

    图例区域太大导致遮挡住图表怎么办？

    可以设置 grid 控制图表区域位置。例如将 grid.top 设置得大一些，可以将绘图区域下移。

    在未来的版本中，我们计划会将布局做得更智能，自动处理这些遮挡问题。

    折线图

    坐标轴刻度好像和数据不匹配？

    请检查一下是否设置了 stack，如果不是想做堆积折线图的话，应该将其去掉。

    柱状图

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

    ECharts 3.5.2 版本修复了该问题。

    地图

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

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

    更详细的做法请参考：GitHub

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

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

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

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

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

    如何制作自定义地图？

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

    百度地图

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

    1. 引入 echarts.js、bmap.js 以及 https://api.map.baidu.com/api?v=3.0&ak=这里填在百度开发平台注册得到的 access key；
    2. 在 option 中设置 bmap，参考这个例子；
    3. 如需获得百度地图实例，可以通过 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 防止 ECharts 对象实例被代理。

    另请参见 #17723 及 Vue 文档中的相关使用警告。

    ECharts 有哪些学习资料？

    ECharts 相关项目及资源请参见 awesome-echarts。