vino-plot.js

function loadAndPlot(url, callback) {
    $('#loading').show();
    $.ajax({ url: url,
        type: "GET",
        processData: false,
        contentType: false,
        dataType:"json",
        success: callback,
        complete: function(){
          $('#loading').hide();
        }
    })
    return false;
}
function bargridRectangle(x, y, xstep, ystep, colorline, fillcolor){
    var rectangle = {'type': 'rect', 'x0': x[0] - xstep, 'y0': y[0] - ystep, 'x1': x[1] + xstep, 'y1': y[1] + ystep, 'line': {'color': colorline, 'width': 1}, 'fillcolor': fillcolor};
    return rectangle;
}

function bargridPlot(data, container, colormarker, colorline, fillcolor) {
    var items = {x:[], y:[], mode:'markers', type: 'scatter', marker: { size : 2, color: colormarker }, hoverinfo:'none' };
    var trace = [];
    var tracebis = [];
    var x = [];
    var y = [];
    var map = [];
    var mapinit = [x, y];
    var mapitems = [];
    var mapinititems = [items.x, items.y];
    var xstep, ystep;
    var xbounds = [];
    var ybounds = [];
    $.each(data, function(index, bar) {
        if (index == 0){ // first row gives metadata: bounds, …
            xstep = bar[4] / 2;
            ystep = bar[5] / 2;
            xbounds.push(bar[0]);
            xbounds.push(bar[2]);
            ybounds.push(bar[1]);
            ybounds.push(bar[3]);
            map.push(mapinit[bar[6]]);
            map.push(mapinit[bar[7]]);
            mapitems.push(mapinititems[bar[6]]);
            mapitems.push(mapinititems[bar[7]]);
            x.push(0);
            x.push(1);
            y.push(0);
            y.push(1);
        } else {
            map[0][0] = bar[0];
            map[0][1] = bar[0];
            map[1][0] = bar[1];
            map[1][1] = bar[2];
            mapitems[0].push(bar[0]);
            mapitems[0].push(bar[0]);
            mapitems[1].push(bar[1]);
            mapitems[1].push(bar[2]);
            tracebis.push(bargridRectangle(x, y, xstep, ystep, colorline, fillcolor));
        }
    });
    var layout = {showlegend: false, margin:{t:10}, width: 600, height: 500,
      shapes : tracebis, xaxis:{title : 'X',range : xbounds},
      yaxis:{title : 'Y',range : ybounds}};
    trace = [items];
    Plotly.newPlot(container, trace, layout);
}
function bargridPlot3D(data, x, container, colormarker, colorline, fillcolor){
    var items = {x:[], y:[], z:[], mode:'markers', type: 'scatter3d', marker: { size : 1, color: [] }, hoverinfo:'none' };
    var trace = [];
    var tracebis = [];