`
vlinux
  • 浏览: 53406 次
  • 性别: Icon_minigender_1
  • 来自: 火星
社区版块
存档分类
最新评论

纯JavaScript实现的WorkFlow毛坯

阅读更多
在网络上看了不少WEB的workflow设计器,发现都是用VML、SVG或者Flash做的,唯独没有用纯JavaScript实现,主要的问题都是在画线上。

参考了网络上很多JavaScript画线的例子,发现他们都是采用许多div来构成点,从而连成线。这样不仅效率低而且也难实现和控制。

我想出了一个办法,也是用DIV来画线,不过我利用的是DIV的边框。
为了省事,拖拽、改变大小的功能用了jQuery


缺陷:不能方便的画箭头,方法是有,不过我觉得算法太繁琐。
优点:不用基于其他技术,API简单,学习成本低。。


//例子
var flow = new Flow("flow_panel");
var nodeA = new Node("节点A",flow,0,0,100,100)
    .connect(new Node("节点B-1",flow,200,200,100,100))
    .connect(new Node("节点B-2",flow,400,400,100,100));


HOHO,让我忙乎了几天呢

  • 大小: 20 KB
分享到:
评论
1 楼 QuakeWang 2009-02-10  
想法很cool,对那种不是特别复杂流程完全可以用,箭头的话能否通过CSS背景图片来简单解决?

相关推荐

    workflow实现的源代码

    【标题】"workflow实现的源代码"涉及到的是工作流(Workflow)系统在信息技术中的实际应用,尤其是OA(Office Automation)系统的开发。工作流系统是一种自动化业务流程的技术,它能够管理和控制文档、信息或任务在...

    使用js编写的Workflow

    【标题】"使用js编写的Workflow"涉及到的主要知识点是JavaScript编程和工作流(Workflow)的实现,特别是如何在Web环境中创建一个支持拖放功能的工作流系统。JavaScript是一种广泛用于前端开发的脚本语言,它允许...

    EXTJS 风格的工作流 workflow workflowdefine 纯JS源代码

    综上所述,"EXTJS风格的工作流 workflow workflowdefine 纯JS源代码"意味着这个压缩包包含了一套使用EXTJS框架编写的工作流程管理系统,开发者可以通过阅读和理解源代码,学习如何在JavaScript环境中实现工作流管理...

    OA工作流WorkFlow版本(前台JS实现)

    OA工作流(Office ...通过以上分析,我们可以看出"OA工作流WorkFlow版本(前台JS实现)"是一个基于JavaScript实现的前端工作流管理系统,它需要深入理解工作流概念,熟悉前端开发技术,以及良好的前后端协作能力。

    js-workflow:为 JavaScript 的工作流建模。 仅限服务器端。 基于ES6

    js-工作流 为 JavaScript 的工作流建模。 仅限服务器端。 基于 ES6。用法要允许您使用js-workflow,您需要加载它: npm i -S js-workflow 将其添加到您的代码中: var Workflow = require('js-workflow').Workflow, ...

    FireWorkflow_3_各种工作流模式的实现整理.pdf

    FireWorkflow 3 工作流模式实现整理 FireWorkflow 3 是一种流行的工作流引擎,用于实现复杂的业务流程。该引擎提供了多种工作流模式,帮助开发者快速构建企业级应用程序。本文档对 FireWorkflow 3 中各种工作流模式...

    Proficy Workflow通过工作流管理实现数字化生产过程

    ### Proficy Workflow通过工作流管理实现数字化生产过程 #### 一、引言 随着信息技术的发展,企业越来越依赖于数字化手段来提升生产效率和管理水平。在这一背景下,Proficy Workflow作为一种强大的工作流管理系统...

    jira workflow 工作流

    综上所述,Jira工作流是项目管理中的重要组成部分,通过合理设置触发条件、校验条件和处理结果,结合工作流扩展插件,可以实现高效的项目管理和任务流转。对于Jira用户来说,理解和掌握这些概念及工具,将极大地提升...

    手把手教workflow

    通过本资源,您将学习如何使用 Workflow 程序创建一个 Hello World 应用程序,并了解 Workflow 程序的基本概念和实现机制。 什么是 Workflow 程序? Workflow 程序是一种基于活动的编程模型,允许开发者使用可视化...

    workflow_springbootworkflow_workflowdemo_workflowspringBoot_work

    工作流(Workflow)是软件系统中用于管理业务流程自动化的重要技术,它可以帮助组织或企业实现流程规范化、提高工作效率。在本项目"workflow_springbootworkflow_workflowdemo_workflowspringBoot_work"中,开发者...

    Hue-workflow配置流程

    Hue的Workflow(工作流)组件则是用于构建和管理复杂的Hadoop作业流程,允许用户通过拖拽操作来设计数据处理任务,而无需编写复杂的命令行脚本或Java代码。在本文中,我们将深入探讨如何使用Hue配置和运行一个...

    lotus的workflow教程

    现在,这个想法终于可以实现了。 Domino Workflow是一个非常强大的工具,当真正接触以后,真有一种博大精深,值得不断发掘的感觉。本书吸取了Domino Workflow帮助库中的精华,加入了作者在学习和具体实施时遇到的...

    WorkFlow C++ 工作流图形

    "WorkFlow C++ 工作流图形"是一个专注于在C++环境中实现工作流管理的图形化库。工作流,简单来说,就是一系列按照特定顺序执行的任务或活动,它在企业管理、软件开发、流程自动化等领域中广泛应用。C++作为一门强大...

    C# Workflow WCF EXAMPLE

    为了确保性能,C# Workflow和WCF的实现需要考虑优化,例如,缓存服务代理、批量数据传输、合理设置服务契约和服务行为等。此外,安全性也是关键,包括认证、授权、加密等,以保护敏感数据和防止未授权访问。 总结来...

    workflow 工作流引擎c#版本 源码

    本压缩包提供的"workflow 工作流引擎c#版本 源码"是一个基于C#实现的工作流引擎,包含了完整的源代码和数据库相关资源,这对于开发者来说是一个宝贵的资源,可以用于学习、研究或自定义开发工作流解决方案。...

    allegro中workflow manager求解

    标题 "Allegro 中 Workflow Manager 求解" 表明了本文将集中讨论 Allegro 中 Workflow Manager 的应用和实现。 描述 "Allegro 中 Workflow Manager 求解" 强调了 Workflow Manager 在 Allegro 设计流程中的重要性,...

    snaker-workflow源码加配置文件

    通过研究这些源码和配置文件,开发者可以了解Snaker Workflow的内部实现,比如流程实例是如何创建和执行的,任务是如何分配和完成的,以及如何扩展流程引擎来满足特定业务需求。这对于提高开发效率和优化流程管理...

    工作流(workflow)请假流程实例

    工作流(Workflow)是一种自动化处理任务的技术,它在IT领域被广泛应用,特别是在企业管理、项目协作和数据处理等方面。工作流的核心在于定义并管理业务过程,确保任务按照预设的规则和顺序有效地执行。在这个“请假...

    疯狂Workflow讲义1金币

    《疯狂Workflow讲义1金币》是一份深入探讨Workflow(工作流)技术和Activiti开源工作流引擎的宝贵资料。Workflow是企业信息化系统中的重要组成部分,它主要用于自动化业务流程,提高工作效率,减少人为错误。本讲义...

    搜狗服务器引擎Workflow v0.11.2.zip

    Workflow v0.11.2也可以作为一个计算机科学的案例,供教师和学生分析讨论,理解如何设计和实现一个高效的工作流引擎,以及如何将它应用于实际的服务器管理。 6. **说明.htm**: 这个文件很可能是对Workflow v...

Global site tag (gtag.js) - Google Analytics