【发布时间】:2022-12-21 17:30:12
【问题描述】:
我正在尝试在我的程序中添加 visjs 示例的加载栏: Vis.js example 参见“加载栏”。问题是这两个事件:stabilizationProgress 和 stabilizationIterationsDone 从未触发,但 startStabilizing 和 stabilized 被触发,所以我真的不明白。
这是事件的代码:
this.networkInstance.on('startStabilizing', () => {
console.log('stab start');
});
this.networkInstance.on('stabilized', () => {
console.log('stabilized');
this.networkInstance.setOptions({ physics: false });
});
this.networkInstance.on("stabilizationProgress", function (params) {
console.log("progress")
var maxWidth = 496;
var minWidth = 20;
var widthFactor = params.iterations / params.total;
var width = Math.max(minWidth, maxWidth * widthFactor);
document.getElementById("bar")!.style.width = width + "px";
document.getElementById("text")!.innerText =
Math.round(widthFactor * 100) + "%";
});
this.networkInstance.once("stabilizationIterationsDone", function () {
console.log("done")
document.getElementById("text")!.innerText = "100%";
document.getElementById("bar")!.style.width = "496px";
//document.getElementById("loadingBar")!.style.opacity = 0;
// really clean the dom element
setTimeout(function () {
document.getElementById("loadingBar")!.style.display = "none";
}, 500);
});
这是我的选择:
var options = {
interaction: { hover: true, selectConnectedEdges: false, tooltipDelay: 200, hideEdgesOnDrag: true, hideEdgesOnZoom: true },
physics: {
forceAtlas2Based: {
gravitationalConstant: -26,
centralGravity: 0.005,
springLength: 100,
springConstant: 0.18,
},
maxVelocity: 146,
minVelocity: 10,
solver: "forceAtlas2Based",
timestep: 0.2,
stabilization: {
enabled: true,
iterations: 2000,
updateInterval: 1,
}
}
};
我尝试使用其他 updateInterval 值,但无论如何都没有触发事件,我真的不明白为什么稳定开始和结束正确但 stabilizationProgress 和 stabilizationIterationDone 不起作用。
如果有人可以向我提供解释,我会很乐意。提前致谢。