bpmn.js工作流**非NPM**方式使用

套用官方的一句话,使用bpmn.js,一步一步来,嘿嘿。

BPMN.js介绍

bnmp.js是一个BNPM2.0渲染工具箱和web建模器,我们能够很简单的嵌入BPMN2.0的图标到到我们的浏览器器里面(不需要借助后端)。

bpmn.js的引入

1.通过npm的方式引入,非常简单,参考官网http://bpmn.io/toolkit/bpmn-js/就能非常简单的搭建。
2.通过本地预打包的方式
    首先就是引入必要的JS文件。bpmn-modeler.min.js(可以去官方例子找,下载到本地)
    加载必要的css文件,diagram-js.css,bpmn-embedded.css(去官方例子找,下载到本地)

bpmn.js的容器

因为通过可视化的方式,因此需要添加一个包含元素渲染图表到我们的浏览器里面
    <div id=“canvas”></div>

实例

通过JS实例,在浏览器上面实例一个基本的工作流。

			<script>
			  // the diagram you are going to display
			  
  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 3
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值