Question

我在这里关注了高级图表入门教程：http://www.highcharts.com/docs/getting-started/your-first-chart

由于某种原因，代码在单独的HTML文件中工作，但在我的Yeoman构建的Web应用程序中不能使用

我陷入了第一道障碍并得到以下错误： TypeError：$（...）。highcharts不是函数

我的代码如下，这是完整的错误：

TypeError：$（...）。highcharts不是函数在HTMLDocument.eval（eval at（http://localhost:9000/bower_components/jquery/dist/jquery.js:328:5），：2：21）在火上（http://localhost:9000/bower_components/jquery/dist/jquery.js:3099:30） at Object.self.add [as done]（http://localhost:9000/bower_components/jquery/dist/jquery.js:3145:7）在jQuery.fn.ready（http://localhost:9000/bower_components/jquery/dist/jquery.js:3378:25）在jQuery.fn.init（http://localhost:9000/bower_components/jquery/dist/jquery.js:2821:16）在jQuery（http://localhost:9000/bower_components/jquery/dist/jquery.js:76:10）在eval（eval at（http://localhost:9000/bower_components/jquery/dist/jquery.js:328:5），：1：1）在eval（原生）在Function.jQuery.extend.globalEval（http://localhost:9000/bower_components/jquery/dist/jquery.js:328:5）在jQuery.fn.extend.domManip（http://localhost:9000/bower_components/jquery/dist/jquery.js:5435:16）

关于此还有很多其他帖子 - 但是没有一个解决方案对我有用，无法看到我在这里做错了，我所做的就是复制教程。

这是我的HTML文件：

<!DOCTYPE html>
<html>
<head>
  <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>
  <script>$(function () { 
    $('#container').highcharts({
        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>
</head>

<body>
<div id="container" style="width:100%; height:400px;"></div>
</body>

</html>

Answer 1

<!DOCTYPE html>
<html>
<head>
  <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>
  <script>$(function () { 
    $('#container').highcharts({
        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>
</head>

<body>
<div id="container" style="width:100%; height:400px;"></div>
</body>

</html>

工作正常。刚从关闭html标记中删除了双重括号。

TypeError：$（...）。highcharts不是函数 - 现有解决方案无效 - Yeoman生成器出现问题

1 个答案: