问题
I've implemented a simple network using vis.js. Here's my code:
//create an array of nodes
var nodes = [
{
id: "1",
label: "item1"
},
{
id: "2",
label: "item2"
},
{
id: "3",
label: "item3"
},
];
// create an array with edges
var edges = [
{
from: "1",
to: "2",
label: "relation-1",
arrows: "from"
},
{
from: "1",
to: "3",
label: "relation-2",
arrows: "to"
},
];
// create a network
var container = document.getElementById('mynetwork');
// provide the data in the vis format
var data = {
nodes: nodes,
edges: edges
};
var options = {};
// initialize your network!
var network = new vis.Network(container, data, options);
On performing the zoom-out operation multiple times the network disappears. Are there any functions to limit the zooming level?
回答1:
I wrote you some code to get this function working since there is no zoomMax function within the network of vis.js, I wrote some basic logic to help you out.
var container = document.getElementById('mynetwork');
var data = {
nodes: nodes,
edges: edges
};
var afterzoomlimit = { //here we are setting the zoom limit to move to
scale: 0.49,
}
var options = {};
var network = new vis.Network(container, data, options);
network.on("zoom",function(){ //while zooming
if(network.getScale() <= 0.49 )//the limit you want to stop at
{
network.moveTo(afterzoomlimit); //set this limit so it stops zooming out here
}
});
Here is a jsfiddle: https://jsfiddle.net/styb8u9o/
Hope this helps you.
回答2:
You can use this code is better because you will never go to the middle of the network when you reach the zoom limit:
//NetWork on Zoom
network.on("zoom",function(){
pos = [];
pos = network.getViewPosition();
if(network.getScale() <= 0.49 )
{
network.moveTo({
position: {x:pos.x, y:pos.y},
scale: 0.49,
});
}
if(network.getScale() >= 2.00 ){
network.moveTo({
position: {x:pos.x, y:pos.y},
scale: 2.00,
});
}
});
来源:https://stackoverflow.com/questions/49299774/how-to-limit-zooming-of-a-vis-js-network