asv/www/asv.js
/* Once we have all of the graphs loaded, send them to flot for
       drawing. */
Once we have all of the graphs loaded, send them to flot for
drawing.
Once we have all of the graphs loaded send them to flot for drawing .
function update_graphs() {
        if (current_benchmark == null) {
            return;
        }
        var markings = [];
        $.each(master_json.tags, function(tag, date) {
            markings.push(
                { color: "#ddd", lineWidth: 1, xaxis: { from: date, to: date } }
            );
        });
        var unit;
        if (reference_scale) {
            unit = 'relative';
        } else {
            unit = master_json.benchmarks[current_benchmark].unit;
        }
        var options = {
            colors: colors,
            series: {
                lines: {
                    show: true,
                    lineWidth: 1
                },
                points: {
                    show: true
                },
                shadowSize: 0
            },
            grid: {
                hoverable: true,
                clickable: true,
                markings: markings
            },
            xaxis: {
                tickLength: 5,
                axisLabel: "",
                axisLabelUseCanvas: true,
                axisLabelFontFamily: "sans-serif",
                axisLabelFontSizePixels: 12
            },
            yaxis: {
                axisLabel: "",
                axisLabelUseCanvas: true,
                axisLabelFontFamily: "sans-serif",
                axisLabelFontSizePixels: 12
            },
            selection: {
                mode: "x"
            },
            legend: {
                position: "nw"
            }
        };
        handle_y_scale(options);
        handle_x_scale(options);
        var graph_div = $('#main-graph');
        var overview_div = $('#overview');
        var plot = $.plot(graph_div, graphs, options);
        var overview = $.plot(overview_div, graphs, {
            colors: colors,
            series: {
                lines: {
                    show: true,
                    lineWidth: 1
                },
                shadowSize: 0
            },
            xaxis: {
                ticks: [],
                mode: "time"
            },
            yaxis: {
                ticks: [],
                min: 0,
                autoscaleMargin: 0.1
            },
            selection: {
                mode: "x"
            },
            legend: {
                show: false
            }
        });
        graph_div.unbind("plotselected");
        graph_div.bind("plotselected", function (event, ranges) {
            plot = $.plot(graph_div, graphs, $.extend(true, {}, options, {
                xaxis: {
                    min: ranges.xaxis.from,
                    max: ranges.xaxis.to
                }
            }));
            update_tags();
            update_range();
            overview.setSelection(ranges, true);
        });
        overview_div.unbind("plotselected");
        overview_div.bind("plotselected", function (event, ranges) {
            plot.setSelection(ranges);
            update_tags();
            update_range();
        });
        function update_range() {
            var min = Infinity;
            var left = plot.getAxes().xaxis.min;
            $.each(graphs, function(i, graph) {
                var data = graph.data;
                for (var j = 0; j < data.length; ++j) {
                    var p = data[j][0];
                    if (p !== null && p >= left) {
                        if (p < min) {
                            min = p;
                        }
                        break;
                    }
                }
            });
            var max = -Infinity;
            var right = plot.getAxes().xaxis.max;
            $.each(graphs, function(i, graph) {
                var data = graph.data;
                for (var j = data.length - 1; j >= 0; --j) {
                    var p = data[j][0];
                    if (p !== null && p <= right) {
                        if (p > max) {
                            max = p;
                        }
                        break;
                    }
                }
            });
            var result;
            if (min === null || max === null || min > max) {
                result = '';
            } else if (min == max) {
                result = master_json.date_to_hash[min] + '^!';
            } else {
                var first_commit = master_json.date_to_hash[min];
                var last_commit = master_json.date_to_hash[max];
                result = first_commit + ".." + last_commit;
            }
            $("#range")[0].value = result;
        }
        function update_tags() {
            var canvas = plot.getCanvas();
            var xmin = plot.getAxes().xaxis.min;
            var xmax = plot.getAxes().xaxis.max;
            $.each(master_json.tags, function(tag, date) {
                if (date >= xmin && date <= xmax) {
                    var p = plot.pointOffset({x: date, y: 0});
                    var o = plot.getPlotOffset();
                    graph_div.append(
                        "<div style='position:absolute;" +
                            "left:" + p.left + "px;" +
                            "bottom:" + (canvas.height - o.top) + "px;" +
                            "color:#666;font-size:smaller'>" + tag + "</div>");
                }
            });
        }
        update_tags();
        update_range();
    }
