метод Google Maps API V3 fitBounds() с помощью Prototypejs

-1

У меня есть DIV следующим образом, чтобы отобразить карту Google:метод Google Maps API V3 fitBounds() с помощью Prototypejs

#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.updateMapboundsForLocation вариант на AddressPicker.prototype.initMap функции должны возвращать this.map.fitBounds(response.geometry.viewport); Когда я отладки я вижу, что он поражает следующий код внутри функции AddressPicker.prototype.updateBoundsForPlace, как и ожидалось:

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

То, что я не понимаю, как он возвращается в google.maps.Map - я не знаком с ptototypejs? Таким образом, в основном, используя это, мы инициализируем карту, вызывая initMap, затем вызываем функцию updateMap. Внутри функции updateMap мы называем следующий фрагмент кода:

if (_this.map) { 
      if ((_ref = _this.mapOptions) != null) { 
       _ref.boundsForLocation(response); 
      } 
    }

, который предполагают, чтобы установить границы путем вызова updateBoundsForPlace но google maps options Doesnt разоблачить любое свойство boundsForLocation?

AddressPicker.prototype.initMap = function() { 
    var markerOptions, _ref, _ref1; 
    if ((_ref = this.options) != null ? (_ref1 = _ref.map) != null ? _ref1.gmap : void 0 : void 0) { 
     this.map = this.options.map.gmap; 
    } else { 
     this.mapOptions = $.extend({ 
     zoom: 3, 
     center: new google.maps.LatLng(0, 0), 
     mapTypeId: google.maps.MapTypeId.ROADMAP, 
     boundsForLocation: this.updateBoundsForPlace 
     }, this.options.map); 
     this.map = new google.maps.Map($(this.mapOptions.id)[0], this.mapOptions); 
    } 
    this.lastResult = null; 
    markerOptions = $.extend({ 
     draggable: true, 
     visible: false, 
     position: this.map.getCenter(), 
     map: this.map 
    }, this.options.marker || {}); 
    this.marker = new google.maps.Marker(markerOptions); 
    if (markerOptions.draggable) { 
     return google.maps.event.addListener(this.marker, 'dragend', this.markerDragged); 
    } 
    }; 


    AddressPicker.prototype.updateMap = function(event, place) { 
    if (this.options.placeDetails) { 
     return this.placeService.getDetails(place, (function(_this) { 
     return function(response) { 
      var _ref; 
      _this.lastResult = new AddressPickerResult(response); 
      if (_this.marker) { 
      _this.marker.setPosition(response.geometry.location); 
      _this.marker.setVisible(true); 
      } 
      if (_this.map) { 
      if ((_ref = _this.mapOptions) != null) { 
       _ref.boundsForLocation(response); 
      } 
      } 
      return $(_this).trigger('addresspicker:selected', _this.lastResult); 
     }; 
     })(this)); 
    } else { 
     return $(this).trigger('addresspicker:selected', place); 
    } 
    }; 

    AddressPicker.prototype.updateBoundsForPlace = function(response) { 
    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); 
    } 
    };

источник

2016-09-13 adam78

Есть ли способ, что вы можете сделать скрипку, чтобы продемонстрировать эту проблему? Я не совсем понимаю, что вы пытаетесь спросить. –

В initMap для этой карты установлены карты google: this.map = this.options.map.gmap; или this.map = new google.maps.Map ($ (this.mapOptions.id) [0], this.mapOptions); –

@Scott Я понимаю это, но когда вы вызываете функцию updateMap, ему нужно установить boundsForLocation. Но, глядя на https://developers.google.com/maps/documentation/javascript/reference#MapOptions api, MapOptions не имеет свойства, называемого boundsForLocation, и как оно устанавливается? – adam78

удалось зафиксировать закомментировав следующие строки:

//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); 
//}

источник

2016-09-14 07:38:18 adam78

метод Google Maps API V3 fitBounds() с помощью Prototypejs

ответ

Смежные вопросы