2016-09-24 2 views
0

В HTML-коде ниже я хочу получить предупреждение при изменении карты (например, масштабирование, перетаскивание, щелчок).Google Maps addListener не работает

Это предупреждение будет изменено в будущем, чтобы отображать угловые координаты при перетаскивании, масштабировании или нажатии. Затем кнопка «Get Corners» будет опущена (теперь это работает отлично).

Я пробовал много советов с многочисленных веб-сайтов. Но до сих пор нет успеха.

AddListener для предупреждения не работает. Кроме того, использование addDomListener не работает. Каков виновник этого кода?

Спасибо за вашу помощь заранее!

<!DOCTYPE html> 
<html> 
<head> 
</head>  
<script src="http://maps.googleapis.com/maps/api/js"> 
</script> 

<body> 
<script> 
    var map; 
    function initialize() 
    { 
    var mapOpt = {center:new google.maps.LatLng(41.5,2.0),zoom:10, mapTypeId:google.maps.MapTypeId.SATELLITE}; 
    map=new google.maps.Map(document.getElementById("googleMap"),mapOpt); 
    }; 
</script> 

<script> 
    function getCorners() 
    { 
    var bounds = map.getBounds(); 
    var ne = bounds.getNorthEast(); 
    var sw = bounds.getSouthWest(); 
    document.getElementById('ne').innerHTML = ne; 
    document.getElementById('sw').innerHTML = sw; 
    } 
</script> 

<! THIS addListener SCRIPT DOES NOT WORK> 
<script> 
    google.maps.event.addListener(map, 'idle', function() 
    { 
    window.alert("Map clicked"); 
    }); 
</script> 

<script> 
    google.maps.event.addDomListener(window, "load", initialize); 
</script> 
<p id="ne">NE</p> 
<p id="sw">SW</p> 
<button onclick="getCorners()">Get Corners</button> 

<br><br> 
<div id="googleMap" style="width:500px;height:500px"></div> 
</body> 
</html> 

ответ

0

Попробуйте переместить код слушателя внутри функции initilize

function initialize() 
{ 
    var mapOpt = {center:new google.maps.LatLng(41.5,2.0),zoom:10, mapTypeId:google.maps.MapTypeId.SATELLITE}; 
    map=new google.maps.Map(document.getElementById("googleMap"),mapOpt); 
    google.maps.event.addListener(map, 'idle', function(){ 
     window.alert("Map clicked"); 
    }); 
}; 
+0

@Michael и scaisEdge: Ввод AddListener в инициализации функции работали! Большое спасибо за быстрый ответ! – henk

+0

@henk, если мой ответ правильный, отметьте его как принятый ... см. Http://meta.stackexchange.com/questions/5234/how-does-accepting-an-answer-work. – scaisEdge

1

Это происходит потому, что google.maps.event.addListener вызывается до того, браузер даже не знает о ваших картах объект. Вероятно, есть и консольные ошибки. Поместите этот код в initialize(), тогда он должен работать.

В общем случае рекомендуется поместить все сценарии незадолго до конца тега тела, после того как будут определены все элементы HTML, включая, например, div, держащий карту. Кроме того, расщепление сценариев немного сбивает с толку и, похоже, не нужно.

Смежные вопросы