Graph Layout

Plugin to add Cytoscape layouts

Tutorial

Web Plugin

Register resources for the plugin and message bundle.

app.registerJavaScript("/org/visallo/examples/graph_layout/plugin.js", true);
app.registerResourceBundle("/org/visallo/examples/graph_layout/messages.properties");

Register Extension

Register the layout extension.

visallo.registry.registerExtension('org.visallo.graph.layout', MyLayout);

Create the Layout Class

The layout class is initialized with options for the layout. These options include the cy instance and the elements (eles) to layout. These should be filtered to real vertices .filter('.v') so we are not moving decorations.

MyLayout.identifier = 'example-random';
function MyLayout(options) {
    this.options = options;
}

MyLayout.prototype.run = function() {
    var cy = this.options.cy;

    // Use `eles` option allows layout
    // to work if running on all or selection
    // of nodes
    var nodes = this.options.eles || cy.nodes();

    var width = $(window).width();
    var height = $(window).height();

    nodes.filter('.v').each(function(i, node) {
        node.renderedPosition(retina.pointsToPixels({
            x: Math.round(Math.random() * width),
            y: Math.round(Math.random() * height)
        }));
    })

    // Must call ready and stop callbacks
    cy.one("layoutready", this.options.ready);
    cy.trigger("layoutready");

    cy.one("layoutstop", this.options.stop);
    cy.trigger("layoutstop");

    return this;
};

The positions are generated using a random number using the current window width. The use of retina.pointsToPixels allows transformation from virtual points to actual screen pixels in the case of a hidpi display.

node.renderedPosition(retina.pointsToPixels({
    x: Math.round(Math.random() * width),
    y: Math.round(Math.random() * height)
}));

Message Bundle

Add a i18n value in a MessageBundle.properties. This will be displayed in the graph context menu.

graph.layout.example-random.displayName=Random (Example)

results matching ""

    No results matching ""