现在有很多2D拓扑的解决方案，有开源的，也有商业的。但是，在3D拓扑方面，专业的组件很少。这次给大家介绍一款专业的3D拓扑软件EasyGraph。基本概念EasyGraph使用HTML5和JavaScript语音，底层使用webgl技术，可以在支持webgl的浏览器上绘制。在使用EasyGraph之前，你需要熟悉几个基本概念：图元（TData）、容器（DataModel）和画布（TGraph）。Primitives：图形中的各种基本元素，如节点（TNode）、连接（TLink）等；containers：primitives被放在一个容器（DataModel）中进行管理，就像“装鸡蛋的篮子”。负责增加/删除/修改/检查原语等管理操作；canvas：图元最终绘制在画布（TGraph）组件上。TGraph是最终用户看到的图形组件，负责图形画面的具体绘制和交互；EasyGraph是MVVM开发，其中M代表原始和容器部分，V代表TGraph部分。拓扑学主要元素介绍一般来说，拓扑学的主要元素是节点和链路。此外，它还包括一些支持扩展、合并和钻取逻辑的分组和子网等元素。EasyTopo包括以下主要元素：Canvas元素TGraph显示三维拓扑的画布数据元素TDataTData是所有TNode拓扑节点元素的分组元素TLink拓扑连接元素TGroup拓扑图，组可以包含其他元素，并支持合并和扩展功能。TSubnet拓扑图的子网元素，子网元素可以包含其他元素，支持拓扑钻取功能。TLayer拓扑图弹出层元素，弹出层元素可以包含其他元素，支持分层显示和弹出功能。DataModel数据容器，所有的数据类元素都需要添加到数据容器中才能生效。使用EasyGraphforHelloTopo，首先需要引入EasyTopo开发SDK（eg.js，eg表示EasyGraph）。绘制3D拓扑的主要步骤如下：创建DataModel对象，添加TGraph对象，添加节点，线和其他元素到DataModel下面的代码是绘制两点和一条线的例子：constdataModel=neweg.DataModel();constgraph=neweg.TGraph(dataModel,{canvas:document.getElementById("canvas")});让node1=neweg.TNode({image:"./images/convergence.png"});node1.setName("node1");node1.p(-200,100,0);让node2=neweg.TNode({image:"./images/convergence.png"});node2.setName("node2");node2.p(200,-100,0);letlink=neweg.TLink(node1,node2);dataModel.add（节点1）；dataModel.add(node2);dataModel.add（链接）；最终效果如下图所示：默认情况下，可以通过鼠标点击选择元素，通过鼠标拖动元素移动位置。
