引言
时隔多年,前端发展实在迅猛,各类框架层出不穷,在优雅,简洁,高效以及维护方面各有千秋,只是回过头来看看,自己还是对jquery最顺手,作为个人的业余爱好玩玩,基于jquery ui体系写代码实在是很舒服的一件事情。
回到正题,在09年的时候,当时顺手写过一个jbpm4的web流程设计器,非常简单的一个雏形,在当前环境下,web流程设计器也是成堆出现的,轮子这东西,只是享受造的过程,有时间玩一玩,结果什么的,不是追求的重点,对于有同样想法的同学,可以拿着代码去玩一玩,有兴趣的可以深入规范和改造一下,代码这种东西有事情是随性而为,里面不如意的地方很多。
web流程设计器界面组成
- 上方工具栏
- 左边模型树
- 中间图形编辑区
- 右边属性编辑器
- 编辑区节点上的浮动面板
- 编辑区右键菜单
功能介绍
- 全选
- 导出图片
- 增加节点
- 删除节点
- 节点文本编辑
- 区域选择
- 移动节点
- 横向对齐
- 纵向对齐
- 增加连接线
- 删除连接线
- 增加泳道
- 删除泳道
- 撤销重做
示例和源码
当前主要在chrome里面测试。
演示地址:http://220.249.113.11/gims/demo/flow-designer.html
github地址:https://github.com/zhyi12/youi-web-demo
相关推荐
可视化流程设计器,基于jQuery和Raphaël ,兼容性强,使用方便,扩展性强。经过一夜的努力反编译了一位大神的代码,整理了整体思路并添加注释。 具体描述可在我博客中找到。 10分确实有点贵,但是绝对超值,而且我...
已测试 IE7\8、Chrome、Firefox雷劈网办公套件中的流程设计器是目前最简洁的一款。 我们参考了很多相关流程设计器,现重新规划出一个真正好用和易于二次开发的流程设计工具,它具有【精巧、方便、实用】等优点。 ...
雷劈网办公套件中的流程设计器是目前最简洁的一款。我们参考了很多相关流程设计器,现重新规划出一个真正好用和易于二次开发的流程设计工具,它具有【精巧、方便、实用】等优点。使用主流技术,开源免费兼容:IE7++...
8.2 如何设计Web数据库 8.2.1 考虑要建模的实际对象 8.2.2 避免保存冗余数据 8.2.3 使用原子列值 8.2.4 选择有意义的键 8.2.5 考虑需要询问数据库的问题 8.2.6 避免多个空属性的设计 8.2.7 表格类型的总结 ...
8.2 如何设计Web数据库 8.2.1 考虑要建模的实际对象 8.2.2 避免保存冗余数据 8.2.3 使用原子列值 8.2.4 选择有意义的键 8.2.5 考虑需要询问数据库的问题 8.2.6 避免多个空属性的设计 8.2.7 表格类型的总结 8.3 Web...
8.2 如何设计Web数据库 8.2.1 考虑要建模的实际对象 8.2.2 避免保存冗余数据 8.2.3 使用原子列值 8.2.4 选择有意义的键 8.2.5 考虑需要询问数据库的问题 8.2.6 避免多个空属性的设计 8.2.7 表格类型的总结 ...
8.4.5 再论枚举器 8.5 排序 8.6 通用集合库 8.7 新集合 8.7.1 使用Collections 8.7.2 使用Lists 8.7.3 使用Sets 8.7.4 使用Maps 8.7.5 决定实施方案 8.7.6 未支持的操作 8.7.7 排序和搜索 8.7.8 实用工具 8.8 总结 ...
8.4.5 再论枚举器 8.5 排序 8.6 通用集合库 8.7 新集合 8.7.1 使用Collections 8.7.2 使用Lists 8.7.3 使用Sets 8.7.4 使用Maps 8.7.5 决定实施方案 8.7.6 未支持的操作 8.7.7 排序和搜索 8.7.8 实用工具 8.8 总结 ...
采用XHTML和CSS设计可重用可换肤的WEB站点 asp.net的网址重定向方法的比较:面向搜索引擎友好 也谈 ASP.NET 1.1 中 QueryString 的安全获取写法 ASP.NET运行模式:PageHandlerFactory 利用搜索引擎引用来高亮页面...
DispatcherServlet是前端控制器设计模式的实现,提供Spring Web MVC的集中访问点,而且负责职责的分派,而且与Spring IoC容器无缝集成,从而可以获得Spring的所有好处。 具体请参考第二章的图2-1。 ...
11 函数闭包装饰器运行流程 12 函数闭包带参数装饰器 第21章 01 查询功能 02 修改功能 03 程序的解耦 04 module模块和包的介绍 05 模块的执行以及__name__ 06 关于模块的介绍 07 time时间模块 08 random模块 第22...
用户角色模型在购物流程设计的重要性 139 大额商品的下单流程 140 电子商务购物流程:注册登录的必要性 143 第14章 屏幕分辨率和布局 147 网页字号多大才合适 148 物理尺寸 148 到人眼的距离 150 用JavaScript实现...
设计的整个流程,一定要做到安全可靠,这不仅仅是对对消费者负责 ,也是对设计者负责。 智能家居方案设计 例2 一、时间: 2021年1月1日-2021年12月31日 二、年度目标: 1、完成专业营销型网站建设(改版参考"如何打造...
教务系统数据库设计 课题的研究背景与意义 课题的研究... 1、开发工具的选择 用Tomcat作Web服务器,利用My Eclipse设计代码,使用MySQL建立数据库。 2、运行环境要求 中央处理器:Inter Pentium 4 2.67GHz或更高性能
{1.9}流程控制}{31}{section.1.9} {1.9.1}\texttt {if\ldots esle\ldots }}{31}{subsection.1.9.1} {1.9.2}\texttt {switch}}{31}{subsection.1.9.2} {1.9.3}\texttt {while}}{32}{subsection.1.9.3} {1.9.4}\...
这些改进包括:改进的活动编程模型、改进的设计器体验、新的流程图建模样式、展开的活动面板、工作流规则集成和新的消息相关功能。 .NET Framework 4 还显著提高了基于 WF 的工作流的性能。 有关 WF 的增强功能的...
教务系统数据库设计 课题的研究背景与意义 课题的... 1、开发工具的选择 用Tomcat作Web服务器,利用My Eclipse设计代码,使用MySQL建立数据库。 2、运行环境要求 中央处理器:Inter Pentium 4 或更高性能的CPU(推荐
目前,它是为Web开发人员用户量身定制的,但可以根据自己的需要进行整理,以创建自己的个人目录。 它具有单个图像网格和用于列表的大网格。 好处 通过一个个人目录来改善您的工作流程,该目录将所有必要的链接和...