Linkurious attributes don't work

Question

I'm attempting to set "visual variables" but failing at it. the complete code is here: http://pastebin.com/j6i1B8ie

<script type="application/javascript">
    var neo = { 
        url: 'http://localhost:7474',
        user: 'neo4j',
        password: '***'
    };  
    function customiseGraph(s) {
        s.graph.nodes().forEach(function(n) {
            n.type = 'square';
            n.color = '#4444BB';
            n.labelAlignment = 'left';
            if (n.neo4j_labels[0] == 'DMSys') {
                n.label = n.neo4j_data.System;
            }   
            if (n.neo4j_labels[0] == 'DMFile') {
                n.label = n.neo4j_data.Name;
                n.color = '#BB4444';
            }   
        }); 
        s.refresh();
    }   

    sigma.neo4j.cypher(neo,
        'MATCH (n) OPTIONAL MATCH (n)-[r]->(m) RETURN n,r,m LIMIT 100',
        { container: 'graph', type: 'canvas' },
        customiseGraph
    );  
</script>

in the above, I'd expect that every node displayed gets rendered as a square, but it doesn't. mind you, the colours get set correctly but neither labelAlignment or type are respected.

can I not do it this way? or what am I missing?

* Update I *

function customiseGraph(s) {
    s.settings({
        labelAlignment: 'inside',
        edgeColor: 'default',
        defaultEdgeColor: '#ff0000'
    }); 
    s.graph.nodes().forEach(function(n) {
        n.color = '#4444BB';
        if (n.neo4j_labels[0] == 'DMSys') {
            n.label = n.neo4j_data.System;
        }   
        if (n.neo4j_labels[0] == 'DMFile') {
            n.label = n.neo4j_data.Name;
            n.color = '#BB4444';
        }   
    }); 
    s.refresh();
}

which I would expect to produce red edges and the labels inside the nodes but does neither. what else do I need?

one final note: the 'inside' seems to work in Chrome but in Safari, if the nodes are not large enough to fit the label, it will get displayed to the right instead and increasing the zoom level does not help. increasing the node diameter fixes this. In Chrome the labels are always inside, no matter how small the node — ekkis, Jun 29 '15 at 21:28

Seb · Accepted Answer · 2015-06-29T20:16:26.067

3

What node renderer do you use? Preferably use sigma.renderers.linkurious. Renderers are monkey patches of the standard renderers of Sigma. To use sigma.renderers.linkurious, simply add the files of that renderer into your code as shown in https://github.com/Linkurious/linkurious.js/blob/linkurious-version/examples/renderers-linkurious.html.

labelAlignment is not a node property, but a Sigma setting to be applied on all nodes, see https://github.com/Linkurious/linkurious.js/wiki/Settings . You cannot apply it to specific nodes.

EDIT2: fixed in https://github.com/Linkurious/linkurious.js/issues/139

edited Jun 29 '15 at 20:16

answered Jun 27 '15 at 10:31

Seb

618
5
11

this means that I cannot set it for some node but not others? – ekkis Jun 27 '15 at 16:52
and how do I chose a "node renderer"? I've selected "canvas" as the renderer but how is that different? also, I've read through the documentation for `sigma.classes.configurable` but I don't see documentation on how to connect it to my graph? – ekkis Jun 27 '15 at 17:09

Linkurious attributes don't work

1 Answers1