我正在尝试在类似方案的流程图中使用Vis.js.
我从数据库中获取流程图的信息,并希望使用Vis.js来帮助我正确地布置流程图节点。
但是,我希望START节点和END节点始终位于容器右边缘的左边缘和中心的中心。
我似乎无法弄清楚这样做的选择。
到目前为止我的代码在这支笔中:
var container = document.getElementById('visualization');
var nodes = [];
var edges = [];
nodes.push({
id: 1,
label: "START",
shape: "box",
fixed: {
x: true,
y: true,
},
x: 100,
y: 100,
});
nodes.push({
id: 2,
label: "test node 2"
});
nodes.push({
id: 3,
label: "test node 3"
});
nodes.push({
id: 4,
label: "test node 4\n Second line"
});
nodes.push({
id: 99,
label: "END",
fixed: true,
shape: "box",
});
edges.push({
from: 1,
to: 2,
label: 'text'
});
edges.push({
from: 1,
to: 3
});
edges.push({
from: 3,
to: 99
});
edges.push({
from: 2,
to: 4
});
edges.push({
from: 4,
to: 99
});
edges.push({
from: 3,
to: 4
});
var data = {
nodes: nodes,
edges: edges
};
var options = {
physics: {
enabled: true,
stabilization: true,
barnesHut: {
avoidOverlap: 1
},
},
edges: {
arrows: {
to: {
enabled: true,
scaleFactor: 1
},
middle: {
enabled: false,
scaleFactor: 1
},
from: {
enabled: false,
scaleFactor: 1
}
},
}
};
var timeline = new vis.Network(container, data, options);
http://codepen.io/anon/pen/WwdGvP
如何根据容器确定START和END节点的位置,然后让VIS JS处理其余的布局?