最终展示效果 1、ER图选型 React-Flow：https://reactflow-cn.js.org/ jsPlumb：https://jsplumbtoolkit.com/ GoJS：http

前言 之前写了两篇可视化大屏开发的经验总结，还没浏览的可直接跳转： # 可视化大屏开发，知道了这些经验以及解决方案，效率至少提升2倍！（上） # 可视化大屏开发，知道这些解决方案，效率至少提升2倍！（

前言 从毕业之后，自己就一直在做TOC的业务比较多，网站、H5、小程序等。 自从回到了二线城市，发现二线做自己产品的公司少之又少，而做政府或者企业的业务偏多，也就是数据可视化大屏，数字孪生类的业务较多

前言 之前写了一篇可视化大屏开发，知道了这些经验以及解决方案，效率至少提升2倍！（上）经验总结，发现有7千多人比较感兴趣，看来还是有不少人有这方面需求的。 今天我将继续将我的经验全盘托出，毫无保留的奉

项目中经常用到echarts，不做封装直接拿来使用也行，但不可避免要写很多重复的配置代码，封装稍不注意又会过度封装，丢失了扩展性和可读性。始终没有找到一个好的实践，偶然看到一篇文章，给了灵感。找到了一

本文对一段代码进行解析，这段代码是一个基于React和echarts的图表组件，通过封装echarts的相关功能和组件，实现了一个自定义的图表组件。

因为 ECharts 的使用场景及其广阔，并且定制化的场景比较多，所以就不封装可以复用的组件了，在我看来，echarts封装更好用就行了

第一节：Vue 使用 Apache Echarts 绘制地图（省市、地区、自定义）!!!!!!!!!

问题 项目中常遇见的问题在于，echarts的封装跟不上需求的多变性 目标 分析 1、要尽可能简单的使用就要使用尽可能少的配置 2、要有适用性就需要以Echarts的文档为准绳，尽可能的不使用自定义语