[Resolvido] API Google Maps v3

[cbmerj 0]

Bom, estou com um problema que provavelmente não deve ser tão complicado, mas não estou conseguindo resolver.

 

Tenho um código que plota no mapa, polígonos através de 3 funcoes:

1- criar mais um ponto(marcador) no polígono

2- remover um ponto no polígono

3- arrastar um ponto do polígono

 

Até ai tudo bem. O problema é que quando clico em uma coordenada dentro do polígono, dá uma série de erros, e nada mais funciona. Inclusive tenho que fechar o navegador e abri-lo novamente. Não adianta nem ctrl + F5.

 

Se alguém puder me ajudar, segue o código:

 

<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false&language=pt-BR&region=BR"></script> 
<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script> 
<script type="text/javascript" src="js/jquery-ui-1.8.4.custom.min.js"></script> 
<script src="js/js.js" type="text/javascript"></script>
<script src="js/jquery.validate.js" type="text/javascript"></script>
<script src="js/jquery.form.ajax.js" type="text/javascript"></script>

<script type="text/javascript">
 
 
var poly, map;
var markers = [];
var path = new google.maps.MVCArray;
var acao='<%=acao%>'
var texto=''

//FUNÇÃO QUE INICIALIZA ASSIM QUE O DOM FOR CARREGADO
function initialize() {
	  
	//PLOTA O MAPA NA DIV MAP_CANVAS  
	var uluru = new google.maps.LatLng(-22.9068124,-43.188639);
	
	map = new google.maps.Map(document.getElementById("map_canvas"), {
	  zoom: 16,
	  center: uluru,
	  mapTypeId: google.maps.MapTypeId.SATELLITE
	});
	
        //CRIA O POLÍGONO POLY
	poly = new google.maps.Polygon({
	  strokeWeight: 3,
	  fillColor: '#5555FF'
	});
	poly.setMap(map);
	poly.setPaths(new google.maps.MVCArray([path]));
	

	
	//CRIA O EVENTO CLICK NO MAPA, CHAMANDO A FUNÇÃO ADDPOINT
	google.maps.event.addListener(map, 'click', addPoint);


	//FUNÇÃO QUE ADICIONA PONTOS NO POLÍGONOS
	function addPoint(event) {

		if (path.length < 6){
                        //INSERE O PONTO PASSADO NO EVENTO CLICK NA PASTA PATH DO POLÍGONO
			path.insertAt(path.length, event.latLng);
			//CRIA O MARCADOR COM O PONTO PASSADO NO EVENTO
			var marker = new google.maps.Marker({
				position: event.latLng,
				map: map,
				draggable: true
			});
                        //ADICIONA O PONTO NO ARRAY MARKERS, QUE GUARDA AS COORDENADAS DO POLÍGONO
			markers.push(marker);
			
                        //DENTRO DA FUNCAO ADDPOINT, HÁ A FUNCAO QUE REMOVE PONTOS DO POLÍGONO, QUANDO HÁ CLICK EM UM MARCADOR. 
			google.maps.event.addListener(marker, 'click', remove_point);
			function remove_point(event) {
				alert(markers.length)
				marker.setMap(null);
				for (var i = 0, I = markers.length; i < I && markers[i] != marker; ++i);
				markers.splice(i, 1);
				path.removeAt(i);
				var texto='';
				for (i in markers){
					texto+= markers[i].getPosition()
				}
				document.getElementById("hdCoordenadas").value = texto

			};
			
			//Função que permite arrasatar marcadores do polígono
			google.maps.event.addListener(marker, 'dragend', function() {
				for (var i = 0, I = markers.length; i < I && markers[i] != marker; ++i);
				path.setAt(i, marker.getPosition());
				var texto='';
				for (i in markers){
					texto+= markers[i].getPosition()
				}
				document.getElementById("hdCoordenadas").value = texto
			});
			
		}
		else{
			alert ('O número máximo de 6 pontos no polígono excedido!')	
		}
	}
}
//FINALIZA A FUNÇÃO INICIALIZA
</script>

[cbmerj 0]

Consegui resolver o problema!

 

Ainda não entendi porquê, mas quando eu deixava a layer que continha o mapa dentro do formulário, acontecia o erro que me referi.

 

Bastou eu tirar a layer de dentro do formulário, para tudo ficar normal.

 

Bom, fico chateado porque não entendi o porque, mas aliviado de ter resolvido o problema. Se alguém souber explicar, por favor explique.

 

Abs.