Issue with speedometer highcharts dynamically update guage range

I have a use case where I need to modify the Guage range dynamically, but when I do this my highcharts graph behaves weirdly and the range goes out of bounds. Please look at the image below

This happens only after the 7th iteration (value is 0.007). You can find my code on jsfiddle at http://jsfiddle.net/S6LtL/

My Highcharts Speedometer Code (jsfiddle)

Can someone help me how to resolve this issue?

Answers


On each iteration, you are adding a new plotBand, but not removing the old ones:

chart.yAxis[0].removePlotBand('red');
chart.yAxis[0].removePlotBand('green');                
chart.yAxis[0].addPlotBand({
    id: 'red',
    from: newVal - 0.005,
    to: newVal - 0.001,
    color: '#DF5353' // red
});
chart.yAxis[0].addPlotBand({
    id: 'green',
    from: newVal - 0.001,
    to: newVal + 0.005,
    color: '#55BF3B' //green
});

Updated fiddle.


Need Your Help

How to groupby Datatable by a column and sum numeric columns

c# entity-framework linq datatable

I am trying to groupby a datatable by a column and sum a numeric field, but I couldnt be able to do the sum. Here is my code that groupby the datatable.

Submit form sending through user1_id and newmsg without page refresh

php javascript ajax forms

How would I go about submitting the below form without a page refresh using Ajax? I'm needing to send the user1_id via 'toid' and the content from the textarea 'newmsg'.