Jump to content


Photo

Sistema De Localização De Imóvel Pelo Mapa


  • Faça o login para participar
Nenhuma resposta neste tópico

#1 Hernani Garcia

Hernani Garcia

    Novato no fórum

  • Usuários
  • 3 posts
  • Sexo:Masculino
  • Localidade:Goiania
  • Interesses:Programação PHP

Posted 13/05/2011, 14:03

Sistema de localização de imóvel pelo Mapa

Ola Tudo bem,

Estou tentando a alguns dias criar este sistema de visualização de imóvel pelo mapa.

Este sistema faz o seguinte:
Mostra a localização do imóvel no mapa.

O projeto inteiro é este abaixo, é bem simples mas funcional:
Tem 3 Select Bairro, Quadra e Setor
Um botão Localizar
Um Iframe com mapa do Wikimapia (http://wikimapia.org)

---------------------------------------------------------

Ao abrir o site os nomes dos bairros são armazenados no select Bairro e é aberto no Iframe o mapa de Goiania

Ao selecionar o Bairro o select quadra é preenchido com as quadras deste bairro e no iframe deveria aparecer um zoom com o bairro. (Esta coordenada se encontra na tabela tb_bairro campo coord) - (Nao estou conseguindo este zoom)

Ao selecionar a Quadra o select Lote é preenchido com os lotes que estão nesta quadra e no bairro selecionado,
O Iframe deveria ser atualizado com as coordenadas da quadra que se encontra na tabela tb_lotes, campo coord19
Também não estou conseguindo este Zoom

Ao clicar o botao Localizar abre uma janela com as informações do lote tb_Lotes (Logradouro, area, frente, lateral)
O iframe deveria ser atualizado com as coordenadas do lote que se encontra tb_lotes, campo coord20
Também não estou conseguindo este Zoom
---------------------------------------------------------------

A base de dados tem apenas 2 tabelas: tb_bairro e tb_lotes:

# MySQL-Front 3.2 (Build 14.8)

# Host: localhost Database: investimovel
# ------------------------------------------------------
# Server version 4.0.14-nt

#
# Table structure for table tb_bairro
#

CREATE TABLE `tb_bairro` (
`id` tinyint(3) NOT NULL auto_increment,
`bairro` varchar(60) default '',
`coord` varchar(80) default '',
PRIMARY KEY (`id`)
) TYPE=InnoDB;

#
# Dumping data for table tb_bairro
#

INSERT INTO `tb_bairro` VALUES (1,'ST CENTRAL','');
INSERT INTO `tb_bairro` VALUES (2,'JD AMERICA','http://wikimapia.org...21&z=14&l=9&m=b');
INSERT INTO `tb_bairro` VALUES (3,'ST SUDOESTE','');
INSERT INTO `tb_bairro` VALUES (4,'PQ AMAZONIA','');

#
# Table structure for table tb_lotes
#

CREATE TABLE `tb_lotes` (
`id` int(4) NOT NULL default '0',
`lote` varchar(10) default '',
`quadra` varchar(10) default '',
`idbairro` tinyint(3) default '0',
`logradouro` varchar(30) default '',
`coord19` varchar(80) default '',
`coord20` varchar(80) default '',
`area` smallint(1) default '0',
`frente` varchar(7) default '0',
`lateral` varchar(7) default '',
PRIMARY KEY (`id`)
) TYPE=InnoDB;

#
# Dumping data for table tb_lotes
#

INSERT INTO `tb_lotes` VALUES (1,'19','510',2,'RUA C-210','http://wikimapia.org...9&m=b,520,30,25');
INSERT INTO `tb_lotes` VALUES (2,'20','510',2,'RUA C-211','http://wikimapia.org...9&m=b,600,25,15');
INSERT INTO `tb_lotes` VALUES (3,'09','524',2,'RUA C-119','http://wikimapia.org...9&m=b,320,33,10');
INSERT INTO `tb_lotes` VALUES (4,'21','524',2,'RUA C-160','http://wikimapia.org...9&m=b,340,30,28');
INSERT INTO `tb_lotes` VALUES (5,'16','65',3,'RUA C-054','http://wikimapia.org...9&m=b,480,30,20');
INSERT INTO `tb_lotes` VALUES (6,'23','61',3,'RUA C-053','http://wikimapia.org...9&m=b,300,25,30');
INSERT INTO `tb_lotes` VALUES (7,'50','117',4,'RUA IGAPO','http://wikimapia.org...9&m=b,320,30,15');

-----------------------------------------------------------------------------------------------------------------

O script do sistema:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR...l1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<title>Systema Imobiliário</title>

<script src="jquery-1.3.2.min.js" type="text/javascript"></script>

<!-- script type="text/javascript" src="http://ajax.googleap....js"></script-->
<script type="text/javascript">
$(document).ready(function() {
$('a[name=modal]').click(function(e) {
e.preventDefault();

var id = $(this).attr('href');

var maskHeight = $(document).height();
var maskWidth = $(window).width();

$('#mask').css({'width':maskWidth,'height':maskHeight});

$('#mask').fadeIn(1000);
$('#mask').fadeTo("slow",0.6);

//Get the window height and width
var winH = $(window).height();
var winW = $(window).width();

$(id).css('top', 15);
$(id).css('left', 15);

$(id).fadeIn(2000);

});

$('.window .close').click(function (e) {
e.preventDefault();

$('#mask').hide();
$('.window').hide();
});

$('#mask').click(function () {
$(this).hide();
$('.window').hide();
});

});

</script>

<style type="text/css">
body {
font-family:verdana;
font-size:15px;
}

a {color:#333; text-decoration:none}
a:hover {color:#ccc; text-decoration:none}

#mask {
position:absolute;
left:0;
top:0;
z-index:9000;
background-color:#000;
display:none;
}

#boxes .window {
position:absolute;
left:0;
top:0;
width:250px;
height:250px;
display:none;
z-index:9999;
padding:20px;
}

#boxes #dialog {
width:250px;
height:250px;
padding:10px;
background-color:#ffffff;
}

