0

我正在尝试将 Google Fusion Tables 与 Google Charts 一起使用来构建一个可以响应下拉菜单中的更改的表格。

我非常密切地关注这个例子:

https://developers.google.com/fusiontables/docs/samples/gviz_datatable

我可以使用 Fusion Tables 中的数据绘制表格。该表将毫无问题地响应选择菜单。

我想实现一个 selectHandler 来存储用户选择的行的内容。我打算将该行的内容传递给其他函数,但我就是无法让 selectHandler 正常工作。

  google.load('visualization', '1', {packages: ['table']});

  function drawTable() {

      var query = "SELECT 'key', 'description' as Style, " +
              "'business_name' as Name, 'Rating' " +
              'FROM 15bCp26r1CDuN86Tu8hMOGRWlZwNI30Pl60srz9g';
      var vendors = document.getElementById('vendors').value;
      if (vendors) {
        query += " WHERE 'description' = '" + vendors + "'";
      }

      var queryText = encodeURIComponent(query);

      var gvizQuery = new google.visualization.Query(
        'http://www.google.com/fusiontables/gvizdata?tq=' + queryText);

      gvizQuery.send(function(response) {
        var table = new google.visualization.Table(
          document.getElementById('visualization'));

        var data = response.getDataTable();

        table.draw(data, {
            showRowNumber: false,
            sortColumn: 3,
            sortAscending: false
        });

        google.visualization.events.addListener(table, 'select', selectHandler);

        function selectHandler() {
            //alert("Selected");
            var selectedItem = table.getSelection()[0];
            var value = data.getValue(selectedItem.row, selectedItem.column);
            alert(value);
        }

    });      

  }

我非常密切地关注这个例子。selectHandler 确实有效。当用户单击一行时,我可以弹出一个警报框,但我无法将该行的内容存储到变量值中。

我究竟做错了什么?

4

1 回答 1

1

当您在函数var value内部声明时selectHandler,范围value是函数的本地范围。一旦函数返回,局部变量就会被标记为垃圾回收并且变得不可访问。如果要value长期存储,则需要在本地范围之外声明selectHandler,如下所示:

var value;
function selectHandler () {...}

顺便说一句,在selectHandler函数中,您应该测试选择的长度,因为它可能为零(这会在您的代码中引发错误)或大于 1(在这种情况下,您没有捕获所有相关信息) . 尝试这样的事情:

function selectHandler() {
    var selection = table.getSelection();
    if (selection.length > 0) {
        // do something
    }
}

或这个:

function selectHandler() {
    var selection = table.getSelection();
    for (var i = 0; i < selection.length; i++) {
        // do something
    }
}
于 2013-11-04T12:55:18.270 回答