最近项目中需要一个组网的关系图。通过调研发现jTopo很接地气,国产,能满足需求。在实际应用中,发现作者提供的stage.toJson() ,JTopo.createStageFromJson()这个两个API存在缺陷,stage.tojson()不能把jTopo.Link保存,同时jTopo.Node的背景图不能保存。通过JTopo.createStageFromJson()创建jTopo.Stage时不能创建成功。被逼无奈只好修改源码。通过JS跟踪调试,辛苦了好几个晚上,功夫不负有心人,最终完成了项目需要的效果。本项目是在官网jtopo-0.4.8-min.js版本集成上完成的。官网地址http://www.jtopo.com/api.html#,如果有侵权请作者联系我。
包含的功能有双击添加节点,点击两个节点添加连线,两个节点只能有一个连线。节点包含背景图片。背景图片能输出到json结果里。可以通过保存的json还原布局结果。同时可以删除节点,删除连线。连线可以修改成原生自带的箭头连线。可以把生成好的json保存到后台数据库里。
后续可以增加节点的报警功能,节点是否正常等效果。左边的节点可以增加。支持更复杂的效果。
最终效果如下:
源码提供关注公众号发送消息“jTopo.源码”获取。
2020-11-26