CODEWITHSUNDEEP
highcharts
earachefl
earachefl

Reputation: 1890

Changing data in HighCharts series causes y-axis to blow up

I'm seeing some odd behavior in a Highcharts line chart. I have multiple series displayed, and need to let the user change what's called the "Map level" on the chart, which is a straight line across all time periods. Assuming that the correct series is 

chart.series[i]

and that the new level that I want it set to is stored in var newMapLevel, I'm changing that series' data like so:

data = chart.series[i].data;
for(j=0; j<data.length; j++){
    data[j].y = newMapLevel;                    
}
chart.series[i].setData(data);

Calling this function has the desired effect UNLESS the new map level y_value is ONE greater than the highest y_value of all other series, in which case the y-axis scale blows up. In other words, if the y_axis scale is normally from 0 to 275,000, and the highest y_value of any of the other series is, say, 224,000, setting the new map level value to 224,001 causes the y_axis scale to become 0 to 27500M. Yes, that's 27.5 billion.

Might this be a bug in Highcharts? Or is there a better way to change the data in a series?

I've posted a fiddle: http://jsfiddle.net/earachefl/4FuNE/4/

Upvotes: 4

Views: 7251

Answers (2)

earachefl
earachefl

Reputation: 1890

I got my answer from the Highcharts forum:

http://highslide.com/forum/viewtopic.php?f=9&t=13594&p=59888#p59888

Upvotes: 2

mg1075
mg1075

Reputation: 18155

This doesn't work as smoothly as I'd like. When you go from 8 as your line to 2 as your line, the scale doesn't adjust back down until you enter another value. Perhaps it's a start in the right direction.

$(document).ready(function(){
$('#clickme').click(function(){      
    var newMapLevel = $('#newMAP').val();
    if(newMapLevel){
        for(i=0; i<chart.series.length; i++){
            if(chart.series[i].name == 'Map Level'){
                data = chart.series[i].data;
                for(j=0; j<data.length; j++){
                    data[j].y = newMapLevel;                    
                }

               // get the extremes
                var extremes = chart.yAxis[0].getExtremes(); 
                //alert("dataMin: " + extremes.dataMin);
                //alert("dataMax: " + extremes.dataMax);

                // define a max YAxis value to use when setting the extremes
                var myYMax = extremes.dataMax; 
                if (newMapLevel >= myYMax) {
                    myYMax = Number(newMapLevel) + 1; // number conversion required
                }

                if (myYMax > chart.yAxis[0].max) {
                    alert('cabbbie'); 
                    myYMax = chart.yAxis[0].max + 1; 
                }

                //alert("myYMax: " + myYMax);

                chart.yAxis[0].setExtremes(extremes.dataMin, myYMax)     

                 // finally, set the line data
                chart.series[i].setData(data);                     
            }
        }
    }
}); });

Upvotes: 0

Related Questions