最近项目中需要一个组网的关系图。通过调研发现jTopo很接地气，国产，能满足需求。在实际应用中，发现作者提供的stage.toJson()，JTopo.createStageFromJson()这个两个API存在缺陷，stage.tojson()不能把jTopo.Link保存，同时jTopo.Node的背景图不能保存。通过JTopo.createStageFromJson()创建jTopo.Sta
原创
2020-11-26 21:51:02
1035阅读
1.mxgraph邂逅(×) 折磨（√）楼主暑假实习，项目组需要开发一款标注系统，mentor要求使用nuxt+mxgraph来实现标注系统，所以就开始学习mxgraph，然而百度一下，我就蒙蔽了，这个框架国内确实很少用，并且查询了许多人的摆弄可，感觉都是一些基本的教学，自己摸索了很久，大概花了一个多月把项目搞定了，现在将自己的遇到的问题以及解放方法分享给大家。2.mxgraphs介绍官方文档：m
代码如下:var node = new JTopo.Node("Hello"); node.setLocation(409, 269); node.mousedown(function(event){ if(event.button == 2){ node.text = '按下右键'; }else if(event.button == 1){&nb
转载
精选
2015-06-29 10:25:11
1111阅读
jTopo（Javascript Topology library)是一款完全基于HTML5 Canvas的关系、拓扑图形化界面开发工具包。官网：http://www.jtopo.com/jTopo是免费的，而且文档是中文的，很容易看懂。你可以基于它进行二次开发，能够快速创建一些关系图、拓扑等相关图形化的展示。下面是我用jTopo绘制网络拓扑图的小例子：<!DOCTYPE html>
转载
2023-07-04 10:17:39
744阅读
java web 非本人研究方向，只是作为拓展知识涉猎范围 jTopo是什么?jTopo（Javascript Topology library)是一款完全基于HTML5 Canvas的关系、拓扑图形化界面开发工具包。 jTopo关注于数据的图形展示，它是面向开发人员的，需要进行二次开发。 使用jTopo很简单，可以快速创建一些关系图、拓扑等相关图形化的展示。只要您的数据之间存在有关联关系，都
最近一直在研究拓扑图，项目上推荐了jTopo，也就顺带研究了一番。根据官网描述，jTopo是一款完全基于HTML5 Canvas的关系、拓扑图形化界面开发工具包。本人也基于jTopo做了一个简单的交换机相关信息展示的拓扑图，要求能实时显示每个节点的流量信息，告警信息，连线通过不同颜色展示，同比环比趋势图等。使用过程中，觉得jTopo方便的地方有：1、只依赖jquery，很轻量，仅仅只有
一、实现的功能1、拓扑的基本绘制2、拓扑放射性布局3、多级拓扑的实现4、下级拓扑节点的隐藏与展现5、导出拓扑图二、效果图展示正常展示：节点收缩展示：三、引入库（稍作可以直接复用）1、引入jQuery，jquery.js2、引入jtopo插件jtopo-0.4.8.js3、支持IE8，excanvas.js四、前端代码在实现节点隐藏于展示过程中，实现方法可能不够好，问题如下：1、而且使用全局数组（用
转载
2023-10-22 06:48:56
1141阅读
JavaScript实现浏览器特定区域截屏功能需求介绍尝试一：使用Jtopo.js自带的保存图片方法（不能对资源进行下载）尝试二：对saveImageInfo进行改写（功能能用，但是会因为跨域问题污染canvas）：尝试三：对浏览器进行区域截屏并下载（可用） 需求介绍最近使用Jtopo进行一个简单版拓扑图编辑器的开发。其中有一个需求就是将编辑器canvas部分进行截图并进行下载。尝试一：使用Jt
转载
2023-07-21 13:41:53
82阅读
前言 初识jtopo是因为项目中需要一个能够动态绘制网络拓扑图的插件，不但能画出基本的网络拓扑结构，还要能够标识出网络设备的类型以及端口设置，甚至是网络连线的流量信息等，基于这个需求查找了很多资料，初步选中了几款类似功能的插件，综合考虑成本、操作的简便性、画图的效率以及上手难易程度后，最终选定使用jtopo。 废话
效果如下图所示：一、文件目录结构：二、绘制png的鱼头、鱼尾图片fish_head.png： fish_tail.png： 三、下载js文件jquery、jtopo请到官网下载。四、编写鱼骨图核心文件：MakFishBone.jslet MakFishBone = (function (window) {
前端开发框架总结之利用Jtopo实现网络拓扑功能（四）上文我们讲了拓扑容器相关的交互设计和实现思路以及一些关键技术细节。至此，我们已经覆盖了结点创建、连线创建、容器创建、结点添加等常用场景，本文我们继续我们的拓扑管理开发之旅。拓扑元素序列化拓扑元素
项目中遇到要在网页中绘制网络拓扑图的需求，要求节点具备点击、拖拽、缩放等交互功能，并且可以显示/隐藏详细信息，数据是设备实时上报来的。综上，用画拓扑图的工具画一张固定的图片偷懒显然是不行的，最好是找到一个封装好的js库可以直接使用。JTopo 是一款完全基于HTML5 Canvas的数据关系+交互式图形库。 可以快速创建一些拓扑关系图。项目的完整效果不能展示，自学过程中完成的demo的效果图如下，
