bpmn-jsAPI
bpmn-js介绍:
github/bpmn-io
1.导⼊流程图
var bpmnModeler = new BpmnJS({
container: '#canvas',
keyboard: {
bindTo: window
}
});
bpmnModeler.importXML(bpmnXML, function (err) {
if (err) {
('could not import BPMN 2.0 diagram', err);
}
var canvas = ('canvas');
<('fit-viewport');
});
2.导出流程图XML
bpmnModeler.saveXML({ format: true }, function (err, xml) {
if (err) {
('could not save BPMN 2.0 diagram', err);
}
xmldata = xml;
});
3.读取节点属性
ar eventBus = ('eventBus');
<('element.click', function(evt) {
$('#hidNode').val(evt.element.id);
$('#hidNodeType').val(pe);
$('#hidNodeName').val(evt.element.businessObject.name);
})
4.更新节点名称
var modeling = ('modeling');
var shape = ('elementRegistry').get(nodeId);
modeling.updateProperties(shape, { name: "新名称" });
5.改变节点颜⾊
var elementToColor = ('elementRegistry').get('StartEvent_1');
var modeling = ('modeling');
modeling.setColor([elementToColor], {
stroke: 'green',
fill: 'rgba(0, 80, 0, 0.4)'
});
vuejs流程图插件待整理……

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。