CODEWITHSUNDEEP
javascriptgraphflot
Arun_SE
Arun_SE

Reputation: 230

javascript flot threshold for dynamic data value

Here is my plot data

var data = [{
                data: [[4, 80], [8, 50], [9, 130]],
                color: "rgb(30, 180, 20)",
                threshold: {
                    below: 100,
                    color: "rgb(200, 20, 30)"
                }
            }]
        var bar = $.plot("#placeholder", data);

and if i change the value of data in a button click like 

     data= [[4, 130], [8, 50], [9, 130]];
     bar.setData([data]);
              bar.draw();

              });

The treshold value didnt work , if there is a way to acheive this.

Upvotes: 1

Views: 429

Answers (2)

Mark
Mark

Reputation: 108537

You aren't updating the data correctly. You are initially giving flot a series object with threshold settings, when you setData though, you are giving it an array without those settings.

Do this instead to preserve your series options:

someData = somePlot.getData();
someData[0].data = [[4, 130], [8, 50], [9, 130]];
somePlot.setData(someData);
somePlot.draw();

Here's an example.

EDITS

If you don't like the getData call, leave your master data variable in scope and update that as @Raidri hinted at:

var masterData = [{
            data: [[4, 80], [8, 50], [9, 130]],
            color: "rgb(30, 180, 20)",
            threshold: {
                below: 100,
                color: "rgb(200, 20, 30)"
            }
        }]

 // later ...

 masterData[0].data = [[4, 130], [8, 50], [9, 130]];
 somePlot.setData(masterData);
 somePlot.draw();

The important part is to leave your threshold series options intact in the setData call.

Upvotes: 1

Raidri
Raidri

Reputation: 17550

Have you tried calling bar.setupGrid() before the bar.draw()?

If that doesn't help, you make a complete new plot:

data[0].data = [[4, 130], [8, 50], [9, 130]];
bar = $.plot("#placeholder", data)

Upvotes: 0

Related Questions