计划做一个元数据平台, 因为要包含血缘分析功能, 所以要调研一下js 拓扑图库, 候选对象主要参考知乎上的问答, javascript 有哪些适合做网络拓扑图形展示的包?

https://www.zhihu.com/question/20643359

------------------------
候选库
------------------------
yfiles for html
(收费)是德国人搞的,很严谨,布局算法很厉害, http://live.yworks.com/yfiles-for-html/2.0/view/graphviewer/index.html
那个公司还有另一个牛逼产品 yEd

mxGraph , JavaScript Diagramming and Graph Visualization
(开源) 是jgraph的html版本,支持低版本的IE是亮点, https://github.com/jgraph/mxgraph

qunee for html5 , 开发清新、高效的图形组件
(收费) 国人研发,简洁、高效、用户体验好, http://qunee.com/

jTopo (Javascript Topology library), 是一款完全基于HTML5 Canvas的关系、拓扑图形化界面开发工具包
jTopo(免费) 关注于数据的图形展示,它是面向开发人员的,需要进行二次开发。http://www.jtopo.com/download.html

d3-force, 基于d3 的一个库
d3-force(开源) https://github.com/d3/d3-force

dagre-d3, 另一个基于d3 的一个库, 该github上说开发已经停止了, https://github.com/cpettitt/dagre-d3,  airflow调度系统用它显示 pipeline 的flow图

------------------------
选择
------------------------
当然是要选免费的了, 首选 mxGraph, 样子很漂亮, 文档详尽, 而且从2006年开始一直活跃开发中.  jTopo也算不错.

mxGraph几个有特点是的例子,

带图标 https://jgraph.github.io/mxgraph/javascript/examples/fileio.html

定制化图标位置的示例, https://jgraph.github.io/mxgraph/javascript/examples/fixedicon.html

鼠标右键菜单, https://jgraph.github.io/mxgraph/javascript/examples/events.html

更完整的右键菜单, https://jgraph.github.io/mxgraph/javascript/examples/schema.html

点击node/edge能在属性页签上显示其属性,  https://jgraph.github.io/mxgraph/javascript/examples/userobject.html

变换布局, https://jgraph.github.io/mxgraph/javascript/examples/graphlayout.html

node 上label显示的位置, https://jgraph.github.io/mxgraph/javascript/examples/labelposition.html

node上动态显示alarm, https://jgraph.github.io/mxgraph/javascript/examples/monitor.html

在图标下方出现context icon按钮, https://jgraph.github.io/mxgraph/javascript/examples/contexticons.html

隐藏和显示节点, (这个例子帮助我们实现search功能, 找到一个node, 然后设置style) https://jgraph.github.io/mxgraph/javascript/examples/visibility.html

动画edge流向图, https://jgraph.github.io/mxgraph/javascript/examples/animation.html

zoom-in/zoom-out, https://jgraph.github.io/mxgraph/javascript/examples/handles.html

