谷歌可视化循环-返回谷歌.可视化未定义

Google visualization loop - returns google.visualization is undefined

本文关键字：谷歌 可视化 未定义 返回 循环      更新时间：2023-09-26

我正在尝试创建一个函数，该函数可以处理发送到页面的所有数据，以在页面上的不同点构建谷歌图表。我首先想到的是正确设置图表将要使用的数据数组。没关系。我遇到的问题是，当prdocess访问"google.visionation.arrayToDataTable（[data]）"时，我收到的错误是"google.vislationization is undefined"。对于我可能做错的事情，我们将不胜感激。

//$(document).ready(function () {
var chart_pie = $('.chart-pie');
var dataObj = [];
var Chart = {} || [];
//console.log(chart_pie);
google.load('visualization', '1.0', {'packages':['corechart']});
        // Set a callback to run when the Google Visualization API is loaded.
        // google.setOnLoadCallback(Chart.draw_chart);
        var chartColors = ['#f0ca41','#c97038', '#14425c',  '#3d799d', '#625e79'];
        var pieHeight = 300;
        var pieWidth = 400;
        var columnHeight = 230;
        var columnWidth = 775;
Chart = {
    init: function () {
        this.pie_chart();
    },
    pie_chart: function () {
        chart_pie.each(function () {
            var chartID = $(this).attr('id');
            chartID = chartID.replace('chart-', '');
            console.log(chartID +': '+ JSON.stringify(chart_data[chartID]));
            Chart.populate_object(chart_data[chartID], chartID);
            google.setOnLoadCallback(Chart.draw_chart(dataObj[chartID]));
            // console.log(JSON.stringify(chart_data[chartID]));
        });
    }, 
    populate_object: function (obj, chartID) {

        for (var i=0;i<obj.length;i++) {
            dataObj[obj.chartID] = [obj[i].Label, obj[i].Value];
        }
    },
    draw_chart: function (data) {
        var chartData = google.visualization.arrayToDataTable([data]);
        var options = {'title':chart_data[chartID].title,
                 'width':pieWidth,
                 'height':pieWidth,
                 borderColor: '#ffffff',
                 'colors': chartColors};
        var chart = new google.visualization.PieChart(document.getElementById('chart-' + chartID));
        chart.draw(chartData, options);
    }
};
Chart.init();
// });

如果有人创建了一个函数来处理谷歌图表的这种操作，请分享。

您的回调无效：

google.setOnLoadCallback(Chart.draw_chart(dataObj[chartID]));

实际上是在调用draw_chart方法，所以它在onLoad被触发之前被调用。你需要做这样的事情：

google.setOnLoadCallback(function () {
  Chart.draw_chart(dataObj[chartID]);
});
相关文章：