информационное окно для маркера - PullRequest
Новая
       11

информационное окно для маркера

2 голосов
/ 04 марта 2010

Я использую маркер Google Maps. У меня есть массив информации, которая будет отображаться в информационном окне. Я пытался так, 

markers = xml.documentElement.getElementsByTagName("marker");

for (i = 0; i < markers.length; i++) 
{

    info = markers[i].getAttribute("info");
    GEvent.addListener(markers[i], "click", function(info) {
          this.openInfoWindowHtml(info);                      
    });
}

openInfoWindowHtml(info) должно отображаться для каждого маркера. Мне нужно, чтобы окно информации отображалось.

спасибо v.srinath

Ответы [ 2 ]

2 голосов
/ 04 сентября 2016

Проверьте ниже скрипты, не забудьте добавить карту Google с API 

    // When the window has finished loading create our google map below
    google.maps.event.addDomListener(window, 'load', init);
    function init()
    {
    // Basic options for a simple Google Map
    // For more options see: <a href="https://developers.google.com/maps/documentation" rel="nofollow">https://developers.google.com/maps/documentation</a>    //javascript/reference#MapOptions
    var mapOptions = {
    // How zoomed in you want the map to start at (always required)
    zoom: 4,</p>

<code>// The latitude and longitude to center the map (always required)
center: new google.maps.LatLng(25.985448,52.7994103),
// Main map location
  navigationControl: false,
  mapTypeControl: false,
  scaleControl: false,
  draggable: false,
  scrollwheel: false,
  mapTypeControlOptions: {
  style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR,
  position: google.maps.ControlPosition.BOTTOM_LEFT
},

// How you would like to style the map. 
// This is where you would paste any style found on Snazzy Maps.
styles: []
};

// Get the HTML DOM element that will contain your map 
// We are using a div with id="map" seen below in the 
<body>
var mapElement = document.getElementById('googlemap');
// Create the Google Map using our element and options defined above
var map = new google.maps.Map(mapElement, mapOptions);

// address content Kuwait
var location1 = '<div id="content">'+
'<div id="siteNotice">'+
'</div>'+
'<h1 id="firstHeading" class="firstHeading">Location1 name</h1>'+
'<div id="bodyContent">'+
'<p> Location 1 content' +                        
'</p>'+                        
'</div>'+
'</div>';
var infolocation1 = new google.maps.InfoWindow({
content: location1
}); 
// Location Kuwait
var marker1 = new google.maps.Marker({
position: new google.maps.LatLng(29.363765,47.966278),
map: map,
title: ''
});
marker1.addListener('click', function() {
infolocation1.open(map, marker1);
});


// address content Kuwait
var location2 = '<div id="content">'+
'<div id="siteNotice">'+
'</div>'+
'<h1 id="firstHeading" class="firstHeading">
Location2 name</h1>'+
'<div id="bodyContent">'+
'<p> Location 2 content' +                        
'</p>'+                        
'</div>'+
'</div>';
var infolocation2 = new google.maps.InfoWindow({
content: location2
}); 
// Location Kuwait
var marker2 = new google.maps.Marker({
position: new google.maps.LatLng(29.363765,47.966278),
map: map,
title: ''
});
marker2.addListener('click', function() {
infolocation2.open(map, marker2);
});



}
0 голосов
/ 04 марта 2010

В вашем коде есть ошибка в этой строке GEvent.addListener(marker[i], "click", function(info) { такого массива нет marker

Фиксированный код: 

markers = xml.documentElement.getElementsByTagName("marker");

for (i = 0; i < markers.length; i++) 
{

    info = markers[i].getAttribute("info");
    GEvent.addListener(markers[i], "click", function() {
          markers[i].openInfoWindowHtml(info);                      
    });
}
...