Skip to content Skip to sidebar Skip to footer

Highcharts Uncaught Exception

I am trying to run the same code in this jsFiddle locally but I got error from firebug uncaught exception: Highcharts error #13: www.highcharts.com/errors/13 The included script

Solution 1:

This means that Highcharts is loaded and the config is loaded, but the renderTo option is wrong, or there is no div with that id in the page. See www.highcharts.com/errors/13.

Solution 2:

The element/div you are trying to render the chart to is missing

A standard set of logs that I would use to troubleshoot highcharts error #13 are

console.log("JSON: " + JSON.stringify(chartingOptions));
        console.log("Render to element with ID : " + chartingOptions.chart.renderTo);
        console.log("Number of matching dom elements : " + $("#" + chartingOptions.chart.renderTo).length);

These should be added just before calling the Highcharts constructor

chart = new Highcharts.Chart(chartingOptions);

If all is well you should see the correct element ID, and length as 1.

Troubleshooting highcharts error # 13 | Highchart & Highstock @ jsFiddle

Here is the log that is seen for the demo above

JSON: {"chart":{"renderTo":"container"...}} Render to element with ID : container Number of matching dom elements : 1

Solution 3:

I think I know why you should add that tag after the div /div. If you are using a JSP or any other server-side stuf. You should add your Highcharts script after the declaration of the div container so it can recognize your div's id and then proceed to render it. Just like I did in the example bellow:

<head><title>HighCharts :D</title><scriptsrc="http://code.highcharts.com/highcharts.js"></script><scripttype="text/javascript"src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script></head><body><divid="container"style="width: 600px; height: 400px; margin: 0 auto"></div><scripttype="text/javascript">var myChart = Highcharts.chart('container', {
        chart: {
            type: 'bar'
        },
        title: {
            text: 'Fruit Consumption'
        },
        xAxis: {
            categories: ['Apples', 'Bananas', 'Oranges']
        },
        yAxis: {
            title: {
                text: 'Fruit eaten'
            }
        },
        series: [{
            name: 'Jane',
            data: [1, 0, 4]
        }, {
            name: 'John',
            data: [5, 7, 3]
        }]
    });


</script></body>

Post a Comment for "Highcharts Uncaught Exception"