.close{display:block; text-align:right;}
</style>


<!-- Seleciona o Bairro -->
<script type="text/javascript">
$(document).ready(function(){
$('#bairro').change(function(){
//alert('Zoom do mapa do bairro');
$('#quadra').load('quadras.php?bairro='+$('#bairro').val() );
});
});
</script>

<!-- Seleciona a Quadra -->
<script type="text/javascript">
$(document).ready(function(){
$('#quadra').change(function(){
//alert('Zoom do mapa da quadra');
$('#lote').load('lotes.php?quadra='+$('#quadra').val() + "&" + 'bairro='+$('#bairro').val());
});
});
</script>


<!-- Funcoes do botao -->
<script type="text/javascript">
function FP_swapImg() {//v1.0
var doc=document,args=arguments,elm,n; doc.$imgSwaps=new Array(); for(n=2; n<args.length;
n+=2) { elm=FP_getObjectByID(args[n]); if(elm) { doc.$imgSwaps[doc.$imgSwaps.length]=elm;
elm.$src=elm.src; elm.src=args[n+1]; } }
}

function FP_preloadImgs() {//v1.0
var d=document,a=arguments; if(!d.FP_imgs) d.FP_imgs=new Array();
for(var i=0; i<a.length; i++) { d.FP_imgs[i]=new Image; d.FP_imgs[i].src=a[i]; }
}

function FP_getObjectByID(id,o) {//v1.0
var c,el,els,f,m,n; if(!o)o=document; if(o.getElementById) el=o.getElementById(id);
else if(o.layers) c=o.layers; else if(o.all) el=o.all[id]; if(el) return el;
if(o.id==id || o.name==id) return o; if(o.childNodes) c=o.childNodes; if©
for(n=0; n<c.length; n++) { el=FP_getObjectByID(id,c[n]); if(el) return el; }
f=o.forms; if(f) for(n=0; n<f.length; n++) { els=f[n].elements;
for(m=0; m<els.length; m++){ el=FP_getObjectByID(id,els[n]); if(el) return el; } }
return null;
}
</script>

<script type="text/javascript">
var div = "dialog";
// atribuir o nome da div que quer mostrar e ocultar

function AparecerDiv(){ // função aparecer
var strBai = $('#bairro').val();
var strQd = $('#quadra').val();
var strLt = $('#lote').val();
//alert (strQd );


<?php
//echo '<script type="text/javascript">alert(strBai);</script>';

mysql_connect('localhost','root','********');
mysql_selectdb('investimovel');

$result = mysql_query("SELECT * FROM tb_lotes Where bairro = '$bairro' and quadra = '$quadra' and lote = '$lote'");
$row = mysql_fetch_array($result);

If (!$result) {
echo "<script> alert('Erro de Informação');</script>";
}
Else {
//Estas variáveis vao para a div id="dialog"
$lograd = $row['logradouro'];
$quadra = $row['quadra'];
$lote = $row['lote'];
$area = $row['area'];
$frente = $row['frente'];
$lateral = $row['lateral'];
$coord20 = $row['coord20'];
}
?>

document.getElementById(div).style.display = "block";
}
</script>

</head>

