echarts 关系图_ECharts文档逆天了

原文入口：ECharts 文档新增交互式预览

也欢迎大家关注 ECharts 官方公众号

--------------------------------------------------------------------

随着 ECharts 的成长，我们的产品功能越来越完善，配置项也更加丰富。大家可以查看我们的文档了解这些配置项并对 ECharts 进行高度自由的定制，实现纷繁复杂的图表配置需求。但是开发者在查看文档配置项的过程中也遇到并反馈过很多问题，例如：

1. 想要实现一个功能，不知道该用哪个配置项；
2. 看了配置项的介绍，只看文字描述，还是不知道应该怎么用；
3. 无法预知某个配置的不同取值分别会呈现什么效果，再去一个个的尝试，好麻烦。

对于第一个问题，我们希望能够持续优化文档的搜索、提供更完善的示例、以及更加丰富的社区作品来帮助大家。此外，ECharts 还提供了术语查找手册，可以快速地了解 ECharts 的功能名称，快速定位到对应的配置项。

而此次我们在文档中新增的「交互式预览」功能主要是希望能够帮助开发者一定程度上解决第二、第三个问题，让用户与 ECharts 的配置项实现全新的交互式体验。大家已经可以在官网配置项文档里体验这个功能啦！

你可以直接点击每个配置项右侧的「试一试」(Try It)直接开启该功能。开启后，「试一试」的下方会出现该配置项所对应的控件，并且页面右侧会出现「配置项效果预览」和该效果对应的运行代码(小屏幕会出现在下方)，每次通过控件改变属性值，在图表预览和代码中都会有实时的响应，你可以直观的看到每个配置项不同的取值对图表的影响。

点击试一试打开控制面板

我们看看通过「交互式预览」可以所见即所得的配置图表的什么内容：

通过调色盘选取颜色

修改文本字体

直接上传SVG或PNG定义 symbol 样式

改变关系图的布局

除了图表的实时预览，每次改动，面板的代码部分都会高亮出相应的变化，可以直观了解应该怎么在代码中设置配置项来开启这个功能，帮助大家后续的开发。

可能会有的 Q & A

Q: 右下角代码是否能够编辑

A: 目前暂时不会支持编辑，但是未来会考虑支持编辑数据以及引入更多的示例模板。更复杂的代码编辑可以复制到官网的示例页或者 Gallery 进行二次编辑。

Q: 为什么有些配置项改了没有效果

A: 有些配置项是依赖一些其它配置项的开启的，比如标签需要先开启show之后再去改其它配置项才会有效果，或者像阴影可能需要同时改shadowBlur和shadowColor。

也有一些配置项也只适用于部分例子，比如柱状图下的roundCap只能在极坐标系上的柱状图中生效。

后续我们会对这块做更多的优化来减少大家在使用中产生的困惑。

Q：这个可以像图说一样用来作为可视化的编辑器吗？

A: 这个功能的设计主要还是为了解决 ECharts 文档使用的问题，无法满足很多诸如存储，数据处理等更复杂的可视化编辑器的功能。

---

最后如果大家在使用过程中有任何的疑问或者意见，都欢迎发邮件(为了让社区更多的人能够理解和帮助解决问题，邮件列表建议用英文沟通)到 dev@echarts.apache.org 反馈给我们。