Question

我尝试使用基于this示例的 highcharts 创建箱形图。我总是收到以下错误消息：TypeError：'undefined'不是构造函数（评估'new Highcharts.Chart'）

由于我不熟悉javascript，我找不到错误。有人可以帮助我吗？

<html>
<head>
<script src="http://github.highcharts.com/462cf4/highcharts.js"></script>
<script src="http://github.highcharts.com/462cf4/highcharts-more.js"></script>
<script>
    var chart = new Highcharts.Chart({
        chart: {
            renderTo: 'container',
            type: 'boxplot'
        },
        title: {
            text: 'Some title'
        },
        legend: {
            enabled: false
        },
        xAxis: {
            categories: ['1','2','3','4','5','6','7','8','9','10-14','15-19','20-24','25-29','30-34','35-39','40-44','45-49','50-54','55-59','60-64','65-69','70-74','75-76'],
            title: {
                text: 'position'
            }
        },
        yAxis: {
            title: {
                text: 'score'
            }
        },
        series: [{
            name: 'Observations',
            data: [
                [24,31,33,33,33],[20,30,32,33,34],[15,28,32,33,34],[11,27,32,33,34],[10,26,31,33,34],[9,25,31,33,34],[9,26,32,33,34],[8,26,32,33,34],[8,26,32,33,34],[4,24,31,33,33],[2,23,31,33,33],[2,21,30,32,33],[2,18,29,32,33],[2,15,28,32,33],[2,7,27,31,33],[2,2,25,31,32],[2,2,23,30,32],[2,2,21,28,31],[2,2,20,27,31],[2,2,17,26,30],[2,2,14,23,29],[2,2,3,22,  28],[2,2,2,21,27]
            ],
        }]
    });
</script>
</head>
<body>
<div id="container" style="height: 300px"></div>
</body>
</html>

Answer 1

你遗漏了两件事：

在加载图表库之前添加jQuery库

 <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
 <script src="http://github.highcharts.com/462cf4/highcharts.js"></script>
 <script src="http://github.highcharts.com/462cf4/highcharts-more.js"></script>

将脚本加载到文档就绪事件

中

     <script>
            $(function() {
                var chart = new Highcharts.Chart({
                    chart: {
                        renderTo: 'container',
                        type: 'boxplot'
                    },
                    title: {
                        text: 'Some title'
                    },
                    legend: {
                        enabled: false
                    },
                    xAxis: {
                        categories: ['1','2','3','4','5','6','7','8','9','10-14','15-19','20-24','25-29','30-34','35-39','40-44','45-49','50-54','55-59','60-64','65-69','70-74','75-76'],
                        title: {
                            text: 'position'
                        }
                    },
                    yAxis: {
                        title: {
                            text: 'score'
                        }
                    },
                    series: [{
                        name: 'Observations',
                        data: [
                            [24,31,33,33,33],[20,30,32,33,34],[15,28,32,33,34],[11,27,32,33,34],[10,26,31,33,34],[9,25,31,33,34],[9,26,32,33,34],[8,26,32,33,34],[8,26,32,33,34],[4,24,31,33,33],[2,23,31,33,33],[2,21,30,32,33],[2,18,29,32,33],[2,15,28,32,33],[2,7,27,31,33],[2,2,25,31,32],[2,2,23,30,32],[2,2,21,28,31],[2,2,20,27,31],[2,2,17,26,30],[2,2,14,23,29],[2,2,3,22,  28],[2,2,2,21,27]
                        ],
                    }]
                });
            })

        </script>

带有Highcharts的Box plot - TypeError：'undefined'不是构造函数

1 个答案: