在Flowchart.js中添加條件分支節點,可以使用if語句或switch語句來實現。下面是一個示例代碼,演示如何在Flowchart.js中添加一個條件分支節點:
// 創建一個簡單的Flowchart實例
var flowchart = new Flowchart({
container: document.getElementById('flowchart-container'),
data: {
nodes: [
{ id: 'start', text: 'Start', type: 'start', x: 100, y: 100 },
{ id: 'condition', text: 'Check condition', type: 'condition', x: 250, y: 100 },
{ id: 'process1', text: 'Process 1', type: 'process', x: 400, y: 50 },
{ id: 'process2', text: 'Process 2', type: 'process', x: 400, y: 150 },
{ id: 'end', text: 'End', type: 'end', x: 550, y: 100 }
],
edges: [
{ source: 'start', target: 'condition' },
{ source: 'condition', target: 'process1', text: 'true' },
{ source: 'condition', target: 'process2', text: 'false' },
{ source: 'process1', target: 'end' },
{ source: 'process2', target: 'end' }
]
}
});
在這個示例中,我們創建了一個包含條件分支節點的流程圖。條件分支節點的類型為’condition’,并在edges中指定了條件為true時的跳轉路徑和條件為false時的跳轉路徑。
您可以根據需要修改節點的位置、文本和樣式,以及添加更多的節點和邊緣來構建您的流程圖。Flowchart.js提供了豐富的API和功能,可以幫助您輕松創建復雜的流程圖。