I suspect this has to do with grouping, here's the chart options object. The plotlines and series are added asynch. My flag series have the text parameter. Any idea what I might be missing, or is this really an artifact of dataGrouping?
update: I noticed today that I'm getting "Uncaught TypeError: Cannot read property 'week' of undefined" when I hover over the flag
chartOptions = {
chart: {
renderTo: 'chart',
backgroundColor:'rgba(255, 255, 255, 0.1)',
borderWidth: 0,
borderColor: "#FFFFFF",
defaultSeriesType: 'spline',
zoomType: 'x'
},
colors: [
'#666666',
'#AA4643',
'#4572A7'
],
rangeSelector: {
buttonSpacing: 5,
buttonTheme: {
style: {
padding: "0 3px"
},
width: null
},
selected: 2,
buttons: [
{
type: 'day',
count: 1,
text: 'Day'
},
{
type: 'month',
count: 1,
text: 'Month'
},
{
type: 'year',
count: 1,
text: 'Year'
},
{
type: 'all',
text: 'All'
}
]
},
xAxis: {
type: 'datetime',
dateTimeLabelFormats: {
day: '%e %b \'%y',
month: '%b \'%y',
year: '%b \'%y'
},
plotLines: []
},
yAxis: {
maxPadding: .05,
minPadding: .05,
title: {
text: 'Demand (kW)'
}
},
navigator: {
enabled: true
},
legend: {
enabled: true,
layout: 'horizontal',
align: 'center',
verticalAlign: 'top',
floating: true,
borderWidth: 0,
y: -5
},
plotOptions: {
series: {
dataGrouping: {
approximation: "average",
groupPixelWidth: 30,
smoothed: true,
unit: [
['minute', [1]],
['hour', [1]],
['day',[1]],
['week',[1]],
['month',[1]],
['year',null]
]
},
events: {
legendItemClick: function(event) {
return !(this.name == 'Baseline');
}
},
connectNulls: false,
marker: {
enabled: false,
states: {
hover: {
enabled: false
}
}
}
},
flags: {
showInLegend: false,
style: {
borderColor: '#cc0000',
color: '#cc0000'
}
}
},
series: []
};