Google Maps v3 fitBounds противоречивый масштаб
Возникла очень странная проблема
A: Один метод моей карты работает отлично. Пользователь устанавливает начальную точку и конечную точку, и карта создается, а fitBounds.extend(bounds) устанавливает уровень масштабирования соответствующим образом, чтобы охватить начальные / конечные маркеры на карте.
B: Второй метод заключается в том, что если пользователь устанавливает начальную точку, но не конечную точку, но исходя из интересов других пользователей, я получаю для них конечную точку извлечения и отображаю ее на карте, используя те же функции, что и в методе A. Однако после fitBounds.extend(bounds) устанавливает уровень масштабирования в 4 (уровень страны). Тогда я должен заставить установить масштаб.
Не имеет значения, когда в любой момент пользователь использует метод A (до или после метода B)... когда его метод A, уровень масштабирования является правильным. Когда его метод B его всегда, чтобы увеличить уровень 4.
... но все используют одни и те же функции.
Оба метода точно наносят маркеры на карту и точно рисуют маршрут между маркерами. Как и в методе A, автоматический зум верен, а в методе B зум всегда установлен на 4.
Если пользователь делает A, его право... тогда происходит B, его масштабирование уменьшается... делает ли B снова, оно остается уменьшенным... делает A снова, оно возвращается к правильному масштабированию.
Сводит меня с ума здесь!
Мой объект карты "setMap", это глобальная переменная
function setMapBounds(start,end) {
mapBounds = new google.maps.LatLngBounds();
mapBounds.extend(start.position);
mapBounds.extend(end.position) ;
setMap.fitBounds(mapBounds) ;
}
function addMarkers(newMarkers) { // an array of map points.
var tempMarkers = [] ;
for (var x=0;x<newMarkers.length;x++) {
var tempLatlon = new google.maps.LatLng(newMarkers[x].lat,newMarkers[x].lon) ;
var tempMarker = createMarker(tempLatlon,newMarkers[x].img,newMarkers[x].title) ;
tempMarkers.push(tempMarker) ;
}
return tempMarkers ;
}
function createMarker(latlon,img,title) {
var marker = new google.maps.Marker({
map:setMap,
position:latlon,
icon: img,
title:title
}) ;
return marker ;
}
// Это метод A - он ВСЕГДА правильно устанавливает масштаб
function setDropoff(dropoffLoc) { //called from: index.js/setPickup(), tab-map.html
geoCoder.geocode({'address': dropoffLoc}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
if (results[0]) {
endLocation = dropoffLoc ;
endLat = results[0].geometry.location.lat() ;
endLon = results[0].geometry.location.lng() ;
// first clear any existing END Markers only.
while(markersArray.length) {
markersArray.pop().setMap(null);
}
endPointSet = 1 ;
endLatlon = new google.maps.LatLng(endLat,endLon) ;
var endMarker = createMarker(endLatlon,'img/red-pin.png','Drop off') ;
markersArray.push(endMarker) ;
setMapBounds(userMarker,endMarker) ;
if (startPointSet == 1) {
drawRoute("DRIVING",startLocation,endLocation) ;
}
}
} else {
error = "Address not found."
}
});
}
// Это метод B, он ВСЕГДА толкает масштабирование до 4. Он извлечен из другой функции, которая проверяет, установил ли пользователь ручную установку и конечную точку... если это так, то добавьте wayPoints между пользовательским набором start / end точки. Если нет, то установите для карты начальную точку пользователя с единственной конечной точкой интереса
if (endPointSet == 1) { // draw Pickup to START to wayPoints to END
var markers = [
{lat:interests[0].shub_lat,lon:interests[0].shub_lon,img:interests[0].img,title:"Pickup"},
{lat:interests[1].ehub_lat,lon:interests[1].ehub_lon,img:interests[1].img,title:"Dropoff"}
] ;
var points = [interests.shub_address,interests.ehub_address] ;
extraMarkers = addMarkers(markers) ;
drawRoute("BICYCLING",startLocation,endLocation,points) ;
} else {
var markers = [
{lat:interests[0].shub_lat,lon:interests[0].shub_lon,img:interests[0].img,title:"Dropoff"}
] ;
extraMarkers = addMarkers(markers) ;
setMapBounds(userMarker,extraMarkers[0]) ;
drawRoute("WALKING",startLocation,interests[0].shub_address) ;
}
}
Вот объекты, переданные в setMapBounds из else в методе B. Начальная точка установлена пользователем... но конечная точка не установлена, я выбираю один для них. Первый объект - начало, второй - конец.
Lh {__gm: Object, gm_accessors_: Object, map: Qk, closure_uid_909815000: 563, gm_bindings_: Object…}
Lf: Object
...
position: pf
D: -82.49799999999999
k: 27.873196
...
Lh {__gm: Object, gm_accessors_: Object, map: Qk, closure_uid_909815000: 602, gm_bindings_: Object…}
Lf: Object
...
position: pf
D: -82.47631678090198
k: 27.9374560148825
...
А вот объекты, переданные в setMapBounds из метода A, где пользователь устанавливает одинаковые начальную и конечную точки. Вы можете видеть, что начальная точка одинакова как для метода A, так и для B.
Lh {__gm: Object, gm_accessors_: Object, map: Qk, closure_uid_909815000: 563, gm_bindings_: Object…}
Lf: Object
...
position: pf
D: -82.49799999999999
k: 27.873196
...
Lh {__gm: Object, gm_accessors_: Object, map: Qk, closure_uid_909815000: 703, gm_bindings_: Object…}
Lf: Object
...
position: pf
D: -82.45717760000002
k: 27.950575
...
1 ответ
Я делаю подобное приложение, и код, который я использую:
var start;
var end;
function updateMap(name, obj){ //obj is a form input i.e. <input type="text">
var marker = (name==='start')?start:end;
geocoder.geocode({address:obj.value}, function(results, status){
//get coords/check if is valid place
if(status === google.maps.GeocoderStatus.OK){
//get info, store in new marker
marker.setPosition(results[0].geometry.location);
marker.setTitle(obj.value);
//if both markers present
if(start.getPosition() && end.getPosition()){
map.fitBounds(new google.maps.LatLngBounds(start.getPosition(), end.getPosition()));
}else{
//otherwise, if one marker
map.setCenter(marker.getPosition());
map.setZoom(15);
}
marker.setMap(map);
}else if(status === google.maps.GeocoderStatus.ZERO_RESULTS){
alert('There is an issue with address. Please refer to the "Help" link.');
}else{
setTimeout(function(){
updateMap(marker, obj);
}, 200);
}
});
}
Для этого нужно взять аргумент из текстового ввода, геокодировать его и поместить маркер на карту. Функция вызывается onchange событие в элементе формы. Это может быть легко адаптировано для вашего собственного использования. Если была только одна точка, я просто установил значение масштабирования по умолчанию (обычно довольно близко к улице, хотя вы можете настроить его так, как хотите).
Что касается вашего вопроса о том, почему он не работает, я могу сформулировать лучшее предположение со всем кодом. На данный момент, я думаю, что это как-то связано со смещением по регионам, или это просто ошибка. Наверное, лучше всего обойти это.