Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Amigo_zz

Google + ASP + AJAX

Recommended Posts

EI pessoal,Já alguém brincou com o google maps de forma a colocar fotos no mapa mediante uma latitude/longitude?Alguem me pode ajudar a fazer uma brincadeira dessas? Precisava de desenvolver (sei que da) para um cliente que tem uma Imobiliaria.Abraços e Beijinhos

Compartilhar este post


Link para o post
Compartilhar em outros sites

nao te entendi karavocê quer por uma consulta que retorne fotos do google maps;?

Sim. Presumo que quem adiciona os Apartamentos ao site, introduza a latitude e Longitude do local.Depois quando se faz a pesquisa por exemplo: Apartamento em brasília com 2 quartos, aparece os dados do apartamento e a localização no MAPA, tal como se ve aí na net, utilizando claro o google maps.Eu sei que tenho de ter uma API Key, mas passando esse passo à frente....gostaria de ter algumas dicas da sua implementação e creio que se conseguirmos coloca rum exemplo desses a funcionar vai alegrar a vida de muitos programadores...Obrigado

Compartilhar este post


Link para o post
Compartilhar em outros sites

CaraSe o site do google maps possuir um campo pra digitar isso que você quer, e um botao de consulta ..acho que um xmlhttp resolveria o problema..Se ele nao tiver.. primeiro, precisa descobrir como faz isso ae no site deles ..e depois tentar mandar um xmlhttp..e pegar o resultar e ver o q acontece...

Compartilhar este post


Link para o post
Compartilhar em outros sites

Aê Amigo.. estou precisando da mesma coisa que você, mas jah fiz boa parte, o usuario cadastra o imovel a ser mostrado NO MAPA, nessa tabela eu tenho os campos latitude e longitude. O código do mapa esta ai a baixo, faço um select para trazer as informações do banco, depois coloquei um RecordSet para fazer o loop, onde tenho o codigo que cria os pontos no mapa.

 

O CURIOSO EH QUE FUNCIONA NO FIREFOX TUDO NUMA BOA ( cria todos os pontos, e cada um com sua respectiva informação), MAS NO

IE6, E IE7, DA PAU, O CODIGO CRIA OS PONTOS NO MAPA DE ACORDO COM OS REGISTROS DO BANCO, MAS AS INFORMAÇÕES, COMO:

CODIGO, QUARTOS, BAIRRO, ESTADO) SE REPETEM PARA TODOS OS PONTOS NO MAPA...

 

