Custom edge rendering examples

[svitkin]

Thank you for the package! It's been great to use. However, customizing rendering with WebGL is very challenging for a beginner. Your custom node rendering example is helpful to get started, but if possible could you add more documentation or examples for customizing rendering with both nodes and edges?

Also, related to this, can someone point me in the right direction for giving the edges "padding" (i.e. a bigger hover and click area than their size)?

[jacomyal]

Hi @svitkin,

We are currently working on sigma v3, and the main breaking change is how to write custom renderers. They are becoming easier to write, event if the shaders are still a pain to develop (but we did not find anything better). Also, v3 will come with some documentation about all this.

About a custom edge renderer exemple, we can probably move the edge.triangle program to an exemple, since I don't think anyone actually uses it yet.

Finally, to answer your question about increasing the interactive area of an edge:

• In v2, it's impossible, because we use an early exit in the code if the pixel on the edges layer under the mouse is not colored (so no interaction outside the colored pixels of an edge)
• In v3, if we successfully implement picking, it will become possible to have the edges rendered thicker on the picking layer than on the visible layer, but it will still require you to write your own edge renderers

One more note though: In v3, you can set the "zoomToSizeRatioFunction" setting to (x) => x. This will make nodes and edges sizes grow linearly to the zoom level, rather than it's square root. That's what we do in Gephi Lite for instance, and it makes interacting with edges way easier.

[svitkin]

Thank you for your response @jacomyal. That makes a lot of sense, very excited for v3! I will try out upgrading to the v3 alpha in the meantime and mess around with it.

[svitkin]

Also! And forgive my webgl ignorance, but could some of this edge hovering functionality be covered by a setting like edgeHoverSize? And this could be impossible because of the early exit you were referencing, but then edge detection could use that size in it's calculations rather than the visible size? It might be simpler than a picking layer (although that sounds way more extensible and useful). Was trying it out with a forked version of the main branch but maybe I'll experiment with the v3 branch.