最好用的流程编辑器bpmn-js系列之Palette

最好用的流程编辑器bpmn-js系列之基本使用

最好用的流程编辑器bpmn-js系列文章 BPMN(Business Process Modeling Notation)是由业务流程管理倡议组织BPMI(The Business Process Management Initiative)开发的一套标准的业务流程建模符号规范.其目的是为用户提供一套容易理解的标准符号,这些符号作为BPMN的基础元素,将业务流程建模简单化.图形化,将复杂的建模过程视觉化,让业务建模者.业务实施人员.管理监督人员对BPMN描述的业务流程都有一个更加清晰明了的了解.

Node.js系列-express(上)

前言 Node.js系列的第一篇:http,大概描述了通过使用node.js内置的api创建一个服务并监听request实现简单的增删改查.现在,我们就通过通读express官网及使用express框架来进一步了解node.js. Express 官网描述:基于 Node.js 平台,快速.开放.极简的 web 开发框架. 安装方式: npm install express --save 特性: 1.Web应用:Express 是一个基于 Node.js 平台的极简.灵活的 web 应用开发框架

基于canvas的流程编辑器

今年由于项目上需要给客户的流程管理系统进行升级,其中包含流程的可视化.于是在网上找一些可以用的轮子,考察了D3,js.GooFlow.js.G6-Editor等工具后,发现D3,js学习成本太高,G6-Editor功能基本够用,但是不能放大缩小图形和移动连接线是硬伤,而且GooFlow.js和G6-Editor目前已经闭源,于是就决定自己试着写一个流程编辑器. 由于之前画流程图基本使用的都是Visio,所以编辑器的操作风格基本和Visio一致,也吸收了一些G6-Editor的操作风格. HTML

SpringBoot+Activiti+bpmn.js+Vue.js+Elementui(OA系统审批流)

