![96f872b80328a9ab4ab173478ca6323f.png](https://i-blog.csdnimg.cn/blog_migrate/c56f42dd7710f7f3ba63a0bb526dba87.jpeg)
![71078944a9f8b871b1c79643151361fb.png](https://i-blog.csdnimg.cn/blog_migrate/028b6b9928a68c6d2ea2fdc4711af145.jpeg)
今天偶然想查下 ECharts 配置项,结果发现了一个新东西——「ECharts 术语速查手册」,于是点开了解一下。
「ECharts 术语速查手册」目前有 4 个功能:
- 常用组件说明
- 系列类型文档速查
- 坐标系文档速查
- 组件文档速查
常用组件说明
![aef4a2bb7bf09f304a6cc468dd95553a.png](https://i-blog.csdnimg.cn/blog_migrate/7e584fe9a1047efdb34e074a2413a119.jpeg)
如图,通过一种类似浏览器 F12 的元素拾取器那样的交互方式,我们可以看到 ECharts 图表各种组件的名称、描述和配置项手册直达链接。这简直对新手太友好了。
记得当初刚接触 ECharts 时,为了熟悉组件、功能与配置项名称的对应关系,我只能拿官方 Gallery 里面的例子,改改试试,再对照着手册查查看看……非常没有效率。
后来有了百度图说,不用写代码(准确说是不用写配置项 JSON)就能创建图表,同时可以得到创建好图表对应的配置项代码 。但是图说用的是 ECharts 2.0,图说得到的配置项代码拿到 ECharts 3.0 及以后环境里,不一定能用。
扯远了,回到这个「常用组件说明」,基本把平常能用到的功能组件都涵盖了,有需求都同学可以试试,入门捷径。
系列类型文档速查
![6746c6978084b16f2fcf4c49c30ee16d.png](https://i-blog.csdnimg.cn/blog_migrate/5b1b555c920a51f0422253e94e62f84b.jpeg)
这个功能比较简单,就是方便新手快速识别图表名称,快速定位图表的在配置项中的位置(series[i]-line, series[i]-bar, series[i]-pie)。
坐标系文档速查
![590a10d24baad3e4629b0df45055dd99.png](https://i-blog.csdnimg.cn/blog_migrate/bf477aac03734bb89e781c11d016fc07.jpeg)
同样比较简单,方便新手快速认识坐标系,快速定位坐标系在配置项中的位置。
组件文档速查
![91c34587b1a6d3f28fc0539ff44d5c6a.png](https://i-blog.csdnimg.cn/blog_migrate/55693702c43714ca700b8027f611ec86.jpeg)
这个「组件文档速查」和第一个「常用组件说明」有点重复,也是方便直接定位到配置项手册中对应位置,就是多了 MarkLine, MarkArea, Brush 这三个功能。
另外多说一句,这些组件在配置项到位置有多个,比如 tooltip 提示框,有全局的 tooltip 配置,还有系列的 series[i].tooltip 配置,以及数据的 series[i].data[i].tooltip,生效优先级为:数据>系列>全局。
点击直接查看「ECharts 术语速查手册」
ECharts 术语速查手册www.echartsjs.com