score:48

Accepted answer

I was having this issue, too. Ensure jQuery is imported before highchart.js. That fixed the issue for me.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="http://code.highcharts.com/highcharts.js"></script>

score:1

The approach taken from the official examples is working well. They defined the include script tag within the body tag therefore the solution given by Kabulan0lak is better I think.

<html>
<head>
    <title>Highcharts Example</title>

    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
    <script type="text/javascript">
        $(function () {
            $('#container').highcharts({
                chart: {
                    type: 'spline'
                }
                // ... other options and data/series
            });
        });
    </script>
</head>

<body>
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
</body>
</html>

score:1

It happens with me too. In my case, I need click in a button to load the chart and if I click twice or more the chart stops to work. I was setting the color like this: 

Highcharts.setOptions({
        colors: Highcharts.map(Highcharts.getOptions().colors, function (color) {
            return {
                radialGradient: {
                    cx: 0.5,
                    cy: 0.3,
                    r: 0.7
                },
                stops: [
                    [0, color],
                    [1, Highcharts.Color(color).brighten(-0.3).get('rgb')] // darken
                ]
            };
        })
    });

$.getJSON("./myDataGraph.php", function(response){
        // Create the chart
        var chart = Highcharts.chart('myGraph', {
            chart: {
                plotBackgroundColor: null,
                plotBorderWidth: null,
                plotShadow: false,
                type: 'pie'
            },
... });

I couldn't solve the error, but I remove the "Highcharts.setOptions" and the chart works!!!

score:2

I was using an old version of the high charts version. From their website I assumed that the version listed under Specific version was their latest version and used that so it wouldn't auto update on me. However the version they had listed was super old so changing it to the actual latest version fixed the issue.

score:38

What happens if you replace

$('#container').highcharts({
        colors: ["#7cb5ec", "#f7a35c"],
        chart: {
            type: 'column'
        },
        /* ... */

by 

var chart = new Highcharts.Chart({
                colors: ["#7cb5ec", "#f7a35c"],
                chart: {
                    type: 'column',
                    renderTo: 'container'
                },
                /* ... */

?

I had the same issue as you a while ago and I resolved it by using this type of initialization.


Related Query

More Query from same tag