Warning: file_get_contents(/data/phpspider/zhask/data//catemap/8/grails/5.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
使用Google可视化时出现Javascript错误:无法调用方法';getElementsByTagName';空的_Javascript_Grails_Google Visualization - Fatal编程技术网

使用Google可视化时出现Javascript错误:无法调用方法';getElementsByTagName';空的

使用Google可视化时出现Javascript错误:无法调用方法';getElementsByTagName';空的,javascript,grails,google-visualization,Javascript,Grails,Google Visualization,我的项目结构包含一个简单的index.gsp,应该在其中呈现模板。模板本身有几个div,在呈现此模板时,应在其中绘制图表。 当我在index.gsp的任何div中使用下面的脚本时,索引视图和图表将正确呈现。但是,当我在模板中使用相同的脚本时,会呈现一个空白页面,并出现下面的javascript错误 模板呈现由formremote触发: <g:formRemote name="myForm" on404="alert('not found!')" update="content" ur

我的项目结构包含一个简单的index.gsp,应该在其中呈现模板。模板本身有几个div,在呈现此模板时,应在其中绘制图表。 当我在index.gsp的任何div中使用下面的脚本时,索引视图和图表将正确呈现。但是,当我在模板中使用相同的脚本时,会呈现一个空白页面,并出现下面的javascript错误

模板呈现由formremote触发:

<g:formRemote name="myForm" on404="alert('not   
found!')" update="content" url="[controller: 'charts', action:'generateChart']">
脚本:

<div id="myID">
<script>
google.load('visualization', '1', {'packages': ['geochart']});  
google.setOnLoadCallback(drawIt);               

function drawIt(){
    console.log("B");
    var data = google.visualization.arrayToDataTable([
        ['City',   'Population'],
        ['Berlin',      2761477],
        ['Freising',     1324110],
        ['Muenster',    959574],
        ['Muenchen',     907563],
        ['Neufahrn',   655875],
        ['Hof',     607906],
        ['Freiburg',   380181],
        ['Stuttgart',  371282],
        ['Kiel', 67370],
        ['Magdeburg', 52192],
        ['Erfurt',  38262]
    ]);

    var options = {
        height: 500,
        width: 700,
        region: 'DE',
        displayMode: 'markers',
        colorAxis: {colors: ['green', 'blue']}
    };

    console.log("D");

    var chart = new google.visualization.GeoChart('myID');
    chart.draw(data, options);
}
</script>
</div>

load('visualization','1',{'packages':['geochart']});
setOnLoadCallback(drawIt);
函数drawIt(){
控制台日志(“B”);
var data=google.visualization.arrayToDataTable([
[“城市”、“人口”],
[柏林,2761477],
[Freising',1324110],
[Muenster',959574],
[Muenchen',907563],
[Neufahrn',655875],
[Hof',607906],
['Freiburg',380181],
[Stuttgart',371282],
[Kiel',67370],
['Magdeburg',52192],
['Erfurt',38262]
]);
变量选项={
身高:500,
宽度:700,
地区:'德',
显示模式:“标记”,
colorAxis:{colors:['green','blue']}
};
控制台日志(“D”);
var chart=new google.visualization.geographical('myID');
图表绘制(数据、选项);
}

您必须将元素传递到图表API:

var chart = new google.visualization.GeoChart(document.getElementById('myID'));



在头部。

使用formRemote加载模板后,您的消息是否记录在控制台中?是的,我已使用一些虚拟控制台日志进行了测试。当错误提示时,不会记录回调中的“B”
var chart = new google.visualization.GeoChart(document.getElementById('myID'));
<script type="text/javascript" src='https://www.google.com/jsapi?autoload={"modules":[{"name":"visualization","version":"1","packages":["corechart","table"]}]}'></script>