javascript - google chart a.S 不是函数

Question

我有以下指令:

angular.module('Division').directive('divisionChart', function () {
    return {
        restrict: 'E',
        templateUrl: 'js/helpers/Division/directives/division-chart/division-chart.html',
        scope: {},
        link: function (scope, element, attr) {
            var data = {
                "cols": [
                    {"label": "Name", "pattern": "", "type": "string"},
                    {"label": "Manager", "pattern": "", "type": "string"},
                    {"label": "ToolTip", "pattern": "", "type": "string"}
                ],
                "rows": [
                    {
                        "c": [
                            {"v": "1", "f": "Mike O."},
                            {"v": ""},
                            {"v": "The President"}
                        ]
                    },
                    {
                        "c": [
                            {"v": "2", "f": "Jim"},
                            {"v": "1"},
                            {"v": "VP"}
                        ]
                    },
                    {
                        "c": [
                            {"v": "3", "f": "Alice"},
                            {"v": "1"},
                            {"v": ""}
                        ]
                    },
                    {
                        "c": [
                            {"v": "4", "f": "Bob"},
                            {"v": "2"},
                            {"v": "Bob Sponge"}
                        ]
                    },
                    {
                        "c": [
                            {"v": "Carol"},
                            {"v": "4"},
                            {"v": ""}
                        ]
                    }
                ]
            };


            // Instantiate and draw our chart, passing in some options.
            var chart = new google.visualization.OrgChart(element[0]);
            chart.draw(data);
        }
    }
});

具有以下 HTML:

<div></div>

当我尝试运行它时，出现以下错误:

TypeError: a.S is not a function

我已确保将 googlechart 包含在我的索引中:

 <script src="http://www.google.com/jsapi?ext.js"></script>
<script>google.load('visualization', '1', {packages: ['orgchart']});</script>

所以谁能告诉我我做错了什么？

Answer 1

首先，推荐使用google charts library的current loader...

<script src="https://www.gstatic.com/charts/loader.js"></script>

根据release notes ...

The version of Google Charts that remains available via the jsapi loader is no longer being updated consistently. Please use the new gstatic loader (loader.js) from now on.

唯一改变的是 load声明，如下......

google.charts.load('current', {
  callback: drawChart,
  packages: ['corechart']
});

注意 callback ，与 jsapi 一样装载机，load语句有一个 callback
在触发回调之前，您不应该从以下命名空间创建

google.charts
google.visualization