最近的项目要能创建流程, 流程配置什么的就找了 jsplumb 来做流程的显示配置。经过两天的研究成果已经很明显了

参考了以下一些大神们的博客:

jsplumb 中文教程 连线绘图工具库介绍 附简单在线demo与实战项目

使用jsPlumb做的一个可拖拉的流程图

现在的成果图:

拖拽, 链接环节事件(可用于触发两个环节直接连接要触发的事),   捕获 双击环节块事件   (可后续用于弹出框来修改环节信息等),  右键环节块 弹出菜单(现在只有一个删除)。

基本已经搭好了,最后只要根据自己的需求进行每个环节要执行的数据库操作进行操作。

事件也已经设置好了,

获取数据显示(这边用json文件假装后台数据)也已经完成。

基本都是参考第一个链接的内容

具体代码可下载自行查看

https://github.com/wzhGitH/jsplumbTest

jsplumb 的初次使用的更多相关文章

  1. HashTable初次体验

    用惯了数组.ArryList,初次接触到HashTable.Dictionary这种字典储存对于我来说简直就是高大上. 1.到底什么是HashTable HashTable就是哈希表,和数组一样,是一 ...

  2. 初次启动app校验的活动图和分析

    初次启动活动图 version 1 version 2 version 3 根据上图的活动图分析,可能存在较严重的问题: 主线程中如果发现是sdcard的url,则可能进行重命名 FirstEnter ...

  3. 百度地图API试用--(初次尝试)

    2016-03-17: 百度地图API申请key的步骤相对简单,不做过多阐述. 初次使用百度地图API感觉有点神奇,有些功能加进来以后有点问题,注释掉等有空再解决. 代码如下: <%@ page ...

  4. [masmplus]初次使用报external symbol _start 是配置问题

    初次使用masmplus 其中在 codesg segment 使用了 start 标记, 并在end处标明了:end  start  但是默认的masmplus 会提示 start 为 不认识的 e ...

  5. 初次接触json...

    这两天发现很多网站显示图片版块都用了瀑布流模式布局的:随着页面滚动条向下滚动,这种布局还会不断加载数据并附加至当前尾部.身为一个菜鸟级的程序员,而且以后可能会经常与网站打交道,我觉得我还是很有必要去尝 ...

  6. jsPlumb的简单使用

    jsPlumb概述jsPlumb是一个在dom元素之间绘制连接线的javascript框架,它使用svg技术绘制连接线. 基本概念很明显,一个连线主要要解决的问题包括谁和谁连,在哪里连(连接点在哪里) ...

  7. Zookeeper初次使用

    下面介绍Linux系统中Zookeeper的初次使用方法. 1.jdk安装和zookeeper下载 首先从jdk官网中下载jdk文件,然后将文件放在/usr/local/java目录下解压,并打开.b ...

  8. 初次使用IDEA的相关技巧

    前言:由于初次使用IDEA,所以很多配置都不是非常熟悉,经过一下午慢慢熟悉和同事的帮助,终于有所斩获,现在我把这个总结写出来,希望能够帮助初次使用的java工程师. 1:下载和安装 下载地址:http ...

  9. 20145330《Java学习笔记》第一章课后练习8知识总结以及IDEA初次尝试

    20145330<Java学习笔记>第一章课后练习8知识总结以及IDEA初次尝试 题目: 如果C:\workspace\Hello\src中有Main.java如下: package cc ...

随机推荐

  1. Sails 框架学习资料

    一介布衣 http://yijiebuyi.com/so.html?k=sails sails modules 模型自带的方法介绍 2016-09-06  929  nodejs查看更多 node.j ...

  2. 看我学习Apache+php+wordpress+phpMyAdmin的搭配配置

    开场白:我不是这方面的"专家"或"菜鸟",因为我不懂,别问我为什么,我只是心血来潮好奇,东拼西凑写了这些文字. 1.php的配,使用免安装版本,要进行的设置, ...

  3. 22.解决 eclipse 与 AS 共用 SDK 导致 eclipse ADT 无法使用的问题

    相信很多同学在从eclipse 转 AS 都会遇到这个问题,因为方便所以共用了一个sdk 目录,但是AS 会主动更新sdk,然而手贱的跟新了一夜,再打开eclipse的时候瞬间呆滞了,这一夜发生什么了 ...

  4. 重新编写equals()方法，hashCode()方法，以及toString()，提供自定义的相等标准，以及自描述方法

    下面给出一个实例,重新编写equals()方法,提供自定义的相等标准 public class PersonTest { public static void main(String[] args) ...

  5. 深度分析ORACLE热点块问题

    1.热点块的定义 数据库的热点块,从简单了讲,就是极短的时间内对 少量数据块进行了过于频繁的访问.定义看起来总是很简单的,但实际在数据库中,我们要去观察或者确定热点块的问题,却不是那么简单了.要深刻地 ...

  6. AngularJS 笔记系列（三）模块和作用域

    模块: 在 AngularJS 中,将函数代码全部都定义在全局命名空间中绝对不是什么好主意,全局变量污染会使冲突几率变大,调试困难,降低开发效率.上次写计时器的 controller 时,我们把 co ...

  7. [笔记] Ubuntu 18.04安装Docker CE及nvidia-docker2流程

    Docker的好处之一,就是在Container里面可以随意瞎搞,不用担心弄崩Host的环境. 而nvidia-docker2的好处是NVidia帮你配好了Host和Container之间的CUDA相 ...

  8. 如何获取iClap的内测资格

    iClap,一款拥有智能产品管理能力的系统,第一次遇见是在8月下旬的创新中国的展会上,茫茫人海中只因多看了你一眼,便深深的留在脑海里挥之不去,展会结束的当天就忍不住想要更多的了解你,登陆iClap官网 ...

  9. XVII Open Cup named after E.V. Pankratiev Stage 14, Grand Prix of Tatarstan, Sunday, April 2, 2017　Problem F. Matrix Game

    题目: Problem F. Matrix GameInput file: standard inputOutput file: standard inputTime limit: 1 secondM ...

  10. 【1】Kali Linux的安装及配置

    爱生活就得够GEEK. ---------------------------------------------------------------完美的分割线------------------- ...