CODEWITHSUNDEEP
javascriptvis.jsvis.js-network
Roy Tang
Roy Tang

Reputation: 5761

vis.js network - is there a setting to make the node labels stay the same size on zoom?

Basically the title. The client is complaining that when he zooms in, the text labels for the nodes are quite large. Is there a way to keep the node labels at a fixed font size even when zooming in or out?

From the nodes documentation (http://visjs.org/docs/network/nodes.html), there's a scaling.label option, but it doesn't seem to work. I think this is only relevant if I'm using values to scale the nodes.

Upvotes: 1

Views: 1473

Answers (2)

AuBrO2
AuBrO2

Reputation: 31

Here is my implementation:

network.on( "zoom", function(properties){
    var options = {
        nodes: {
            // 1/scale to make text larger as scale is smaller
            // 16 is my default font size
            font: {
                size: ( 1 / network.getScale() ) * 16
            }              
        }
    };
    network.setOptions(options);
});

Upvotes: 3

YakovL
YakovL

Reputation: 8316

As far as I know, there's no such option. The scaling.label option, if I understand correctly what you mean, is used to set a scaling factor, not disable zooming.

However, you can implement this yourself, namely change scaling of labels on zoom. Fortunately, there's zoom event: set a handler like

network.on('zoom',rescaleLabels);

and implement rescaleLabels by setting the corresponding scale factor to their labels. In there, you can use network.getScale() to get new scale and then set scaling of nodes.

Upvotes: 0

Related Questions