`

用raphael实现的jbpm4web流程设计器

 
阅读更多

最近准备自己根据raphael学习和网上查阅到得知识,实现一个jbpm4风格的web流程设计器。有部分功能参考了CSDN网友wow4464提供的一个控件连线的实例,下载地址:http://download.csdn.net/detail/wow4464/7549803

 

连线的方式使用的是raphael拖拽的特性来实现的,发现在firefox下有问题,其他浏览器正常支持。除了raphael和jquery的javascript库之外,没有借助于任何第三方的库函数或插件。源码见附件。

分享到:
评论

相关推荐

    jbpm4.4 在线设计流程图 ext + raphael

    在线设计流程图功能使得流程设计更为直观和便捷,无需离开Web环境即可完成。本教程将深入探讨jbpm4.4的在线设计流程图特性,以及如何利用ext(一个JavaScript UI库)和raphael(一个矢量图形库)进行流程图的绘制与...

    基于JQuery、Raphael的Web流程流程设计器

    分享个自己写的WEB流程设计器。基于jquery, raphael实现,采用MVC框架backbone组织代码,参考了网上的myflow(不知来源),codiqa上的设计器。不过,很抱歉的是,目前不能画折线,只作为分享、学习用,有需要的可以...

    web设计器-设计流程图[raphael]

    在实际项目中,结合"web设计器"的概念,我们可以开发一个基于Raphael的在线工具,让用户通过拖拽图形元素,自定义属性,以及预览和导出流程图。这样的工具不仅可以简化设计过程,还能提高工作效率,尤其对于非技术...

    web流程图动态绘制-使用raphael

    在给定的博客文章中,作者详细介绍了如何使用Raphael实现流程图的步骤。文章可能包含了以下内容: 1. **初始化Raphael画布**:在HTML中创建一个div元素,然后在JavaScript中使用`Raphael('div_id', width, height)`...

    Raphael编写的在线流程设计器前台部分

    在"Raphael编写的在线流程设计器前台部分"中,我们主要关注的是如何使用Raphael库来实现一个交互式的、用户友好的流程图设计工具。 首先,我们需要理解Raphael的核心概念。Raphael提供了一系列的基本图形对象,如...

    基于Raphael编写的在线流程设计器前台部分

    基于Raphael和Jquery开发,完全不依赖于ext等框架,属性设置使用的easyui,用的w3cDOM生成xml代码,点击保存后会弹出最终的jpdl内容与可以保存到数据库的图像对应json(此json还可以在页面重新加载,即可实现流程图...

    myflow web流程设计器

    "myflow web流程设计器"是一款基于Web的流程图设计工具,专为实现在线流程图设计和后台数据驱动的前台流程图展示而开发。这个工具的核心是"myflow.js"源码,它利用了Raphael图形库来绘制流程图。Raphael是一个强大的...

    web js流程设计器

    WEB 流程设计器、基于以下js开发:小巧轻便。可以自己二次开发。 适用于大多数浏览器。主要用的js有raphael-min.js,myflow.js,myflow.editors.js raphael.js 是一个小巧的图形图像动画处理的JS包、基于SVG和VML...

    raphael.js绘制流程图

    Raphaël.js是一款强大的JavaScript库,专门用于在Web浏览器中创建矢量图形。这个库使得开发者能够在HTML5 canvas或SVG(Scalable Vector Graphics)上绘制复杂的图形,包括流程图。流程图是一种用于表示算法、工作...

    myflow流程图设计采用raphael的js文件未混淆

    在本例中,我们可以直接查看myflow如何与Raphaël库交互,了解其实现流程图的各种功能和特效的细节。 总结来说,myflow结合Raphaël库提供了一个高效且灵活的Web流程图设计解决方案。未混淆的源代码使得这个工具对...

    raphael画流程图

    这可以通过添加事件监听器实现,如`element.click`和`element.hover`。 在提供的"flowchart"文件中,可能包含了一个示例流程图的代码,包括如何组织图形、连接线以及缩放逻辑。通过分析和学习这个示例,你可以更好...

    流程图设计工具,基于raphael

    基于Raphael的流程设计器是这样一种工具,它利用Raphael库的强大功能来实现在线流程图的绘制。Raphael是一个JavaScript库,专门用于在Web浏览器中创建矢量图形,其支持SVG(可缩放矢量图形)和VML(矢量标记语言)...

    完美兼容ie8的Raphael流程图

    总的来说,这个Raphael流程图示例提供了一个全面的解决方案,不仅解决了在IE8上绘制矢量图形的问题,还实现了交互性和动态数据加载。对于那些需要在老旧浏览器上展示复杂图形和流程的开发者来说,这是一个非常有价值...

    raphael 工作流程设计 源码

    arrow:{path:"M10 10L10 10",stroke:"#808080",fill:"#808080","stroke-width":2,radius:4}, fromDot:{width:5,height:5,stroke:"#fff",fill:"#000",cursor:"move","stroke-width":2}, toDot:{width:5,...

    myflow流程图设计采用raphael的js文件

    在本文中,我们将深入探讨如何使用Raphael.js库来创建myflow流程图设计。Raphael.js是一个强大的JavaScript库,专为Web开发人员提供矢量图形支持。它允许开发者在SVG(可缩放矢量图形)和VML(矢量标记语言)之间...

    Raphael 制作流程图源码

    Raphael 简单的一个流程图,自己没事的时候瞎琢磨的。 大家以前讨论讨论

    raphael绘制流程图

    在"raphael绘制流程图"这个主题中,我们将探讨如何利用Raphaël库来制作动态的、具有分支的流程图。 首先,流程图是一种图形表示方法,常用于描绘工作流程或系统操作过程。它们由各种形状(如矩形、菱形、椭圆等)...

    raphael实现双击实现动态编辑文字

    Raphaël是一款强大的JavaScript库,专用于在Web浏览器中创建矢量图形。它支持SVG(Scalable Vector Graphics)标准,并提供了丰富的API,使得开发者能够轻松地在网页上绘制和操作复杂的图形元素,包括文字。本文将...

Global site tag (gtag.js) - Google Analytics