VAMUS NOS AJUDAR A CONCLUIR ESSE CODIGO.

 

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="content-type" content="text/html; charset=utf-8"><title>Google Maps JavaScript API Example</title><!--#Include file="conexao.asp"--><link href="css/fonte.css" rel="stylesheet" type="text/css"><%set RS = Server.CreateObject("adodb.recordset")SQL = "SELECT imovel.*, bairro.nm_bairro AS nm_bairro, cidade.nm_cidade AS nm_cidade, estado.nm_estado AS nm_estado, estado.sigla_estado AS sigla_estado, tipo_imovel.nm_tipo AS nm_tipo FROM imovel INNER JOIN bairro ON imovel.cod_bairro = bairro.cod_bairro INNER JOIN cidade ON imovel.cod_cidade = cidade.cod_cidade INNER JOIN estado ON imovel.cod_estado = estado.cod_estado INNER JOIN tipo_imovel ON imovel.cod_tipo = tipo_imovel.cod_tipo"RS.Open SQL,strcon'do while not RS.eof 'response.write(rs("codigo"))'response.write(rs("latitude"))'response.write(rs("longitude"))'response.write(rs("img1"))'response.write(rs("nm_bairro"))'response.write(rs("nm_tipo"))'response.write(rs("quartos"))'response.write(rs("suites"))'response.write("fim")'RS.movenext'loop'response.End()%><script src="http://maps.google.com/maps?file=api&v=2&key=ABQIAAAAhKiffCuY5pG5psmumGdDtBRU9H4xPvbXAeNtS_VEFBcK5Gqn4BRmENeM2FwXivzUDTbSqR3rUvZ-g"	  type="text/javascript"></script>	<script type="text/javascript">	//<![CDATA[	 function load() {	  if (GBrowserIsCompatible()) {		var map = new GMap2(document.getElementById("map"));		map.addControl(new GMapTypeControl());		map.addControl(new GLargeMapControl());		map.setCenter(new GLatLng(-9.6498987,-35.699826),15);			var baseIcon = new GIcon();	baseIcon.shadow = "";	baseIcon.iconSize = new GSize(20, 34);	baseIcon.shadowSize = new GSize(37, 34);	baseIcon.iconAnchor = new GPoint(9, 34);	baseIcon.infoWindowAnchor = new GPoint(9, 2);	baseIcon.infoShadowAnchor = new GPoint(18, 25);	<% do while not RS.eof %>  function createMarker(point,index) {  // Create a lettered icon for this point using our icon class  var icon = new GIcon(baseIcon);  icon.image = "http://localhost/Imobiliaria/img/mini_logo.gif";    var marker = new GMarker(point,icon);  GEvent.addListener(marker, "click", function() {  marker.openInfoWindowHtml("<table border=0><tr><td><img src='fotos/<%=RS("img1")%>' border=0 width=57 height=75></td><td class=texto_detalhes> Código: <font face=Arial, Verdana color=#EA7500 style=font-size:11px; font-weight:bold><%=RS("codigo")%></font><br> Tipo: <font face=Arial, Verdana color=#EA7500 style=font-size:11px; font-weight:bold><%=RS("nm_tipo")%></font><br> Bairro: <font face=Arial, Verdana color=#EA7500 style=font-size:11px; font-weight:bold><%=RS("nm_bairro")%></font><br> Quartos: <font face=Arial, Verdana color=#EA7500 style=font-size:11px; font-weight:bold><%=RS("quartos")%></font> quarto(s) sendo <font face=Arial, Verdana color=#EA7500 style=font-size:11px; font-weight:bold><%=RS("suites")%></font> suite(s)</td></tr></table>");  });    return marker;  }  var point = new GLatLng(<%=RS("latitude")%>,<%=RS("longitude")%>);	map.addOverlay(createMarker(point));	    <%RS.movenext%> <%loop%> 	  	  }	} 		//]]></script>  </head>  <body onLoad="load()" onUnload="GUnload()">	<div id="map" style="width: 545px; height: 270px"></div>  </body>
HELPPPP ...

 

Alexandre

Compartilhar este post


Link para o post
Compartilhar em outros sites

Boas tardes,

 

Ja resolvi essa questão. Então é assim:

 

No meu gestor de conteudos tenho o mapa do google maps, onde apos um clique no mapa, coloca dentro de duas textboxes a latitude e longitude.

 

Depois guarda o registo. De seguida gera um xml deste tipo:

 

<?xml version="1.0" encoding="iso-8859-1"?><parks>  <park><point lng="40.6133" lat="-7.92996" titulo="Fábrica" /></park>  <park><point lng="40.6473" lat="-7.91158" titulo="Loja 1" /></park>  <park><point lng="40.5188" lat="-8.08301" titulo="Loja 2 Tondela" /></park>  <park><point lng="40.6467" lat="-7.90911" titulo="Loja 3" /></park></parks>

Depois na parte de "fora" do site, o google maps carrega o xml e mostra a informaçao com este codigo:

 

