disproportional edge thickness

[cdanielmachado]

When drawing edges with different values, I would expect the thickness to be proportional to the values. For instance, in this case where the values are 10 and 12, I would expect one arrow to be 20% larger than the other:

This can be fixed by creating an hidden edge with a value of 0:

But it would be nice to see the expected sizes without using this workaround.

[cdanielmachado]

By the way, is it possible to use the argument scaling.customScalingFunction ?

I tried a python function, but I get an error saying it is not JSON serializable. If I try to give it a string representation of a python or javascript function I get no error, but it doesn't work either.

[boludo00]

Hey @cdanielmachado
So that odd behavior seems to be a result of the default scaling method that the javascript layer is using.

I'll have to play around with the customScalingFunction, since natively it is meant to be a JS function interpreted by VisJS's API. So the python binding would have to be hooked to that in a way.
One thing that can be done is to write your own custom scaling function in javascript and put that in the template thats used to generate the final visual. Of course you would need to reference the VisJS API to see what that looks like.

From their docs at http://visjs.org/docs/network/edges.html:

If edges have value fields, this function determines how the size of the nodes are scaled based on their values. The default function is:

function(min,max,total,value) {
    if (max === min) {`
    return` 0.5;
  }
  else {
    var scale = 1 / (max - min);
    return Math.max(0,(value - min)*scale);
  }
}

The function receives the minimum value of the set, the maximum value, the total sum of all values and finally the value of the node or edge it works on. It has to return a value between 0 and 1. The nodes and edges then calculate their size as follows:
var scale = customScalingFunction(min,max,total,value);
var diff = maxWidth - minWidth;
myWidth = minWidth + diff * scale;
Please note: maxWidth and minWidth are the values scaling.max and scaling.min provided in the options.

You might also want to see if you could use the width argument instead of value, then you can integrate that with your own scaling function?

[cdanielmachado]

Good point, I will try width instead of value and let you know how it goes.

[cdanielmachado]

Using width instead of value does produce the expected behaviour. I suppose that with width it uses the given units directly has they are, whereas with value it applies the scaling function. So no need to define a customized scaling function if we just use the width parameter directly. 👍