Google チャートで Google Fusion Tables を使用して、ドロップダウン メニューの変更に応答するテーブルを作成しようとしています。
私はこの例に非常に厳密に従っています:
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 は機能します。ユーザーが行をクリックするとポップアップする警告ボックスを取得できますが、行の内容を変数値に保存することはできません。
私は何を間違っていますか?