Question

我有一个div如下显示谷歌地图：

#map {
   width: 300px;
   height: 300px;
   border: 1px solid #DDD;
}

<div id="map"></div>

我希望以适合上述视口范围的缩放级别显示地图。

当我编码如下时，它工作正常：

    var geocoder = new google.maps.Geocoder();
    var map = new google.maps.Map($('#map')[0], {zoom: 10});

    geocoder.geocode({ 'address': generatedAddress }, function (results, status) {
        if (status == 'OK') {
                map.setCenter(results[0].geometry.location);
                var marker = new google.maps.Marker({
                    map: map,
                    position: results[0].geometry.location
                });
                if (results[0].geometry.viewport)
                    map.fitBounds(results[0].geometry.viewport);

      } else {
          alert('Geocode was not successful for the following reason: ' + status);
      }
   });

当我使用typeahead-addresspicker.js生成地图时，它会放大太远？

我已将其缩小到以下代码。当您调用AddressPicker.prototype.updateMap函数时，boundsForLocation函数上的AddressPicker.prototype.initMap选项应返回this.map.fitBounds(response.geometry.viewport);当我调试时，我可以看到它在{{1}内部命中了以下代码按预期运行：

AddressPicker.prototype.updateBoundsForPlace

我不明白它是如何连接到google.maps.Map的 - 我对ptototypejs不熟悉？所以基本上运行它，我们通过调用initMap来初始化地图，然后我们调用updateMap函数。在updateMap函数内部，我们调用以下代码片段：

if (response.geometry.viewport) {
  console.log('test');
  return this.map.fitBounds(response.geometry.viewport);
}

假设通过调用if (_this.map) { if ((_ref = _this.mapOptions) != null) { _ref.boundsForLocation(response); } }来设置边界，但google maps options不会暴露任何名为boundsForLocation的属性？

updateBoundsForPlace

Answer 1

通过注释掉以下行来管理修复：

//if (response.geometry.viewport) {
//  return this.map.fitBounds(response.geometry.viewport);
//} else {
  this.map.setCenter(response.geometry.location);
  return this.map.setZoom(this.options.zoomForLocation);
//}

Google使用Prototypejs映射API V3方法fitBounds（）

1 个答案: