0

Google 在此处提供了一个在地图上更新 Fusion Table 图层的绝佳示例：https ://developers.google.com/fusiontables/docs/samples/change_query

用户输入在 HTML 中是这样捕获的：

    <select id="delivery">
      <option value="">--Select--</option>
      <option value="yes">Yes</option>
      <option value="no">No</option>
    </select>

然后在 javascript 中像这样更新查询：

function updateMap(layer, tableId, locationColumn) {
    var delivery = document.getElementById('delivery').value;
    if (delivery) {
      layer.setOptions({
        query: {
          select: locationColumn,
          from: tableId,
          where: "delivery = '" + delivery + "'"
        }
      });
    } else {
      layer.setOptions({
        query: {
          select: locationColumn,
          from: tableId
        }
      });
    }

正如您在上面的链接中看到的那样，查询和地图图层会在更改时立即更新。我不想在更改时立即更新，而是让用户在交付字段中选择一个值，然后在单击按钮时更新查询：

<input type="button" id="button" value="Update Map">

谁能给我一个例子或者修改updateMap函数使用按钮点击提示更改？

我尝试了这样的事情，但没有奏效：

var delivery = document.getElementById('button').click();
    if (delivery) { ...

在此先感谢您的帮助...

4

2 回答 2

0

地图会立即更新，因为示例中存在与 select 元素关联的事件：

google.maps.event.addDomListener(document.getElementById('delivery'),
        'change', function() {
          updateMap(layer, tableId, locationColumn);
    });

上面的代码关联了一个事件 - 在选定值的“更改”时，执行“updateMap”。

您需要删除此事件并将事件与您的按钮“单击”相关联。

例子：

google.maps.event.addDomListener(document.getElementById('<Your Button ID>'),
            'click', function() {
              updateMap(layer, tableId, locationColumn);
        });

话虽如此，您附加事件的技术是不正确的。如果您使用的是 Javascript，则需要附加事件并添加事件侦听器。如果你使用 jQuery，你可以使用'bind'/'on' 函数来附加事件。

于 2013-09-04T05:05:55.677 回答
0

我从谷歌找到了一个很好的例子来回答我原来的问题。下面是一个显示更新 Fusion Table 图层查询的单击事件的示例：

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

于 2013-09-04T22:09:33.200 回答