JavascriptをGoogleが

-3

をマッピングし、私は私の会社の地方事務所の複数の場所があり、ユーザーはのような場所でクリックするたびに、それぞれの場所を表示する必要があります。JavascriptをGoogleが

場所1
LOCATION2
LOCATION3

ユーザーが場所1でクリックします地図上に位置1が表示されます。私はまた、私の地図にそれらの場所を持っています。私はこれまでGoogleマップで作業したことがないので、始めにいくつかのアイデアが必要です。

出典

2011-08-02 MNet

申し訳ありませんが、私はそれについて今すぐに感謝の相手に感謝します:) – MNet

ユーザーがリンクをクリックすると、マップ上のsetCenter(latlng:LatLng)を呼び出すjavascriptを実行して、マップを特定の場所に集中させます。

どこから始めるべきかわからない場合は、Google Maps APIのドキュメントを読んで始めてください。読むのは簡単ですし、多くの作業が含まれていますexamples。

出典

2011-08-03 00:11:45

おかげで助けになりました:) – MNet

あなたはこのような何かを行うことができます。（私は

<html> 
    <head> 

    <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=false"></script> 
    <script type="text/javascript"> 

    function initialize() { //Initalize JS after onload 
    var map = new google.maps.Map(document.getElementById('map_canvas'), { 
    mapTypeId: google.maps.MapTypeId.ROADMAP, 
    }); 


    var randomPoint1 = new google.maps.LatLng(44.6479, -63.5744); //First Location 

    var marker1 = new google.maps.Marker({ //Set up marker 
      position: randomPoint1, 
      map: map 
     }); 

    google.maps.event.addDomListener(document.getElementById('locationid1'), 'click', //Set up DOM listener 1 
     function(){ 
      map.setZoom(13); 
     map.setCenter(marker1.getPosition()); 
     }); 


    var randomPoint2 = new google.maps.LatLng(45.5081, -73.5550); //Second Location 

    var marker2 = new google.maps.Marker({ 
      position: randomPoint2, 
      map: map 
     }); 

    google.maps.event.addDomListener(document.getElementById('locationid2'), 'click',//Set up DOM listener 2 
     function(){ 
      map.setZoom(13); 
     map.setCenter(marker2.getPosition()); 
     }); 


    var randomPoint3 = new google.maps.LatLng(43.6481, -79.4042); //Third Location 

    var marker3 = new google.maps.Marker({ 
      position: randomPoint3, 
      map: map 
     }); 

    google.maps.event.addDomListener(document.getElementById('locationid3'), 'click', //Set up DOM listener 3 
     function(){ 
      map.setZoom(13); 
     map.setCenter(marker3.getPosition()); 
     }); 
     map.setCenter(marker2.getPosition()); 
     map.setZoom(5); 
    } 



    </script> 

    </head> 
    <body onload="initialize()"> <!--Initalize JS after onload---> 
     <a href="#" id="locationid1">Halifax</a> 
     <a href="#" id="locationid2">Montreal</a> 
     <a href="#" id="locationid3">Toronto</a> 

     <div id="map_canvas" style="height:100%; width:100%"></div> 

    </body> 

</html>

をその初期/後期今、それはループのために最適化できると確信していると私はこれを書いた後、私はポストからだった実現

出典

2012-05-14 08:18:06 evandentremont

あなたはする必要はありません同様の操作を明示的に繰り返します。 [ここには例があります]（http://www.geocodezip.com/v3_MW_example_map2.html）は、マーカー（およびサイドバーの項目も作成するための機能を使用しています。 –

JavascriptをGoogleが

答えて

関連する問題