2

想知道是否有人让 RequireJS、AAngularJS 和 Google Visualization API 一起工作。我似乎无法让图表正常运行。我遇到的主要问题是 google.setOnLoadCallback() 没有运行。下面是我的代码。如果有另一个更易于与 RequireJS 一起使用的图表库,我不会完全依赖 Google Visualization API。

define([ 'jquery'],function ( $) {
return function () {
    return {
        restrict: 'A',

        link: function (scope, lElement, attrs) {

            console.log("loaded google jsapi");

              console.log("google");

            google.load("visualization", "1", {packages:["corechart"]});


            google.setOnLoadCallback(drawChart);
            function drawChart() {
                console.log("we are in the call back");
                var data = google.visualization.arrayToDataTable([
                    ['Year', 'Sales', 'Expenses'],
                    ['2004',  1000,      400],
                    ['2005',  1170,      460],
                    ['2006',  660,       1120],
                    ['2007',  1030,      540]
                ]);

                var options = {
                    title: 'Company Performance',
                    vAxis: {title: 'Year',  titleTextStyle: {color: 'red'}}
                };

                var chart = new google.visualization.BarChart(lElement[0]);
                chart.draw(data, options);
            }

            console.log("called google.load for visualization");
        }
    }
}
});

如果有人让 eh 三人一起工作,也许您可​​以解释或发布到 JSFidlle 的链接。

4

1 回答 1

5

我不知道这是否会解决您的问题,但谷歌加载程序已经知道在其他函数中被调用的问题。其他环境中的用户已经成功地在 load 调用中而不是在#setOnLoadCallback方法中设置了回调函数。尝试使用这个:

define(['jquery'],function ( $) {
    return function () {
        return {
            restrict: 'A',
            link: function (scope, lElement, attrs) {
                function drawChart() {
                    var data = google.visualization.arrayToDataTable([
                        ['Year', 'Sales', 'Expenses'],
                        ['2004',  1000,      400],
                        ['2005',  1170,      460],
                        ['2006',  660,       1120],
                        ['2007',  1030,      540]
                    ]);

                    var options = {
                        title: 'Company Performance',
                        vAxis: {title: 'Year',  titleTextStyle: {color: 'red'}}
                    };

                    var chart = new google.visualization.BarChart(lElement[0]);
                    chart.draw(data, options);
                }
                google.load("visualization", "1", {packages:["corechart"], callback: drawChart});
            }
        }
    }
});
于 2013-10-14T16:52:33.107 回答