绘制拓扑图有很多开源的工具,知乎上也有人回答了这个问题:
https://www.zhihu.com/question/41026400/answer/118726253
ujtopo是基于jTopo作了一些封装,适用一些基本的场景
jTopo(Javascript Topology library)是一款完全基于HTML5 Canvas的关系、拓扑图形化界面开发工具包。官网地址:
1、首先定义画布、舞台、场景并对舞台和场景做一些设置等
//节点 var nodeList = []; //连接关系 var linkList = []; //状态 var nodeStatus = []; var canvasId = 'canvas'; var canvas = null; var stage = null; var scene = null; var lineType = "1"; var lineColor = ''; getCanvas = function () { canvas = document.getElementById(canvasId); }, getStage = function () { stage = new JTopo.Stage(canvas); }, getScene = function () { scene = new JTopo.Scene(stage); scene.background = imglist.background; },