试图获得2个地图API:FusionTablesLayer函数可以在同一个地图和融合表上工作

时间:2012-06-27 20:00:12

标签: google-fusion-tables

我创建了一个融合表和图层,允许我使用复选框隐藏或显示地图上的某些标记。我想添加一个类似于平移和缩放功能的搜索功能。此外,一旦地图缩放到该位置,我希望有一个半径选项,用于标识某个区域内的其他位置。 我修改了在IN查询(https://developers.google.com/fusiontables/docs/samples/in)上找到的示例代码,并且可以使复选框工作,但是当我尝试包含平移和缩放代码时( https://developers.google.com/fusiontables/docs/samples/search_and_zoom),我似乎无法使用搜索功能。

我有一个融合表,大约有4000条记录。我是编码的新手,所以我确信它是我的语法中的东西。我还会假设我想做的事情是可能的吗?

任何帮助都将不胜感激。

这是代码。如上所示,我想插入一个利用平移和缩放功能的搜索。我最终将其从下面的代码中删除,因为我不确定如何插入或格式化它。

 <head>
  <style>
    #map-canvas { width:800px; height:600px; }
  </style>
  <script type="text/javascript"
    src="http://maps.google.com/maps/api/js?sensor=false">
  </script>
  <script type="text/javascript">
    var map;
    var layerl0;
function initialize() {
        var tableId = '4422804';

        var map = new google.maps.Map(document.getElementById('map-canvas'), {
          center: new google.maps.LatLng(50.792047064406866, -99.052734375),
          zoom: 2,
          mapTypeId: google.maps.MapTypeId.HYBRID
        });

        var layer = new google.maps.FusionTablesLayer();
        filterMap(layer, tableId, map);

        google.maps.event.addDomListener(document.getElementById('< 5'),
            'click', function() {
              filterMap(layer, tableId, map);
        });

        google.maps.event.addDomListener(document.getElementById('> 5'),
            'click', function() {
              filterMap(layer, tableId, map);
        });

        google.maps.event.addDomListener(document.getElementById('Not Signed'),
            'click', function() {
              filterMap(layer, tableId, map);
        });

    google.maps.event.addDomListener(document.getElementById('Signed Not Selling'),
            'click', function() {
              filterMap(layer, tableId, map);

    });
      }

      // Filter the map based on checkbox selection.
      function filterMap(layer, tableId, map) {
        var where = generateWhere();

        if (where) {
          if (!layer.getMap()) {
            layer.setMap(map);
          }
          layer.setOptions({
            query: {
              select: 'Full Address',
              from: tableId,
              where: where
            }
          });
        } else {
          layer.setMap(null);
        }
      }

      // Generate a where clause from the checkboxes. If no boxes
      // are checked, return an empty string.
      function generateWhere() {
        var filter = [];
        var stores = document.getElementsByName('store');
        for (var i = 0, store; store = stores[i]; i++) {
          if (store.checked) {
            var storeName = store.value.replace(/'/g, '\\\'');
            filter.push("'" + storeName + "'");
          }
        }
        var where = '';
        if (filter.length) {
          where = "'Map' IN (" + filter.join(',') + ')';
        }
        return where;
      }
          google.maps.event.addDomListener(window, 'load', initialize);
    </script>
  </head>
  <body>
    <div id="map-canvas"></div>

1 个答案:

答案 0 :(得分:0)

你没有包括你的复选框等。但这里有一个例子,使用按钮,而不是复选框。不应该太难以适应你的需求。没有放大,这实际上是一个不同的问题。

http://jsfiddle.net/ebridger/wmnDU/