在地图中设置标记的外部链接

时间:2014-04-16 10:30:36

标签: javascript google-maps google-maps-markers marker

我有以下代码,我想添加标记的外部链接,以便点击链接应在新窗口中打开的标记。请帮助,以便我可以将站点与URL链接在新窗口中打开。

<html>
 <body>
  <p>Chirag</p>
  <div id="map_canvas" style="width:1000px; height:650px"></div> 
  <p>Blah</p>

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

    var map;
    var markers = [];

    initialize();

    function initialize() {
      var myOptions = {
        zoom: 14,
        center: new google.maps.LatLng(23.2101344,72.6532201),
        mapTypeId: google.maps.MapTypeId.ROADMAP
      }
      map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

      addMarker(new google.maps.LatLng(23.2101344,72.6532201), "Station1");
      addMarker(new google.maps.LatLng(23.230682, 72.635013), "Station2");
      addMarker(new google.maps.LatLng(23.217885, 72.642481), "Station3");

    }

    function addMarker(latlng, myTitle) {
      markers.push(new google.maps.Marker({
        position: latlng, 
        map: map,
        title: myTitle,
        icon: "http://maps.google.com/mapfiles/marker" + String.fromCharCode(markers.length + 65) + ".png"
      }));    
    }

  </script> 
</body>

1 个答案:

答案 0 :(得分:0)

观察标记的点击事件,并使用window.open打开所需的窗口:

//pass the desired URL as 3rd parameter
function addMarker(latlng, myTitle,link) {
  markers.push(new google.maps.Marker({
    position: latlng, 
    map: map,
    title: myTitle,
    icon: "http://maps.google.com/mapfiles/marker" + String.fromCharCode(markers.length + 65) + ".png"
  }));

  if(typeof link!=='undefined'){
    var winName='win'+markers.length;
    google.maps.event.addListener(markers[markers.length-1],'click',function(){
        window.open(link,winName);
    })

  }    
}