highslide-software/highcharts.com — Issue #493: Highstock graph has crazy rendering (and JS errors) after a few minutes of dynamic updating
Author: kgetz
Created: 2011-10-11 18:22:27+00:00
State: open

I've implemented a CPU utilization graph using Highstock and I've noticed some really weird behavior after implementing a dynamic update mechanism. Every 10 seconds, a data point is appended to the data series and this works really great for a few minutes, but then things go south. The rendering becomes really janky, hovering over the data points no longer works, and there are hundreds of JS errors (well, really just two errors repeated over and over).

Error #1:
Error: point is undefined

This corresponds to this block of code:

i = points.length;
while (i--) {
point = points[i];
normalOptions = (point.options && point.options.marker) || point.options;
if (normalOptions && normalOptions.enabled === false) {
normalOptions.radius = 0;
}
hasPointSpecificOptions = false;

// check if the point has specific visual options
if (point.options) {
for (key in pointAttrToOptions) {
if (defined(normalOptions[pointAttrToOptions[key]])) {
hasPointSpecificOptions = true;
}
}
}

Specifically, this line:

normalOptions = (point.options && point.options.marker) || point.options;

Error #2:
Error: dateTimeLabelFormats[n] is undefined

This corresponds to this block of code:

// if not grouped, and we don't have set the xDateFormat option, get the best fit,
// so if the least distance between points is one minute, show it, but if the
// least distance is one day, skip hours and minutes etc.
} else if (!xDateFormat) {
for (n in timeUnits) {
if (timeUnits[n] >= xAxis.leastUnitDistance) {
xDateFormat = dateTimeLabelFormats[n][0];
break;
}
}
}

Specifically, this line:

xDateFormat = dateTimeLabelFormats[n][0];

I have a screenshot of the weirdness in action, but I'm not sure how to get it on this forum. Ideas?