Как сделать маркер-ссылку в Google Maps?





Как в Google Maps API сделать так чтобы при наведении на маркер - всплывало info-окно, а при клике по нему пользователь переходил по нужной ссылке?

Ответы (6)

RSS
+
0
А! Вы хотите желать redirect при клике на самом маркере!

Ну тогда надо использовать document.location.href=... только и всего

То есть делаем так:
GEvent.addListener(marker, 'click', goToLink);

function goToLink()
{
  document.location.href = 'http://www.rambler.ru';
}

И все работает! Проверено!

Удачи
avatar

oshi

  • 3 июля 2009, 03:49
+
0
На всякий случай приведу весь код:

   function initialize() {
     if (GBrowserIsCompatible()) {
       var map = new GMap2(document.getElementById("map"));
       
var tlat = 40.702147;
var tlng = -74.015794;
var tpoint = new GLatLng(tlat,tlng);

       map.setCenter(tpoint, 13);
       
       var marker = new GMarker(tpoint);
GEvent.addListener(marker, 'mouseover', showMarkerWindow);
GEvent.addListener(marker, 'mouseout', closeMarkerWindow);
       
map.addOverlay(marker);
     }
   }

  function showMarkerWindow() {
this.openInfoWindowHtml('<a href="http://www.rambler.ru">Rambler</a>');
}
avatar

leksandr-igachyov

  • 5 июня 2009, 08:54
+
0
Спасибо за помощь to babr, но суть немного не в том. Хочется производить действия именно с маркером, а не с окном. Т.е. при наведении на маркер - появляется info-окно, а при клике на него же (не на ссылку в открывшемся над ним окне) - перейти по нужной ссылке.

Код примерно такой, только этот почему то не работает:

function createMarker(point,link,text,text2) {
       var marker = new GMarker(point);
       GEvent.addListener(marker, "click", function() {
       var myHtmls = "<a href=" + link + ">" + marker + "</a>";
       });
GEvent.addListener(marker, "mouseover", function() {
      var myHtml = text + text2;
 marker.openInfoWindowHtml(myHtml);
       });
avatar

alex-i2s

  • 29 июля 2009, 07:52
+
0
to Гость: АУ! ну что - попробовали?
avatar

everi

  • 29 мая 2009, 06:18
+
0
Тут 2 задачи:
1) сделать так, чтобы появлялось Info Window
2) Сделать так, чтобы в Info Window была выведена ссылка, на которую человек может кликнуть

Итак, приступим (процесс инициализации map я опускаю):
var marker = new GMarker(new GLatLng(55.683949, 37.881088));

т.к. вы хотите, чтобы info window всплывал именно при наведении (а не при клике) на маркер, то нужно прописать поведение маркера на событие mouseover:

GEvent.addListener(marker, 'mouseover', showMarkerWindow);

где showMarkerWindow - ф-я, обрабатывающая наведение курсора на маркер. Вот и она:
function showMarkerWindow() {
this.openInfoWindowHtml('<a href="http://www.rambler.ru">Rambler</a>');
}

Собственно, вот и все.
Это самый простой из вариантов. Можно так же предусмотреть некую переменную visible которая будет хранить состяние info-window (скрыто оно или показано) - чтобы избежать "мигания" при каждом движении курсора по маркеру (то есть - в showMarkerWindow вставить проверку if(visible == false) {... ). Т.к. вы не указали когда и как должно закрываться info-window - я эту ситуацию не обрабатывал здесь.

Посмотрите Google Maps Api Examples - ссылка [1] - смотрите в код страниц, там все понятно.

Удачи.
avatar

ost234

  • 15 июля 2009, 03:04
+
0
А как сделать несколько маркеров с разными подсказками при нажатии?
avatar

u-u

  • 25 мая 2009, 08:33

Только зарегистрированные и авторизованные пользователи могут отвечать.