Google 未使用 Google Visualization API 定义；可能是 jQuery 的错 [英] Google is not defined using Google Visualization API; possibly jQuery's fault

问题描述

我遇到了与 ($ 未定义)除了我们没有从谷歌加载 jQuery，我们在本地托管它.

我们成功地以这种方式内联加载了许多其他 jQuery 扩展以及 jQuery 代码的额外部分，所以在我看来这应该可行.我不知道 jQuery 是否妨碍了 Google/反之亦然，但它们不应该.

想法?

解决方案

删除 $(document).ready 应该可以解决您的问题.我试过你的代码，在注释掉 $(document).ready 后，它工作了:

//$(document).load(function() {google.load('visualization', '1', {packages:['intensitymap']});google.setOnLoadCallback(drawChart);//});

现在至于为什么会这样，我不知道......无论如何，你应该不需要等待 document.ready 调用 google.load；google.load 将确保在您的回调 drawChart 被调用时，可以安全地执行.

I'm getting the same error as seen in this question to which there is no answer. To elaborate, I'm trying to load this demo in my code. I've altered it slightly in that I am not including their code in any header tag - this particular code fragment will be loaded in by jQuery. Anyway, so my code looks like this:

<script type='text/javascript' 
        src='https://www.google.com/jsapi?key=ABQIAAAAKl2DNx3pM....'>
</script>

<script type='text/javascript'>

function drawChart() {
    var data = new google.visualization.DataTable();
    data.addColumn('string', '', 'Country');
    data.addColumn('number', 'Population (mil)', 'a');
    data.addColumn('number', 'Area (km2)', 'b');
    data.addRows(5);
    data.setValue(0, 0, 'CN');
    data.setValue(0, 1, 1324);
    data.setValue(0, 2, 9640821);
    data.setValue(1, 0, 'IN');
    data.setValue(1, 1, 1133);
    /* ... */
    var chart = new google.visualization.IntensityMap(
                  document.getElementById('chart_div'));
    chart.draw(data, {});
}

$(document).ready(function() {
    google.load('visualization', '1', {packages:['intensitymap']});
    google.setOnLoadCallback(drawChart);
});
</script>

This section of code lies in a div whose visibility is toggled as needed. The whole lot (the entire page here) is returned as the result of an ajax call.

The theory here being using jQuery's $(document).ready() handler means that google should be loaded when the document is ready.

However, I'm getting this:

Regardless of whether that section is inside ready() or not. Now here's the real kicker: in the dom explorer, I can find said object:

Can anyone please explain to me firstly why this is happening and then what I do to fix it?

Being a naive kind of javascript developer, I tried including the google scripts in my head tags. That then produced something like this question ($ not defined) except that we're not loading jQuery from google, we're hosting it locally.

We successfully load a number of other jQuery extensions inline this way as well as extra parts of jQuery code, so to my mind this should work. I do not know whether jQuery is getting in the way of Google/vice versa but they shouldn't be.

Thoughts?

解决方案

Removing $(document).ready should fix your problem. I tried your code and after commenting out $(document).ready, it worked:

//$(document).load(function() {
    google.load('visualization', '1', {packages:['intensitymap']});
    google.setOnLoadCallback(drawChart);
//});

Now as for why this is the case, I do not know... In any case, you shouldn't need to wait for document.ready to call google.load; google.load will ensure that by the time your callback drawChart is called, it will be safe to execute.

这篇关于Google 未使用 Google Visualization API 定义；可能是 jQuery 的错的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！