草庐IT

javascript - TypeError : google. 可视化未定义

coder 2024-05-08 原文

我正在尝试使用 Google 图表 API,但出现了我无法理解的错误:

这是我的代码:

<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript" src="js/statistics/overview.js"></script>

overview.js 中的代码是这样的:

var statisticsOverview = {
    init: function() {
        google.load("visualization", "1", {packages: ["corechart"]});
        google.setOnLoadCallback(this.drawIncomeChart());
        google.setOnLoadCallback(this.drawExpensesChart());
        google.setOnLoadCallback(this.drawEconomiesChart());
    },
    drawIncomeChart: function() {
        var data = [
            ['Year', 'Income'],
            ['October 2013', 1000],
            ['January 2014', 1170],
            ['March 2014', 660]
        ];
        var options = {
            title: 'Income Performance',
            colors: ['green']
        };
        var id = 'chart_income';

        this.drawLineChart(data, options, id);
    },
    drawExpensesChart: function() {
        var data = [
            ['Year', 'Expense'],
            ['October 2013', 1000],
            ['January 2014', 1170],
            ['March 2014', 660]
        ];
        var options = {
            title: 'Expense Performance',
            colors: ['red']
        };
        var id = 'chart_expenses';
        this.drawLineChart(data, options, id);
    },
    drawEconomiesChart: function() {
        var data = [
            ['Year', 'Savings'],
            ['2004', 1000],
            ['2005', 1170],
            ['2006', 660],
            ['2007', 1030]
        ];

        var options = {
            title: 'Savings Performance',
            colors: ['orange']
        };

        var id = 'chart_economies';
        this.drawLineChart(data, options, id);
    },
    drawLineChart: function(data, options, id) {
        console.log(google.visualization);
        var chartData = google.visualization.arrayToDataTable(data);

        var chart = new google.visualization.LineChart(document.getElementById(id));
        chart.draw(chartData, options);
    }
};

statisticsOverview.init();

这很奇怪,因为 console.log() 会给我带有可视化属性的 google 对象。我做错了什么?

最佳答案

时间问题。通常你称谷歌图表为

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

因此,当加载可视化包时,将调用绘制函数。

现在,在你的情况下,一切都稍后完成,所以你必须做:

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

function doStats() {

var statisticsOverview = {
    init: function() {
        console.log('init');
        this.drawIncomeChart();
        this.drawExpensesChart();
        this.drawEconomiesChart();
    },
    ...
};    

statisticsOverview.init()
}

google.setOnLoadCallback(doStats);

使用

可以得到类似的结果
setTimeout(function() {
    statisticsOverview.init();
}, 3000);

没有包装函数。

关于javascript - TypeError : google. 可视化未定义,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21659671/

