Highcharts IE8 - Error on page

Question

Highcharts JS Version: 3.0.3 Broswer: Internet Explorer 8 Reference URL: http://jsfiddle.net/aDCXR/1/show/

Problem: When the cursor touches any of the bar graph charts (and I assume all charts) and then back on to the html page. (Mouseout/off of the Highcharts), I get the following error only in IE 8.

Message: Object doesn't support this property or method Line: 4 Char: 8558 Code: 0 URI: https://ajax.googleapis.com/ajax/libs/j ... ery.min.js

From what I have read online this is a bug inside the Highcharts JS library.

Does anyone know of a fix so the IE8 will not produce this error?

The code below is only for stackoverflow requirements.

$(function () {
    var chart;
    $(document).ready(function() {
        chart = new Highcharts.Chart({
            chart: {
                renderTo: 'container'
            },
            title: {
                text: 'Combination chart'
            },
            xAxis: {
                categories: ['Apples', 'Oranges', 'Pears', 'Bananas', 'Plums']
            },
            tooltip: {
                formatter: function() {
                    var s;
                    if (this.point.name) { // the pie chart
                        s = ''+
                            this.point.name +': '+ this.y +' fruits';
                    } else {
                        s = ''+
                            this.x  +': '+ this.y;
                    }
                    return s;
                }
            },
            labels: {
                items: [{
                    html: 'Total fruit consumption',
                    style: {
                        left: '40px',
                        top: '8px',
                        color: 'black'
                    }
                }]
            },
            series: [{
                type: 'column',
                name: 'Jane',
                data: [3, 2, 1, 3, 4]
            }, {
                type: 'column',
                name: 'John',
                data: [2, 3, 5, 7, 6]
            }, {
                type: 'column',
                name: 'Joe',
                data: [4, 3, 3, 9, 0]
            }, {
                type: 'spline',
                name: 'Average',
                data: [3, 2.67, 3, 6.33, 3.33],
                marker: {
                    lineWidth: 2,
                    lineColor: Highcharts.getOptions().colors[3],
                    fillColor: 'white',
                    symbol: 'url(http://highcharts.com/demo/gfx/sun.png)'
                }
            }, {
                type: 'pie',
                name: 'Total consumption',
                data: [{
                    name: 'Jane',
                    y: 13,
                    color: '#4572A7' // Jane's color
                }, {
                    name: 'John',
                    y: 23,
                    color: '#AA4643' // John's color
                }, {
                    name: 'Joe',
                    y: 19,
                    color: '#89A54E' // Joe's color
                }],
                center: [100, 80],
                size: 100,
                showInLegend: false,
                dataLabels: {
                    enabled: false
                }
            }]
        });
    });

});

Duniyadnd · Accepted Answer

The error is not related to highcharts, but with jquery. You'll need to update the version you're using (sample you have provided was 1.7.2), the latest version of jquery is 1.9.1 and that should take care of it.

Highcharts IE8 - Error on page

Answers (2)

Related Questions