Which differences in javascript object creation syntax have I not understood? IE8 vs Chrome

Question

I am working with Highcharts, to display data graphically. I've chosen this library specifically because of its compatibility with both IE8 and a newer version of Google Chrome, as it renders the charts in VML or SVG, depending on supportability.

HighCharts can be created by defining a properties-object, which is passed as a parameter. This is working like a charm in Chrome, but I'm having trouble in IE8 (is there an echo in here?)

I suspect that the error is different syntax support for the two browsers, when defining an object in javascript. The two questions below are the closest thing I have come to finding any info, but they didn't address my actual problem.

What are the most likely causes of Javascript errors in IE8?

IE8 errors when defining a Javascript object?

My code for defining the properties object is stated below. My error is always in the first line of this snippet. However, I cannot find any errors in that line, so I think it has to be somewhere else, and only refer to it's "root". entry is an object with a few parameters, to populate the chart with titles and similar:

    var chartOptions = {
        chart: {
            renderTo: "piecontainer"+index,
            plotBackgroundColor: null,
            plotBorderWidth: 0,
            plotShadow: false
        },
        title: {
            text: entry.title + '<br/><br/>' + entry.path + '<br/><br/>Total: ' + Object.keys(entry.testMap).length,
            align: 'center',
            verticalAlign: 'middle',
            y: 50
        },
        tooltip: {
            pointFormat: '{series.name}: <b> {point.y} ({point.percentage:.1f}%)</b>'
        },     

        legend: {
            width: 415,
            enabled: true,
            useHTML: true,
            labelFormatter: function() {
                return '<span>' + this.name + ': ' + this.y + '<t/></span>';
            }, 
            itemDistance: 20
        },

        credits: {
            enabled: false
        },

        plotOptions: {
            pie: {
                size: '100%',
                animation: false,
                 dataLabels: {
                        enabled: false                              
                    },
                    showInLegend: true,
                startAngle: -90,
                endAngle: 90,
                center: ['50%', '75%']
            }
        },
        series: [{
            type: 'pie',
            name: 'Test Cases',
            innerSize: '50%',
            data: [
                ['Passed',  1],
                ['Not Completed', 1],
                ['Failed', 1],
                ['No Run', 1],
                ['N/A', 1], 
                ['Blocked', 1],
                ['Incorrect Database Value', 1]
            ]
        }]
    };

EDIT: As I can tell by this post: Strange behavior Highcharts pie chart in document mode IE8, the main structure of my object notation is correct. There has to be a single line or two in the middle, that are causing the problems.

Just eyeing this, IE8 isn't ES5 compliant, so Object.keys() isn't available (unless you're pulling in the es5-shim.js) — David Atchley
– David Atchley, Commented Jun 20, 2014 at 11:29

shennan · Accepted Answer · 2014-06-20 11:31:13Z

2

Object.keys is not supported in IE8. It is an ES5 specification, which is only supported from IE9 and above. You'll need a different way of getting at that information.

See here...

answered Jun 20, 2014 at 11:31

shennan

11.8k5 gold badges52 silver badges94 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

jumps4fun Over a year ago

Ah! Thank you very much. I suppose I might be able to extract line by line and check supportability, but I am very grateful for this help. Way faster for me. I will find another way to get the data. Guaranteed ;)

jumps4fun Over a year ago

I'll acccept the answer in five minutes.

shennan Over a year ago

@KjetilNordin Have a look at this answer for more on how to get an object's length.

jumps4fun Over a year ago

This is the reason I love SO :)

jumps4fun Over a year ago

Score. It works. And in my opinion, the code is now also easier to read. Thanks a lot.

Collectives™ on Stack Overflow

Which differences in javascript object creation syntax have I not understood? IE8 vs Chrome

1 Answer 1

5 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related