subhrajitroy / Flot-plugin

This plugin allows users to define constraints on data ,so that values that satify a given constraint will appear in the graph in different colors.
13 stars 9 forks source link

Data set breaks threshold line coloring #4

Open brandoneggar opened 13 years ago

brandoneggar commented 13 years ago

Nice plugin. I found a data set that breaks the threshold coloring for me.

Here is working test code that will reproduce the problem.

$(document).ready(function() { var d1 = []; for (var i = 0; i < 100; ++i) d1.push([i, i]);

var d2 = []; 
var strdata = "50,53,55,58,59,63,65,62,68,73,79,77,75,80,87,76,85,86,91," +
              "95,90,95,94,82,80,70,64,51,55,51,45,53,54,53,62,63,63,68," + 
              "86,87,82,83,78,72,60,78,81,91,90,93,94,87,100,100,94,95," + 
              "99,100,100,100,98,97,100";
var data = strdata.split(",");
for (var i = 0; i < data.length-1; ++i)
    d2.push([i, data[i]]);

var custom_constraints = [
    {
        threshold: 85,
        color: "#0F0",
        evaluate: function(y, threshold) { return y < threshold; }
    },
    {
        threshold: 65,
        color: "#00F",
        evaluate: function(y, threshold) { return y < threshold; }
    },
    {
        threshold: 40,
        color: "#FF0",
        evaluate: function(y, threshold) { return y < threshold; }
    }
];

plot = $.plot($("#graph1"), 
[
    { 
        data: d1,
        color: "#F00",
        constraints: custom_constraints
    }
]);

plot = $.plot($("#graph2"), 
[
    { 
        data: d2,
        color: "#F00",
        constraints: custom_constraints
    }
]);    

});

brandoneggar commented 13 years ago

You can see the following graph should have different colors at thresholds: 85, 65 and 40.

Uploaded with ImageShack.us