function update_graphs ( ) { if ( current_benchmark == null ) { return ; } var markings = [ ] ; $ . each ( master_json . tags , function ( tag , date ) { markings . push ( { color : "#ddd" , lineWidth : 1 , xaxis : { from : date , to : date } } ) ; } ) ; var unit ; if ( reference_scale ) { unit = 'relative' ; } else { unit = master_json . benchmarks [ current_benchmark ] . unit ; } var options = { colors : colors , series : { lines : { show : true , lineWidth : 1 } , points : { show : true } , shadowSize : 0 } , grid : { hoverable : true , clickable : true , markings : markings } , xaxis : { tickLength : 5 , axisLabel : "" , axisLabelUseCanvas : true , axisLabelFontFamily : "sans-serif" , axisLabelFontSizePixels : 12 } , yaxis : { axisLabel : "" , axisLabelUseCanvas : true , axisLabelFontFamily : "sans-serif" , axisLabelFontSizePixels : 12 } , selection : { mode : "x" } , legend : { position : "nw" } } ; handle_y_scale ( options ) ; handle_x_scale ( options ) ; var graph_div = $ ( '#main-graph' ) ; var overview_div = $ ( '#overview' ) ; var plot = $ . plot ( graph_div , graphs , options ) ; var overview = $ . plot ( overview_div , graphs , { colors : colors , series : { lines : { show : true , lineWidth : 1 } , shadowSize : 0 } , xaxis : { ticks : [ ] , mode : "time" } , yaxis : { ticks : [ ] , min : 0 , autoscaleMargin : 0.1 } , selection : { mode : "x" } , legend : { show : false } } ) ; graph_div . unbind ( "plotselected" ) ; graph_div . bind ( "plotselected" , function ( event , ranges ) { plot = $ . plot ( graph_div , graphs , $ . extend ( true , { } , options , { xaxis : { min : ranges . xaxis . from , max : ranges . xaxis . to } } ) ) ; update_tags ( ) ; update_range ( ) ; overview . setSelection ( ranges , true ) ; } ) ; overview_div . unbind ( "plotselected" ) ; overview_div . bind ( "plotselected" , function ( event , ranges ) { plot . setSelection ( ranges ) ; update_tags ( ) ; update_range ( ) ; } ) ; function update_range ( ) { var min = Infinity ; var left = plot . getAxes ( ) . xaxis . min ; $ . each ( graphs , function ( i , graph ) { var data = graph . data ; for ( var j = 0 ; j < data . length ; ++ j ) { var p = data [ j ] [ 0 ] ; if ( p !== null && p >= left ) { if ( p < min ) { min = p ; } break ; } } } ) ; var max = - Infinity ; var right = plot . getAxes ( ) . xaxis . max ; $ . each ( graphs , function ( i , graph ) { var data = graph . data ; for ( var j = data . length - 1 ; j >= 0 ; -- j ) { var p = data [ j ] [ 0 ] ; if ( p !== null && p <= right ) { if ( p > max ) { max = p ; } break ; } } } ) ; var result ; if ( min === null || max === null || min > max ) { result = '' ; } else if ( min == max ) { result = master_json . date_to_hash [ min ] + '^!' ; } else { var first_commit = master_json . date_to_hash [ min ] ; var last_commit = master_json . date_to_hash [ max ] ; result = first_commit + ".." + last_commit ; } $ ( "#range" ) [ 0 ] . value = result ; } function update_tags ( ) { var canvas = plot . getCanvas ( ) ; var xmin = plot . getAxes ( ) . xaxis . min ; var xmax = plot . getAxes ( ) . xaxis . max ; $ . each ( master_json . tags , function ( tag , date ) { if ( date >= xmin && date <= xmax ) { var p = plot . pointOffset ( { x : date , y : 0 } ) ; var o = plot . getPlotOffset ( ) ; graph_div . append ( "<div style='position:absolute;" + "left:" + p . left + "px;" + "bottom:" + ( canvas . height - o . top ) + "px;" + "color:#666;font-size:smaller'>" + tag + "</div>" ) ; } } ) ; } update_tags ( ) ; update_range ( ) ; }
Once we have all of the graphs loaded, send them to flot for
drawing.
Once we have all of the graphs loaded send them to flot for drawing .
/* Set up the "overview" plot */ // do the zooming // Update things that depend on the range // don't fire event on the overview to prevent eternal loop // Update things that depend on the range /* Find the minimum and maximum values */ /* Add the tags as vertical grid lines */