引言:OA系统用到请假.加班.调休.离职,需要使用工作流进行流程审批一:activiti流程设计器的选择(通过学习activiti工作流过程中,发现一款好的流程设计器将会更好的方便的设计好流程(主要介绍BPMN.JS)) 1.最开始使用activiti流程设计器是开发工具idea或eclipse中安装的bpmn流程插件(直接安装使用) 缺点:activiti官方已经不再维护这些插件,而且结合企业开发存在很大的缺陷 2.1:通过整合Acitiviti官网的在线流程设计器(Activiti-Mod

Ember.js系列文章

JS前端框架之Ember.js系列文章本文为文章索引,主要是罗列Ember.js的相关文章便于阅读. 相关演示代码:github for free. 基础篇 1. EmberJs之What|Why|HoW 2. EmberJs之Ember-data 3. EmberJs之使用Ember-data 4. EmberJs之ComputedProperty 5. EmberJs之@each&[] 6. EmberJs之动态创建数组进阶篇 1. 深入理解Ember-Data特性(上) 2. 深入理解

【D3.V3.js系列教程】--（十四）有路径的文字

[D3.V3.js系列教程]--(十四)有路径的文字 1. 在 svg 中插入一個 text // 在 body 中插入一個 svg var svg = d3.select('body').append('svg'); // 在 svg 中插入一個 text svg.append('text') .attr('x', 10) .attr('y', 20) .style('fill', 'steelblue') .style('font-size', '24px') .style('font-

【D3.V3.js系列教程】--（十五）SVG基本图形绘制

[D3.V3.js系列教程]--(十五)SVG基本图形绘制 1.path <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>testD3-13-path.html</title> <script type="text/javascript" src="http://localhost:8080/spring/j

【D3.V3.js系列教程】--（十二）坐标尺度

[D3.V3.js系列教程]--(十二)坐标尺度 1.多种类型的缩放尺度 Quantitative Scales Linear Scales Identity Scales Power Scales 可以参考https://github.com/mbostock/d3/wiki/Quantitative-Scales 我们一般采用线性缩放 2.定义域和值域定义域范围domain([100, 500]) 值域范围.range([10, 350]) var scale = d3.scale.lin

node.js系列笔记之node.js初识《一》

node.js系列笔记之node.js初识<一> 一:环境说明 1.1 Linux系统CentOS 5.8 1.2 nodejs v0.10.15 1.3 nodejs源码下载地址 http://blog.nodejs.org/ 1.4 开发工具 WebStorm6 下载地址 http://www.jetbrains.com/webstorm/whatsnew/ 二:安装配置 2.1 下载nodejs for linux (nodejs source) 2.2 nodejs安装过程中遇到的问题

微信JS图片上传与下载功能--微信JS系列文章（三）

概述在前面的文章微信JS初始化-- 微信JS系列文章(一)中已经介绍了微信JS初始化的相关工作,接下来本文继续就微信JS的图片上传功能进行描述,供大家参考. 图片上传 $(function(){ var signUrl = location.href.split('#')[0]; signUrl = encodeURIComponent(signUrl); $.ajax({ type:"POST", url: webPath.webRoot + "/wxsdk/getWei

微信JS分享功能--微信JS系列文章（二）

概述在上一篇文章微信JS初始化-- 微信JS系列文章(一)中已经介绍了微信JS初始化的相关工作,接下来本文继续就微信JS的分享功能进行描述,供大家参考. 代码 $(document).ready(function(){ wx.config({ debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印. appId: webParams.appId, // 必填,公众号的

js系列教程2-对象、构造函数、对象属性全解

全栈工程师开发手册 (作者:栾鹏) 快捷链接: js系列教程1-数组操作全解 js系列教程2-对象和属性全解 js系列教程3-字符串和正则全解 js系列教程4-函数与参数全解 js系列教程5-容器和算法全解 js系列教程6-BOM操作全解 js系列教程7-DOM操作全解 js系列教程8-事件全解 js系列教程9-表单元素全解 js系列教程10-canvas绘图全解 js系列教程11-json.ajax.comet全解 js系列教程12-离线应用与存储全解 var student1 = new O

js系列教程1-数组操作全解

全栈工程师开发手册 (作者:栾鹏) 快捷链接: js系列教程1-数组操作全解 js系列教程2-对象和属性全解 js系列教程3-字符串和正则全解 js系列教程4-函数与参数全解 js系列教程5-容器和算法全解 js系列教程6-BOM操作全解 js系列教程7-DOM操作全解 js系列教程8-事件全解 js系列教程9-表单元素全解 js系列教程10-canvas绘图全解 js系列教程11-json.ajax.comet全解 js系列教程12-离线应用与存储全解数组操作全解 js变量类型 var st

Node.js系列-http

前言: 最近一直忙着公司项目的事,战友们的留言也没空回复,博客也有段时间没有更新了,年底了就是一个的忙啊~~~(ps:同感的也给个赞吧) 现在前端的就是一直地更新一直有新的东西出来,什么ES2015,ES2016,到现在已经ES2018了,除了ES语法的更新迭代,JavaScript的强大又延伸到了后台,node.js.只能说学无止境啊,共勉吧~~~ Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境. 一句话总结了,node.js就是一个运行环境,个人理解

bpmn.js & BPMN diagram

bpmn.js & BPMN diagram BPMN 2.0 for the web https://github.com/bpmn-io/bpmn-js https://demo.bpmn.io/ Rendering toolkits and editors for BPMN 2.0, CMMN and DMN. https://blog.csdn.net/u013253924/article/details/85784002

关于h5使用bpmn.js

bpmn.js网站地址:https://bpmn.io/toolkit/bpmn-js/ bpmnjs是一款工作流绘制框架,遵循了bpmn2.0规范,实现从前台绘制工作流到后台执行的效果. 图示: 但bpmnjs只给出了vue提供方案和操作: h5使用案例(自己的资源):https://download.csdn.net/download/sinat_21587657/10708854 包含画图下载等. 部分方法说明: 定义和获取显示区域 var BpmnJS = window.BpmnJS;

Vue.js系列之三模板语法

Vue.js 使用了基于 HTML 的模板语法,允许开发者声明式地将 DOM 绑定至底层 Vue 实例的数据.所有 Vue.js 的模板都是合法的 HTML ,所以能被遵循规范的浏览器和 HTML 解析器解析. 在底层的实现上,Vue 将模板编译成虚拟 DOM 渲染函数.结合响应系统,在应用状态改变时,Vue 能够智能地计算出重新渲染组件的最小代价并应用到 DOM 操作上. 如果你熟悉虚拟 DOM 并且偏爱 JavaScript 的原始力量,你也可以不用模板,直接写渲染 (render) 函数,

JS代码高亮编辑器 ace.js

JS代码高亮编辑器 ace.js 字数254 阅读2 评论0 喜欢0 瞎扯 ace 是 js 实现的代码编辑器编译打包之后的 ACE 代码官网,未提供编译好的文件 ACE 拥有的特点语法高亮超过110种语言超过20个主题自动缩进减少缩进一个可选的命令行处理庞大的文件（400万线似乎是极限！）完全自定义的键绑定，包括vim和Emacs模式用正则表达式的搜索和替换突出显示匹配的括号软标签和实际标签之间切换显示隐藏字符使用鼠标拖放文本换行代码折叠多个光标和选择现场语法

Node.js系列——（4）优势及场景

背景之前几篇系列文章简单介绍了node.js的安装配置及基本操作: Node.js系列--(1)安装配置与基本使用 Node.js系列--(2)发起get/post请求 Node.js系列--(3)连接DB 接下来,我们就来整体认识下node.js node.js node.js官网对它的介绍是这样的: Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境. Node.js 使用了一个事件驱动.非阻塞式 I/O 的模型,使其轻量又高效. V8引擎 V8使用C+

你不知道的JS系列【1】- 什么是作用域

几乎所有的编程语言都能够储存变量,并且能在之后对这个变量值进行访问或修改,正是储存和访问变量的能力将状态带给了程序,那么,这些变量储存在哪里呢?程序需要时又是如何找到他们?这些问题说明需要一套设计良好的规则来储存变量,并且之后可以方便的找到这些变量,这套规则被称为作用域. 1.了解编译原理尽管将JS归类为"动态"或"解释执行"脚本语言,但事实上它是一门编译语言.但是与传统编译语言不同的是,它不是提前编译的,编译结果也不能在分布式系统中进行移植.JS引擎进行

巴特西