Question

我试图根据点击融合表图层/地图动态绘制图表。每当点击墨西哥州时，我希望图表更改以反映2007,2008,2009和2010列中的值。目前，这不起作用。 Firebug告诉我'a is undefined'但我真的不知道这意味着什么，因为我还没有声明一个名为'a'的变量，并假设它是谷歌脚本中的东西。

这是我正在使用的代码。点击侦听器从名为“column_1”的列中获取状态名称，然后将其传递给绘制可视化功能：

google.maps.event.addListener(shownLayer, 'click',function(e){
    stateName = e.row['column_1'].value;
    drawVisualization(stateName);           
});  


function drawVisualization(stateName){
    google.visualization.drawChart({
        containerID: "textBox",
        dataSourceUrl: "http://www.google.com/fusiontables/gvizdata?tq=",

        query: "SELECT '2007','2008','2009','2010' " +
          "FROM 3943497 WHERE column_1 = '" + stateName + "'",
        chartType: "ColumnChart",
        options: {
            title: stateName,
            height: 300,
            width: 400
        }
    }); 

}

地图网站位于：https://mywebspace.wisc.edu/csterling/web/cartel%20map/index.html

Answer 1

containerID: "textBox",

被拼错了。应该是：

containerId: "textBox",

我的建议是先让基本的静态GVis图表工作，然后再担心将其链接到Fusion Tables并根据鼠标点击更改图表。我采用了脚本的相关部分但无法使其工作。当您发布整个文件时，很难将问题与其他代码分开。这是我提取的用于测试基本GViz问题的内容：

<!DOCTYPE html>
   <html>
   <head>
   <script src="http://www.google.com/jsapi"></script>
  <script type='text/javascript'>
   google.load('visualization','1', {packages: ['corechart'] });
    window.onload = function () {
       drawVisualization('Chiapas');
    }
   function drawVisualization(stateName){
       google.visualization.drawChart({
           "chartType": "ColumnChart",
           "containerId": "textBox",
           "dataSourceUrl": "http://www.google.com/fusiontables/gvizdata?tq=",
           "query": "SELECT '2007','2008','2009','2010' " + "FROM 3943497 WHERE column_1 = '" + stateName + "'",
           "options": {
               title: stateName
           }
       });
   }

   </script>
   </head>
   <body>
     <div id="textBox" style="width: 400px; height: 300px;"></div>
     <br />
   </body>
   </html>

此应用程序不起作用。我将在页面中显示： “不支持具有值域轴的条形系列”

我还可以在您的应用中看到您使用的stateName值是“Chiapas，Mexico”，但这不是Fusion Table column_1中显示的值，“Chiapas”是一个值。

使用谷歌融合表绘制图表可视化

1 个答案: