lundi 28 novembre 2011

Do you know GraphViz support from Google Chart API ?

Google Chart API as a beta support for GraphViz that is not well known.

More or less all GraphViz options are supported. The only limitation I've seen is special fonts (only the default one is supported) and number of nodes/edges (200/400).

Google provide a web UI to generate an image map to turn your static graph into a fully linked nodes graph. In fact the algorithm is really simple. Here is an example with jQuery :


var fullUrl = 'URL_TO_BUILD_GRAPHVIZ_CHART';

// get it in Json format
$.get(fullUrl+'&chof=json', function(data) {
    // create a Map element
    var mapElement = $('<map>').attr('name','graph_map');
    var chart = data.chartshape;
    for (var i = 0; i < chart.length; i++) {
        // do nothing with edges
        if(chart[i].name.indexOf('unlabel') == -1) {
        var areaElement = $('<area>').attr('name',chart[i].name)
            .attr('shape',chart[i].type)
            .attr('coords',chart[i].coords.join(","))
            .attr('href','YOUR_LINK')
            .attr('title',chart[i].name);
            mapElement.append(areaElement);
        }
    }
    $('#google-chart').after(mapElement);
    $('#google-chart').attr('usemap','#graph_map');
}, 'json');


0 commentaires:

Enregistrer un commentaire