FAQ

常见问题的解答

坐标轴

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

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

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

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

需要将 onZero 设为 false 才行。

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

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

如果不方便更新版本,可以参考这个例子实现同样的效果。

图例 legend

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

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

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

提示框 tooltip

如何实现上下两个图表的提示框联动?

ECharts 3.5 版本开始支持这一功能,效果参见这个例子

折线图

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

请检查一下是否设置了 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.jsbmap.js 以及 http://api.map.baidu.com/api?v=2.0&ak=这里填在百度开发平台注册得到的 access key
  2. option 中设置 bmap,参考这个例子
  3. 如需获得百度地图实例,可以通过 chart.getModel().getComponent('bmap').getBMap(),然后根据百度地图 API 做进一步设置。

Gallery 上有更多百度地图的例子,可作为参考。

事件处理

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

参考官网教程。ECharts 支持的事件类型请参考相关 API

其他

图表为什么不显示?

你可以检查以下情况:

  • echarts.js 是否正常被加载;
  • echarts 变量是否存在;
  • 调用 echarts.init 的时候,DOM 容器是否有宽高。

ECharts 2 升级到 3 需要做哪些操作?

请参考:https://github.com/ecomfe/echarts/issues/3322

ECharts 有哪些学习资料?

官网是最好的学习平台。此外,在 Gallery 上学习别人的作品也是一个不错的选择。

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