拓扑图编辑器(3)- Graph.Editor项目

发表于 & 归档在 HTML5, JavaScript, Web, 拓扑图, 编辑器.

继续拓扑图编辑器的开发,并创建了项目Graph.Editor,正式发布到github了,项目使用了nodejs,bower,gulp等HTML5项目开发工具,bower用于前端包管理,Gulp用于自动发包和发布,欢迎Qunee客户使用和贡献代码

相关文章:

项目地址:https://github.com/samsha/graph.editor

在线演示:http://demo.qunee.com/editor/

拓扑图编辑器截图1

Mapbox Studio 常见问题

发表于 & 归档在 地图, 翻译.

之前借助leaflet + qunee实现了地图拓扑图,同样使用leaflet的有个更专业的地图应用:Mapbox,可以定制出简单、专业、漂亮的地图,在传统地图服务商(Google,Nokia, Apple …)之外,有了更好的选择,Mapbox Studio是一款开源软件,使用了大量的web技术:Mapnik, node.js, backbone.js, leaflet, codemirror …… 其客户端本身就是一个webapp + Chrome,跨平台,有良好的交互体验,值得前端开发者学习和参考

mapbox studio中用到的web技术:Mapnik, node.js, backbone.js, leaflet, codemirror

线条流动效果

发表于 & 归档在 HTML5, 拓扑图.

图论中边是重要元素,它连接各个顶点构成拓扑图,有向图中,边具有方向性,在画布中表现为箭头,在实际应用中,边可以代表链路,链路上不只是有方向,还有流量,信号种类等信息,光用箭头表现力就不够了,可增加线条线型,以及流动效果来体现,这里介绍 Qunee 1.6 中线条流动效果的实现

线条流动效果

拓扑图编辑器(2)

发表于 & 归档在 HTML5, 拓扑图, 编辑器.

继续来说编辑器的需求,前面介绍了拖拽创建节点、以及连线的方法,并加入到了其后的 Qunee 类库,实际应用中需要更多功能,Qunee 的拓扑图编辑器也在逐渐完善,一方面增加多种编辑交互,一方面提供数据导入导出,同时也在摸索编辑器的整体界面设计和前端开发框架

Qunee 编辑器1.6