Question

我使用了多个标记的编码，我需要自定义信息窗口，现在显示默认窗口。我需要使用背景图像和带链接

自定义窗口

      <script type="text/javascript"> 
       var locations = [['chennai', 13.0810, 80.2740, 4],
        ['madurai', 9.9300, 78.1200, 5],
        ['coimbatore', 11.0183, 76.9725, 3],
         ['Trichy', 10.8100, 76.9725, 2],
         ['vellore', 12.9202, 79.1333, 1]];

      var map = new google.maps.Map(document.getElementById('map'), {
      zoom: 10,
      center: new google.maps.LatLng(13.0810, 80.2740),
      mapTypeId: google.maps.MapTypeId.ROADMAP
   });

   var infowindow = new google.maps.InfoWindow();

   var marker, i;
var icon='images/';
for (i = 0; i < locations.length; i++) {  
  marker = new google.maps.Marker({
    position: new google.maps.LatLng(locations[i][1], locations[i][2]),
    icon: icon + 'pin.png',
    map: map
  });

  google.maps.event.addListener(marker, 'click', (function(marker, i) {
    return function() {
      infowindow.setContent(locations[i][0]);
      infowindow.open(map, marker);
    }
    })(marker, i));
   }
 </script>

Answer 1

您可以将您喜欢的任何内容HTML wise放入通过此次调用创建的信息窗口中。

infowindow.setContent(locations[i][0]);

所以你可以这样做，例如

var info = '<div class="mybackground">' +
'<div>Hello World</div>
'<div><a href="url">Link</a></div>
'<div>';
infowindow.setContent(info);

谷歌地图与自定义信息窗集成多个标记

1 个答案: