Função criar MarKer Google Maps

[sNniffer 1]

Pessoal,

 

Numa página chamado 3 modais bootstrap, em cada modal há um mapa, preciso que cada mapa ao ser clicado, seja criado um marker, capturado as coordenadas desse marker e exibido o endereço correspondente num input. Os mapas estão sendo exibidos corretamente, mas, esta sendo criado apenas o marker no primeiro mapa 'map', nos outros, ao clicar não está criando o marker e o endereço enviado para o input é apenas 'Brasil'.

 

Abaixo meu arquivo .js, com todas as funções.

 

A função createMarker..., cria o marker, e a função getCoords..., captura o endereço.

	$(function () {
	$("#rota_mapa_saida").on('shown.bs.modal', function () {
		google.maps.event.trigger(map, 'resize');
	});


		$("#rota_mapa_coleta").on('shown.bs.modal', function () {
			google.maps.event.trigger(map_coleta, 'resize');
		});


	$("#rota_mapa_destino").on('shown.bs.modal', function () {
		google.maps.event.trigger(map_destino, 'resize');
	});	
	});


	var map
	var map_coleta
	var map_destino

	var marker;


	function initialize() { //Inicializa mapa
	var mapOptions = {
	  center: new google.maps.LatLng(-9.435530395596114,-36.09555605468743),
	  zoom: 9,
	  mapTypeId: 'roadmap'
	};

	map = new google.maps.Map(document.getElementById('map-canvas-maker-saida'), mapOptions);
	map_coleta = new google.maps.Map(document.getElementById('map-canvas-maker-coleta'), mapOptions);
	map_destino = new google.maps.Map(document.getElementById('map-canvas-maker-destino'), mapOptions);




	google.maps.event.addListener(map, "click", function(event) {
	  var lat_saida = event.latLng.lat().toFixed(6);
	  var lng_saida = event.latLng.lng().toFixed(6);
	  createMarker_saida(lat_saida, lng_saida);
	  getCoords_saida(lat_saida, lng_saida);
	});

	   google.maps.event.addListener(map_coleta, "click", function(event) {
		  var lat_coleta = event.latLng.lat().toFixed(6);
		  var lng_coleta = event.latLng.lng().toFixed(6);
		  createMarker_coleta(lat_coleta, lng_coleta);
		  getCoords_coleta(lat_coleta, lng_coleta);
	   });


	google.maps.event.addListener(map_destino, "click", function(event) {
	  var lat_destino = event.latLng.lat().toFixed(6);
	  var lng_destino = event.latLng.lng().toFixed(6);
	  createMarker_destino(lat_destino, lng_destino);
	  getCoords_destino(lat_destino, lng_destino);
	});


	}
	google.maps.event.addDomListener(window, 'load', initialize);



	// Função que cria o marcador no maps Saída//////////////////////////////////////////////////////////////////////
	function createMarker_saida(lat, lng) {
	   if (marker) {
		  // remover esse marcador do mapa
		  marker.setMap(null);
		  // remover qualquer valor da variável marker_saida
		  marker = "";
	   }

	    marker = new google.maps.Marker({
		  position: new google.maps.LatLng(lat, lng),
		  draggable: true,
		  map: map
	   });

		// Evento que detecta o arrastar do marcador para
		google.maps.event.addListener(marker, 'dragend', function() {
		marker.position = marker.getPosition();
		// os valores das caixas de texto no topo
		var lat = marker.position.lat().toFixed(6);
		var lng = marker.position.lng().toFixed(6);
		// Atualiza Inputs
		getCoords_saida(lat, lng);
	  

	});



	  
}


	// Função que actualiza as caixas de texto no topo da página
	
	function getCoords_saida(lat, lng) {
				///////////////////////////////////////////////////////
			//Captura o endereço
			var latlng = lat + "," +lng;
			var url = "http://maps.googleapis.com/maps/api/geocode/json?latlng=" + latlng + "&sensor=true";
			$.getJSON(url, function (data) {
				for(var i=0;i<data.results.length;i++) {
					var adress = data.results[i].formatted_address;
					//alert(adress);
					document.getElementById('endereco_saida_maps').value = adress;
					endereco_campo.value = adress;
				}
			});   
	}
	// Função que cria o marcador no maps Saída///////////////////////////////////////////////////////////////////
	
	
	
	// Função que cria o marcador no maps Coelta//////////////////////////////////////////////////////////////////
	function createMarker_coleta(lat_coleta, lng_coleta) {
	   if (marker) {
		  // remover esse marcador do mapa
		  marker.setMap(null);
		  // remover qualquer valor da variável marker
		  marker = "";
	   }

	   marker = new google.maps.Marker({
		  position: new google.maps.LatLng(lat_coleta, lng_coleta),
		  draggable: true,
		  map_coleta: map_coleta
	   });

		// Evento que detecta o arrastar do marcador para
		google.maps.event.addListener(marker, 'dragend', function() {
		marker.position = marker.getPosition();
		// os valores das caixas de texto no topo
		var lat_coleta = marker.position.lat().toFixed(6);
		var lng_coleta = marker.position.lng().toFixed(6);
		// Atualiza Inputs
		getCoords_coleta(lat_coleta, lng_coleta);
	  

	});
	  
}

	function getCoords_coleta(lat, lng) {
				///////////////////////////////////////////////////////
			//Captura o endereço
			var latlng = lat + "," +lng;
			var url = "http://maps.googleapis.com/maps/api/geocode/json?latlng=" + latlng + "&sensor=true";
			$.getJSON(url, function (data) {
				for(var i=0;i<data.results.length;i++) {
					var adress = data.results[i].formatted_address;
					//alert(adress);
					document.getElementById('endereco_coleta_maps').value = adress;
					//endereco_campo.value = adress;
				}
			});   
	}
	// Função que cria o marcador no maps Coleta//////////////////////////////////////////////////////////////////
	
	
	
	
	// Função que cria o marcador no maps Destino/////////////////////////////////////////////////////////////////
	function createMarker_destino(lat, lng) {
	   if (marker) {
		  // remover esse marcador do mapa
		  marker.setMap(null);
		  // remover qualquer valor da variável marker
		  marker = "";
	   }

	   marker = new google.maps.Marker({
		  position: new google.maps.LatLng(lat, lng),
		  draggable: true,
		  map_destino: map_destino
	   });

		// Evento que detecta o arrastar do marcador para
		google.maps.event.addListener(marker, 'dragend', function() {
		marker.position = marker.getPosition();
		// os valores das caixas de texto no topo
		var lat = marker.position.lat().toFixed(6);
		var lng = marker.position.lng().toFixed(6);
		// Atualiza Inputs
		getCoords_destino(lat, lng);
	  

	});
	  
}

	function getCoords_destino(lat, lng) {
				///////////////////////////////////////////////////////
			//Captura o endereço
			var latlng = lat + "," +lng;
			var url = "http://maps.googleapis.com/maps/api/geocode/json?latlng=" + latlng + "&sensor=true";
			$.getJSON(url, function (data) {
				for(var i=0;i<data.results.length;i++) {
					var adress = data.results[i].formatted_address;
					//alert(adress);
					document.getElementById('endereco_destino_maps').value = adress;
					//endereco_campo.value = adress;
				}
			});   
	}
	// Função que cria o marcador no maps Destino//////////////////////////////////////////////////////////////////////
	
	
	

[sNniffer 1]

Consegui criar os marker, alterei o

marker = new google.maps.Marker({
  position: new google.maps.LatLng(lat, lng),
  draggable: true,
  map: map_destino //mudei em todos
});

Agora, o problema é o retorno do endereço, que está me retornando 'Brasil'

[sNniffer 1]

Ao dar um alert, percebi que me eram retornados varios endereços ao criar um marker, então coloquei uma variavel igual ao resultado e funcionou fluentemente.

endereco_campo.value = adress_coleta;

Vlw

[xandedj 0]

Como faço pra armazenar as coordenadas dos marcadores no banco???