When you click and hold on a graph the movement starts, but does not stop when you release the mouse button. In the esm version (dist/esm.js), when you release the mouse button, the error appears:
Uncaught TypeError: undefined is not a function
at Graph3d$1._onMouseUp (Graph3d.js:2163:3)
at HTMLDocument.onmouseup (Graph3d.js:2080:8)
function (id): void {
import('https://cdn.jsdelivr.net/npm/vis-graph3d@latest/dist/esm.js').then(async (module) => {
const vis = await module.default;
function custom(x, y) {
return Math.sin(x / 50) * Math.cos(y / 50) * 50 + 50;
}
// Create and populate a data table.
let data = new vis.DataSet();
// create some nice looking data with sin/cos
var counter = 0;
var steps = 50; // number of datapoints will be steps*steps
var axisMax = 314;
var axisStep = axisMax / steps;
for (var x = 0; x < axisMax; x += axisStep) {
for (var y = 0; y < axisMax; y += axisStep) {
var value = custom(x, y);
data.add({ id: counter++, x: x, y: y, z: value, style: value });
}
}
// specify options
var options = {
width: "600px",
height: "600px",
style: "surface",
showPerspective: true,
showGrid: true,
showShadow: false,
keepAspectRatio: true,
verticalRatio: 0.5,
};
// Instantiate our graph object.
const container = document.getElementById(id);
let graph3d = new vis.Graph3d(container, data, options);
})
}
Expected behavior
I expect that when I release the mouse button the graph movement will stop.
Analysis
When I release the mouse button, the event throws an Error as related. It means that undefined is being used as function. At line 21486 of 'dist/esm.js' we found the problem:
Yes, this is a critical bug. The reason is because the dependency on vis-util is incorrect - allowing any minor version ^5.0.1 but vis-util removed the add/removeEventListener methods in version 5.0.6.
Graph movement don't stop after mouseup event
When you click and hold on a graph the movement starts, but does not stop when you release the mouse button. In the esm version (dist/esm.js), when you release the mouse button, the error appears:
To Reproduce
To test I use the example in
https://visjs.github.io/vis-graph3d/examples/graph3d/01_basics.html
with some modifications to wrap inside an import:
Expected behavior I expect that when I release the mouse button the graph movement will stop.
Analysis When I release the mouse button, the event throws an Error as related. It means that
undefined
is being used as function. At line 21486 of 'dist/esm.js' we found the problem:To bypass this bug until it is solved we set Graph3d._onMouseUp after instantiation: