0

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

模板渲染由 formremote 触发:

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

错误:

Uncaught TypeError: Cannot call method 'getElementsByTagName' of null 

脚本:

<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>
4

2 回答 2

1

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

var chart = new google.visualization.GeoChart(document.getElementById('myID'));
于 2013-06-11T18:28:22.683 回答
0

<script type="text/javascript" src='https://www.google.com/jsapi?autoload={"modules":[{"name":"visualization","version":"1","packages":["corechart","table"]}]}'></script>

在头上。

于 2013-09-24T21:08:42.260 回答