<body onload="FP_preloadImgs(/*url*/'button8.jpg', /*url*/'button7.jpg', /*url*/'button9.jpg', /*url*/'button10.jpg')" bgcolor="#000000">
<table border="1" width="100%" id="table1"><tr><td bgcolor="#C0C0C0">
<select name="bairro" id="bairro" style="background-color: #FFFFCC" size="1">
<option value="0" selected>Selecione o Bairro</option>

<?php


mysql_connect('localhost','root','********');
mysql_selectdb('investimovel');

$result = mysql_query("select * from tb_bairro");

while($row = mysql_fetch_array($result) ){
echo "<option value='".$row['id']."'>".$row['bairro']."</option>";
}
?>
</select>

<select name="quadra" id="quadra" style="background-color: #FFFFCC">
<option value="0">Selecione o Bairro</option>
</select>

<select name="lote" id="lote" style="background-color: #FFFFCC">
<option value="0">Selecione a quadra</option>
</select>

&nbsp;
<!-- a href="http://google.com" target="iframe1"-->
<!-- a href="http://wikimapia.org...1&z=20&l=9&m=b" target="iframe1"-->
<img border="0" id="img2" src="button11.jpg" Top="200" height="20" width="100" alt="Localizar" fp-style="fp-btn: Embossed Rectangle 1" fp-title="Localizar" onmouseover="FP_swapImg(1,0,/*id*/'img2',/*url*/'button9.jpg')" onmouseout="FP_swapImg(0,0,/*id*/'img2',/*url*/'button11.jpg')" onmousedown="FP_swapImg(1,0,/*id*/'img2',/*url*/'button10.jpg')" onmouseup="FP_swapImg(0,0,/*id*/'img2',/*url*/'button9.jpg')" onclick="AparecerDiv()"></a>
<!-- img border="0" id="img2" src="button11.jpg" Top="200" height="20" width="100" alt="Localizar" onclick="AparecerDiv()"></a-->

</tr></td>
</table>

<iframe name="iframe1" src="http://wikimapia.org...7&z=13&l=9&m=b" width="100%" height="575"></iframe>

<!-- Dados do Lote -->
<div id="boxes">
<div id="dialog" class="window" style="background-color: #000000">
<table border="1" width="100%" id="table1"><tr>

<td bgcolor="#CCCCCC" bordercolorlight="#800000" bordercolordark="#800000">
<a href="#" class="close"><b><font color="#FF0000">Fechar [X]</font> </b></a><br />
&nbsp;&nbsp; DADOS DESTE IMOVEL<br/><br/>

<!-- Busca na Base de Dados -->

teste.: <? echo $n ?> <br/> <br/>

Bairro.....: <script> document.getElementById('bairro'); </script> <br/>
Endereço: <? echo $lograd ?> <br/>
Quadra...: <? echo $quadra ?> <br/>
Lote.......: <? echo $lote ?> <br/><br/>

Area.....: <? echo $area ?> m² <br/>
Frente..: <? echo $frente ?> <br/>
Lateral..: <? echo $lateral ?> <br/>
<br/>

</table></tr></td>

<!-- Atualiza Iframe -->
<!-- Zoom do mapa do lote aqui-->

</div>
</div>
</body>
</html>

----------------------------------------------------------------------------------
quadras.php

<?php
$idBairro = $_GET['bairro'];

mysql_connect('localhost','root','**********');
mysql_selectdb('investimovel');

$result = mysql_query("SELECT * FROM tb_lotes WHERE idbairro = '$idBairro' order by quadra");

$qd = '999';

while($row = mysql_fetch_array($result))
{
if ($qd != $row['quadra']) {
echo "<option value='".$row['quadra']."'>".$row['quadra']."</option>";
$qd = $row['quadra'];
}
}
?>

----------------------------------------------------------------------------------
lotes.php

<?php
$idQuadra = $_GET['quadra'];
$idBairro= $_GET['bairro'];

//echo "<script>alert($idBairro);</script>";

mysql_connect('localhost','root','**********');
mysql_selectdb('investimovel');

$result = mysql_query("SELECT * FROM tb_lotes WHERE idbairro = '$idBairro' and quadra like ".$idQuadra);

while($row = mysql_fetch_array($result))
{
$strCoord19 = $row['coord19'];

echo "<script> alert('$strCoord19');</script>";

echo "<option value='".$row['id']."'>".$row['lote']."</option>";
}
?>

------------------------------------------------------------------------------------------

Nao consigo Atualizar o Iframe com as novas coordenadas quando se clica o select bairro, quadra e o botao Localizar.
E não consigo colocar os dados do lote dentro da janela (Div) ao clicar o botao localizar.
Não sei onde esta o erro.

Quem puder me ajudar, agradeço.

Abraços

Hernani




1 user(s) are reading this topic

0 membro(s), 1 visitante(s) e 0 membros anônimo(s)

IPB Skin By Virteq