<script type="text/javascript">	//<![CDATA[	function load() {	  if (GBrowserIsCompatible()) {		var zoom = 14;		var lat  = 40.3609410316;		var long = -8.03107133975;		var point = new GLatLng(lat,long);		var map  = new GMap2(document.getElementById("mapa"));		function createMarker(point,html) {			var marker = new GMarker(point);						GEvent.addListener(marker, "click", function() {				marker.openInfoWindowHtml(html);			});					return marker;		}			  		map.setCenter(new GLatLng(lat, long), zoom);		map.addControl(new GLargeMapControl());		map.addControl(new GMapTypeControl());		map.enableScrollWheelZoom();		map.setMapType(G_HYBRID_MAP);				var request = GXmlHttp.create();		request.open("GET", "parks.xml", true);				request.onreadystatechange = function() {			  if (request.readyState == 4) {				var xmlDoc = request.responseXML;   				var points = xmlDoc.documentElement.getElementsByTagName("point");								for (var i = 0; i < points.length; i++) {					  var point  = new GPoint(parseFloat(points[i].getAttribute("lng")),parseFloat(points[i].getAttribute("lat"))); 					var legend = points[i].getAttribute("titulo");					var marker = new GMarker(point);					var marker = createMarker(point,legend)										map.addOverlay(marker);				}			  }		}				request.send(null);			  }	}	//]]>	</script>

Claro que se pode implementar uma pesquisa que reescreva o xml de forma a mostrar apenas o que se procura.

 

Qualquer duvida...

Compartilhar este post


Link para o post
Compartilhar em outros sites

Caro Amigo, minha duvida eh a seguinte, se eu tenho um banco de dados que tem campos para cada ponto (latitude e longitude) para cada imovel cadastrado, e a partir dessas coordenadas do banco, eu fazer a marcação no google map da minha pagina. Tem como fazer isso/?

Compartilhar este post


Link para o post
Compartilhar em outros sites

Caro Amigo, minha duvida eh a seguinte, se eu tenho um banco de dados que tem campos para cada ponto (latitude e longitude) para cada imovel cadastrado, e a partir dessas coordenadas do banco, eu fazer a marcação no google map da minha pagina. Tem como fazer isso/?

