0
votes

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: []
    };
2

2 Answers

0
votes

Your data should be sorted by x, ascending.

0
votes

It appears this was actually caused by dataGrouping.dateTimeLabelFormats not being defined. Not sure why, but apparently the default wasn't being defined so I just pasted the default values from the api reference and it's working now.