在线演示
今天分享一个超酷的开源轻量级javascript图形网络类库 - sigma.js,这个类库基于HTML5画布实现。能够非常好的生成静态或者动态的互动网络图形。
这个类库特别为以下设计:
- 使用图形软件输出生成互动的静态图形,例如,Gephi
- 快速的生成动态图形
这个类库是一个独立的不依赖于第三方javascript的图形类库。开发人员可以自己开发插件来扩展功能,同时也支持类似jQuery的链式操作。支持主流的浏览器。
主要特性
- 使用简单
- 高度自定义
- 不依赖类库
- 支持使用和开发插件
- 简单易于访问的API
- 流动绘图管理,可以插入帧
- 类似jQuery的链式操作
如何使用
快速创建一个实例:
- var sigRoot = document.getElementById('sig');
- var sigInst = sigma.init(sigRoot);
- sigInst.addNode('hello',{
- label: 'Hello',
- color: '#ff0000'
- }).addNode('world',{
- label: 'World !',
- color: '#00ff00'
- }).addEdge('hello_world','hello','world').draw();
支持高度的定制:
- sigInst.drawingProperties({
- defaultLabelColor: '#ccc',
- font: 'Arial',
- edgeColor: 'source',
- defaultEdgeType: 'curve'
- }).graphProperties({
- minNodeSize: 1,
- maxNodeSize: 10
- });
希望大家能够喜欢!
分享到:
相关推荐
html2canvas-1.0.0-rc.4版本
canvas-nest.js一个基于html5 canvas绘制的网页背景效果
html2canvas 的 @1.0.0-rc.4 版本,兼容IOS13,npm install时候安装版本不对可以直接下载这个,选择dist内的js文件引入
APNG经过修改后,在QT,浏览器上可用的apng-canvas.js 参考博客使用:http://blog.csdn.net/ly305750665/article/details/77972415
canvas绘制基础图形(canvas 气泡框 网格线 三角形 圆角矩形 箭头)1.初始化画布 initCanvas * 2.绘制网格线 drawGridlines * 3.绘制圆点 drawDot * 4.绘制圆环 drawRing
javascrip canvas画布,实现动态背景。
Leaflet.Canvas-Markers-0.2.0 https://github.com/corg/Leaflet.Canvas-Markers
canvas绘制基础图形(canvas 网格线 三角形 圆角矩形 箭头)的插件,包含初始化画布、绘制网格线 、绘制圆点、绘制圆环 、绘制图片等
JavaScript Canvas to Blob is a function to convert canvas elements into Blob objects.
html2canvas.js有很多个版本,但是在截取图片的清晰度时,需要用到其1.0.0版本中then方法以提高图片清晰度
html2canvas-0.4.1.zip
资源来自pypi官网。 资源全名:js.javascript_canvas_to_blob-2.0.5.tar.gz
HTML5 Canvas生成粒子效果的人物头像html5-canvas-pixel-image-master.zip
文字粒子效果,通过canvas side的开发
canvas-nest.js 是 canvas 上绘制的蜂窝状网站背景。 特性 不依赖于 jQuery 和 JavaScript 框架 轻量级,只有 1.59kb 大小 非常容易使用 使用 [removed]...
粒子围绕鼠标的效果展示。有些博客的页面,鼠标放置的时候,有线条聚集的动态效果。
html2canvas在IOS13.4和13.6系统中调用失败,ios14版本没问题,就该版本不行,需要改用该版本才可以
前端项目-javascript-canvas-to-blob,javascript canvas to blob是一个将画布元素转换为blob对象的函数。
canvas散点背景鼠标动态特效