几个js 拓扑图库的更多相关文章

  1. 推荐一个很棒的JS绘图库Flot

    Flot是Ole Laursen开发的基于JQuery的纯JavaScript实现的绘图库,Flot使用起来非常简单,绘图效果相当绚丽,而且还支持一些图片的操作功能,例如图片的缩放.可以看一下Flot ...

  2. vis.js绘图库的一个BUG以及源码修正

    1. BUG 1.1 BUG触发情况 在使用vis.js绘图时,加入两个节点A和B之间既存在一条从A指向B的边,同时也存在一条从B指向A的边,那么这个绘图库就会崩溃. 1.2 BUG解析 vis.js ...

  3. 开源轻量级移动端友好的JS地图库——leaflet学习教程

    Leaflet 是一个为建设交互性好适用于移动设备地图,而开发的现代的.开源的 JavaScript 库.代码仅有 33 KB,但它具有开发在线地图的大部分功能.Leaflet设计坚持简便.高性能和可 ...

  4. js关系图库:aworkflow

    auto-workflow 用于快速构建各种关系图的库,比如流程图,可视化执行流等 github地址:https://github.com/auto-workflow/AWorkflow 快速开始 n ...

  5. HTML5 Canvas JavaScript库 Fabric.js 使用经验

    首先,表明我的态度:采用 Flash 才是最优方案,不建议使用 HTML 5 的 Canvas 做一些生产/工业级的网页应用. Flash的优势一是浏览器支持好,二是代码成熟稳定.而HTML5 的 C ...

  6. 【前端vue进阶实战】:从零打造一个流程图、拓扑图项目【Nuxt.js + Element + Vuex】 (一)

    本系列教程是用Vue.js + Nuxt.js + Element + Vuex + 开源js绘图库,打造一个属于自己的在线绘图软件,最终效果:topology.le5le.com .如果你觉得好,欢 ...

  7. myfocus官方网站已经挂掉,相关下载已经从googlecode转到网盘

    首先说,我跟作者没有任何关系,只是偶然发现这个东西,努力了1个多小时才有下载,现在友情提供出来. 其次,我找到的是v2.0.4 MS这个是最新的版本,更新日期是2012年10月. 再次,本文原本是准备 ...

  8. 前端可视化建模技术概览,包括:GoJS

    我推荐使用的: 库 网址 备注 GoJS https://gojs.net/latest/samples/flowchart.html 推荐使用 相关文章: 前端可视化建模技术概览:http://le ...

  9. javascript开源大全

    javascript开源大全 Ajax框架-jQuery 可视化HTML编辑器-CKEditor 国产jQuery-UI框架-(jUI)-DWZ 网页开发FireFox插件-Firebug 服务器端的 ...

随机推荐

  1. Dynamic CRM 2015学习笔记(5)CRM 2015 导入 OData Query Designer 解决方案

    以前一直使用OData Query Designer来生成.验证odata查询字符串,本想把它导入到CRM 2015的环境里,但报错: 到MSDN上发现太老版本的solution确实不能再导入到crm ...

  2. print

    说一说这个print函数,我们经常使用,但有一些细节却往往错过了 print print()输出会换行是因为默认end="\n" 想要不换行,且覆盖 print("\r第 ...

  3. poj1193 内存分配

    气死我了...这个毒瘤内存分配..... 优先队列 + 链表模拟,看起来搞一搞就好了却WA来WA去... 最后对拍手动找才发现错误: erase的时候不要急急忙忙插入wait!要把同一时期的erase ...

  4. 第十三节,卷积神经网络之经典网络LeNet-5、AlexNet、VGG-16、ResNet(三)(后面附有一些网络英文翻译文章链接)

    一 实例探索 上一节我们介绍了卷积神经网络的基本构建,比如卷积层.池化层以及全连接层这些组件.事实上,过去几年计算机视觉研究中的大量研究都集中在如何把这些基本构件组合起来,形成有效的卷积神经网络.最直 ...

  5. 常用工具类(System,Runtime,Date,Calendar,Math)

    一.System: 一个java.lang包中的静态工具类. 三大字段: static PrintStream err “标准”错误输出流. static InputStream in “标准”输入流 ...

  6. python config.ini的应用

    config.ini文件的结构是以下这样的:结构是"[ ]"之下是一个section,一部分一部分的结构.以下有三个section,分别为section0,section1,sec ...

  7. shiro:hasPermission 标签 :验证当前用户是否拥有指定权限

    1.这些值是存在数据库里的,在哪里找呢?sys_menu 中的permission列. <shiro:hasPermission name="cms:article:edit" ...

  8. keepalived初次安装体验

    keepalived主要有两大功能,一个是LB,一个是VRRP+failover,其中LB功能和LVS的功能类似,都是通过在LB上配置RS,监控RS的状态,将从client来的请求发送给对应算法的RS ...

  9. Python三十个常见的脚本汇总

    1.冒泡排序     2.计算x的n次方的方法     这里有我自己整理了一套最新的python系统学习教程,包括从基础的python脚本到web开发.爬虫.数据分析.数据可视化.机器学习等.送给正在 ...

  10. MySql 5.7.23安装

    1.首先上MySql的官网下载  https://dev.mysql.com/downloads/mysql/ 选择源码包: 1. 新建/usr/local/src目录,保存下载的各类安装包 1 mk ...