Tem sim.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml">  <head>	  <style>		*{			margin:0;			padding:0;		}	</style>	<meta http-equiv="content-type" content="text/html; charset=utf-8"/>	<title>Obter Coordenadas</title>	<?php	require_once("header.php");	require_once("funcoes.php");		$sql = "select * from google";	$result=mysql_query($sql);		while($row = mysql_fetch_array($result)){		$api	= $row['apikey'];		$lat	= $row['lat'];		$zoom   = $row['zoom'];		$tmapa  = $row['tmapa'];		$long   = $row['lon'];		$titulo = $row['titulo'];		$desc   = $row['descricao'];	}		if($lat==""){		$lat ="40.11168866";	}	if($long==""){		$long ="-7.91015625";	}	if($zoom==""){		$zoom ="16";	}	if($tmapa==""){		$tmapa ="G_HYBRID_MAP";	}	echo "	<script src=\"http://maps.google.com/maps?file=api&amp;v=2&amp;key=$api\" type=\"text/javascript\"></script>	<script type=\"text/javascript\">	//<![CDATA[		var map;		var geocoder = null;   		var addressMarker;		var lat = $lat;		var long = $long;		var zoom = $zoom;		var countryData = {		  \"portugal\": { lat: $lat, lng: $long, address: \"Rua de S. Joao da Praca, 94 Lisboa Portugal\"}		};			function load() {	  if (GBrowserIsCompatible()) {		map = new GMap2(document.getElementById(\"map\"));		map.addControl(new GLargeMapControl());		map.addControl(new GMapTypeControl());		map.addControl(new GOverviewMapControl());		map.setCenter(new GLatLng($lat, $long), 6);		map.setMapType($tmapa);		map.enableScrollWheelZoom();				// Create a base icon for all of our markers that specifies the		// shadow, icon dimensions, etc.		var baseIcon = new GIcon();		baseIcon.shadow = \"icon_flagshadow.png\";		baseIcon.iconSize = new GSize(21, 14);		baseIcon.shadowSize = new GSize(35, 27);		baseIcon.iconAnchor = new GPoint(9, 5);		GEvent.addListener(map, 'click', function(overlay, point) {			if (overlay) {				map.removeOverlay(overlay);			}else if (point) {				map.clearOverlays() 				var marker = new GMarker(point);				map.addOverlay(marker);				window.opener.document.getElementById(\"txtlat\").value=point.y;				window.opener.document.getElementById(\"txtlong\").value=point.x;			}		});				function createMarker(point, country) {			// Create a lettered icon for this point using our icon class			var icon = new GIcon(baseIcon);			icon.image = \"icon_\" + country + \".png\";			var marker = new GMarker(point, icon);			GEvent.addListener(marker, 'click', function() {				map.setCenter(new GLatLng(countryData[country].lat, countryData[country].lng), 9);			});		  			return marker;		}		for (var country in countryData) {			var point = new GLatLng(countryData[country].lat,countryData[country].lng);			map.addOverlay(createMarker(point, country));		}				geocoder = new GClientGeocoder();		}	}					function showAddress(address) {			if (geocoder) {				geocoder.getLatLng(address,				function(point) {					if (!point) {						alert(address + \" não foi encontrado!\");					} else {						if (addressMarker) {							map.removeOverlay(addressMarker);						}						addressMarker = new GMarker(point);						map.setCenter(point, 15);						map.addOverlay(addressMarker);						window.opener.document.getElementById(\"txtlat\").value=point.y;						window.opener.document.getElementById(\"txtlong\").value=point.x;					}				}				);			}		}		function zoomTo(country) {			document.getElementById(\"addressInput\").value = countryData[country].address;			showAddress(countryData[country].address);		}	//]]>	</script>";	?>  </head>  <body onload="load()" onunload="GUnload()">	<form action="#" onsubmit="showAddress(this.address.value); return false">	  <p>		  Pode pesquisar no mapa a sua empresa através do nome da rua. Deverá Obrigatoriamente seguir a seguinte regra de pesquisa:		<div>NOME DA RUA ( ESPAÇO ) LOCALIDADE</div>	  </p>	  <p>		<input type="text" size="60" id="addressInput" name="address" value="" />		<input type="submit" value="Pesquisar" />	  </p>	</form>	<div id="map" style="width: 600px; height: 500px"></div>  </body></html>
Desculpa este codigo estar embutido em php, mas é a mesma coisa em asp. Repara que por causa do javascript estar dentro do php antes de cada ASPA ("), tem um barra invertida ( \ ). Podes retirar.Agora como este codigo é aberto em um popup, tenho estas duas linhas que atribui as coordenadas a duas text boxes:
window.opener.document.getElementById("txtlat").value=point.y;window.opener.document.getElementById("txtlong").value=point.x;
Se tiveres alguma duvida...Esqueci-me apenas de te dizer que em php, se nao souberes, as variaveis começam por $, por isso é facil saber que valores deves la colocar.Tenho esta a aplicação assim, para que o meu cliente possa escolher que tipo de mapa quer ver, quanto zoom quer dar, coordenadas iniciais, etc...

Compartilhar este post


Link para o post
Compartilhar em outros sites

Amigo, nao sei se você viu, mais eu postei um codigo em asp que ta funcionando do jeito que eu quero, porém tem um problema nesse codigo, ele soh funciona no FIREFOX, mas no IE7, ele marca todos os pontos de acordo com as coordenadas passadas pelo banco, mas as informações contidas para cada ponto se repetem para todos os pontos. ( a informação do ultimo registro)Sabe como posso resolver isso? POis pra mim seria mais dificil modificar esse codigo php para minhas necessidades, doque arrumar um erro nesse meu codigo, se você puder analisar o codigo que postei anteriormente, pra ver se encontra alguma irregularidade... serei eternamente grato!!Alexandre Lopes

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.