2016-05-24 10 views
-1

マーカーがGoogleマップにドロップされると、それぞれのマーカーを拡大表示したいと思います。マーカーをドロップするとマーカーに移動する方法(Google Maps API)

drop関数とaddMarkerWithTimeout関数内でpanToとsetZoomメソッドを使用しようとしましたが、動作していないようです。私はこの問題を解決しようと、過去数時間を過ごしました。誰にもアイデアはありますか?

var neighbors = [ 
    {lat: 41.081445, lng: -81.519005}, 
    {lat: 42.652579, lng: -73.756232}, 
    {lat: 61.218056, lng: -149.900278}, 
    {lat: 32.735687, lng: -97.108066}, 
    ]; 


var markers = []; 
var map; 

function initMap() { 
    map = new google.maps.Map(document.getElementById('googlemapsbackground'), { 
    zoom: 4, 
    center: {lat: 39.8282, lng: -98.5795} 
    }); 
} 

window.onload = function drop() { 
    clearMarkers(); 
    for (var j = 0; j < neighbors.length; j++) { 
    addMarkerWithTimeout(neighbors[j], j * 1000); 
    } 
} 

function addMarkerWithTimeout(position, timeout) { 
    window.setTimeout(function() { 
    markers.push(new google.maps.Marker({ 
     position: position, 
     map: map, 
     animation: google.maps.Animation.DROP 
    })); 
    }, timeout); 
} 

function clearMarkers() { 
    for (var j = 0; j < markers.length; j++) { 
    markers[j].setMap(null); 
    } 
    markers = []; 
} 
+0

試しmap.panTo(位置) '加える;あなたはsetTimeout'機能 –

+0

'内に新しいマーカーを追加したら、 '私はmap.panTo(位置)を使用してみました。しかしそれはうまくいかないようでした。あなたの助けをありがとう! –

答えて

0

LatLngBoundsオブジェクトを使用できます。

function addMarkerWithTimeout(position, timeout) { 
    window.setTimeout(function() { 
    var bounds = new google.maps.LatLngBounds(), 
     marker = new google.maps.Marker({ 
      position: position, 
      map: map, 
      animation: google.maps.Animation.DROP 
     }); 

    bounds.extend(marker.getPosition()); 
    markers.push(marker); 
    map.fitBounds(bounds); 
    }, timeout); 
} 
+0

それは働いた!!!!どうもありがとうございます。 –

関連する問題