關於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;
var bpmnViewer = new BpmnJS({
container : '#canvas'
});

 

       模板裝載和觸發事件

bpmnViewer.importXML(模板bpm代碼, function(err){
		if (err) { return fail(err); }
		try {
			var canvas = bpmnViewer.get('canvas');
			canvas.zoom('fit-viewport');
			var eventBus = bpmnViewer.get("eventBus");
			eventBus.on('element.click', function(evt) {
				//點擊元素，彈出頁面可以在這里寫
				// alert(0);
			});
			return success();
		} catch (e) {
			return fail(e);
		}
	});

　　

　　下載和保存

bpmnViewer.saveXML(...)

　　具體代碼需下載觀看。