有关javascript - TypeError : google. 可视化未定义的更多相关文章

  1. ruby - Facter::Util::Uptime:Module 的未定义方法 get_uptime (NoMethodError) - 2

    我正在尝试设置一个puppet节点,但ruby​​gems似乎不正常。如果我通过它自己的二进制文件(/usr/lib/ruby/gems/1.8/gems/facter-1.5.8/bin/facter)在cli上运行facter,它工作正常,但如果我通过由ruby​​gems(/usr/bin/facter)安装的二进制文件,它抛出:/usr/lib/ruby/1.8/facter/uptime.rb:11:undefinedmethod`get_uptime'forFacter::Util::Uptime:Module(NoMethodError)from/usr/lib/ruby

  2. ruby-on-rails - Rails 3.2.1 中 ActionMailer 中的未定义方法 'default_content_type=' - 2

    我在我的项目中添加了一个系统来重置用户密码并通过电子邮件将密码发送给他,以防他忘记密码。昨天它运行良好(当我实现它时)。当我今天尝试启动服务器时,出现以下错误。=>BootingWEBrick=>Rails3.2.1applicationstartingindevelopmentonhttp://0.0.0.0:3000=>Callwith-dtodetach=>Ctrl-CtoshutdownserverExiting/Users/vinayshenoy/.rvm/gems/ruby-1.9.3-p0/gems/actionmailer-3.2.1/lib/action_mailer

  3. ruby-on-rails - form_for 中不在模型中的自定义字段 - 2

    我想向我的Controller传递一个参数,它是一个简单的复选框,但我不知道如何在模型的form_for中引入它,这是我的观点:{:id=>'go_finance'}do|f|%>Transferirde:para:Entrada:"input",:placeholder=>"Quantofoiganho?"%>Saída:"output",:placeholder=>"Quantofoigasto?"%>Nota:我想做一个额外的复选框,但我该怎么做,模型中没有一个对象,而是一个要检查的对象,以便在Controller中创建一个ifelse,如果没有检查,请帮助我,非常感谢,谢谢

  4. ruby - 主要 :Object when running build from sublime 的未定义方法 `require_relative' - 2

    我已经从我的命令行中获得了一切,所以我可以运行rubymyfile并且它可以正常工作。但是当我尝试从sublime中运行它时,我得到了undefinedmethod`require_relative'formain:Object有人知道我的sublime设置中缺少什么吗?我正在使用OSX并安装了rvm。 最佳答案 或者,您可以只使用“require”,它应该可以正常工作。我认为“require_relative”仅适用于ruby​​1.9+ 关于ruby-主要:Objectwhenrun

  5. ruby - 在 Ruby 中有条件地定义函数 - 2

    我有一些代码在几个不同的位置之一运行:作为具有调试输出的命令行工具,作为不接受任何输出的更大程序的一部分,以及在Rails环境中。有时我需要根据代码的位置对代码进行细微的更改,我意识到以下样式似乎可行:print"Testingnestedfunctionsdefined\n"CLI=trueifCLIdeftest_printprint"CommandLineVersion\n"endelsedeftest_printprint"ReleaseVersion\n"endendtest_print()这导致:TestingnestedfunctionsdefinedCommandLin

  6. ruby - 定义方法参数的条件 - 2

    我有一个只接受一个参数的方法:defmy_method(number)end如果使用number调用方法,我该如何引发错误??通常,我如何定义方法参数的条件?比如我想在调用的时候报错:my_method(1) 最佳答案 您可以添加guard在函数的开头,如果参数无效则引发异常。例如:defmy_method(number)failArgumentError,"Inputshouldbegreaterthanorequalto2"ifnumbereputse.messageend#=>Inputshouldbegreaterthano

  7. ruby - 如何在 Grape 中定义哈希数组? - 2

    我使用Ember作为我的前端和GrapeAPI来为我的API提供服务。前端发送类似:{"service"=>{"name"=>"Name","duration"=>"30","user"=>nil,"organization"=>"org","category"=>nil,"description"=>"description","disabled"=>true,"color"=>nil,"availabilities"=>[{"day"=>"Saturday","enabled"=>false,"timeSlots"=>[{"startAt"=>"09:00AM","endAt"=>

  8. ruby - 获取模块中定义的所有常量的值 - 2

    我想获取模块中定义的所有常量的值:moduleLettersA='apple'.freezeB='boy'.freezeendconstants给了我常量的名字:Letters.constants(false)#=>[:A,:B]如何获取它们的值的数组,即["apple","boy"]? 最佳答案 为了做到这一点,请使用mapLetters.constants(false).map&Letters.method(:const_get)这将返回["a","b"]第二种方式:Letters.constants(false).map{|c

  9. ruby - Ruby 中的波形可视化 - 2

    我即将开始一个将录制和编辑音频文件的项目,我正在寻找一个好的库(最好是Ruby,但会考虑Java或.NET以外的任何库)以进行实时可视化波形。有人知道我应该从哪里开始搜索吗? 最佳答案 要流入浏览器的数据量很大。Flash或Flex图表可能是唯一能提高内存效率的解决方案。Javascript图表往往会因大型数据集而崩溃。 关于ruby-Ruby中的波形可视化,我们在StackOverflow上找到一个类似的问题: https://stackoverflow.c

  10. ruby - 这两个 Ruby 类初始化定义有什么区别? - 2

    我正在阅读一本关于Ruby的书,作者在编写类初始化定义时使用的形式与他在本书前几节中使用的形式略有不同。它看起来像这样:classTicketattr_accessor:venue,:datedefinitialize(venue,date)self.venue=venueself.date=dateendend在本书的前几节中,它的定义如下:classTicketattr_accessor:venue,:datedefinitialize(venue,date)@venue=venue@date=dateendend在第一个示例中使用setter方法与在第二个示例中使用实例变量之间是

随机推荐