0

複数のマーカーのコーディングを使用しており、現在デフォルトの情報ウィンドウを表示している情報ウィンドウをカスタマイズする必要があります。背景画像とリンクを使用してウィンドウをカスタマイズする必要があります

      <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>
4

1 に答える 1

0

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);
于 2013-07-26T08:28:39.433 に答える