1、所有元素，以图片资源的形式，上传到服务器，然后通过 svg 引用该图片链接，显示在绘图区。
2、每个元素都有一些相关属性，例如宽度、高度、位置、描述等属性，可以在绘图区域根据需要修改。
3、把所有元素都放在其应该存在的位置，并且将这些信息存储下来，便形成了静态的绘图。
这种方法是好处是成本低（由交互设计师设计图片资源和该元素的位置，开发人员通过配置属性将其放在需要的位置即可），可修改性强（修改属性即可）。
以上是静态情况。
实际上可能是动态的，比如：
- 存在开启、关闭状态；
- 需要警告提示；
- 多状态切换（正常、待命、关闭、报警）；
- 前置依赖；
这些都是可以支持的。
核心还是在数据里，预置一些状态，定时从服务器端读取当前状态，然后根据具体情况，修改显示的内容即可。
还有一些其他情况，比如：
1、手动查看更具体的情况：
点击，触发事件，向后端请求，然后查询到数据，显示页面上即可；
2、更醒目的选中时提示效果：
可支持，但由于优先级不高，目前没有添加该功能；
3、3D效果；
目前不支持
4、手动拖拽：
可后期添加，已预留添加空间；
5、动态效果：
预置多个图片状态，手动切换当前显示的图片即可。或许也可以使用gif？（gif未确认）
6、事件触发：
可支持，非常简单。放置在右侧显示的数据的下方，做一个事件区即可。
7、多元素情况下，存在叠加情况，需要处理层级关系：
非常简单，修改绘图时逻辑即可，即可将被覆盖的元素放在下面。
8、缩放
可支持，由于时间所限，此版本未添加缩放功能。
9、不同元素的连接：
本来想的是勾选不同元素后，可自动生成连接线路，但考虑到素材问题，以及连接线也可能具备相关属性，所以改成手动添加连接线。