Meu problema já está me incomodando por várias semanas, e procurando sem sucesso como fazer, resolvi pedir ajuda.
Meu código seve para cadastrar coordenadas no google maps juntamente com a foto de um determinado local. A foto fica salva no diretório, o nome da foto fica salvo no banco de dados juntamente com as coordenadas.
Até aí tudo bem, está feito.
Meu problema está na hora de recuperar as informações.
Eu consigo recuperar as coordenadas, colocá-las no mapa, mas até agora não consegui recuperar a imagem para exibir ao lado do mapa.
Eu até recupero a imagem, mas não consigo fazer a comparação.
Eu preciso que quando a pessoa clique no marcador no google maps, ele exiba a imagem do lado. Mas meu código não funciona....
Por favor, me ajudem... preciso entregar o projeto e não consigo terminá-lo! :(
//Recupera as coordenadas do banco e salva na variável $locations
$sql = 'Select nome, latitude, longitude from mapa';
$result = mysql_query($sql);
$locations=array();
while($data=mysql_fetch_assoc($result)){
$locations[]=$data;
}
//Recupera o nome e a foto e salva na variável $imagens
Pergunta
aginatto
Olá amigos!
Meu problema já está me incomodando por várias semanas, e procurando sem sucesso como fazer, resolvi pedir ajuda.
Meu código seve para cadastrar coordenadas no google maps juntamente com a foto de um determinado local. A foto fica salva no diretório, o nome da foto fica salvo no banco de dados juntamente com as coordenadas.
Até aí tudo bem, está feito.
Meu problema está na hora de recuperar as informações.
Eu consigo recuperar as coordenadas, colocá-las no mapa, mas até agora não consegui recuperar a imagem para exibir ao lado do mapa.
Eu até recupero a imagem, mas não consigo fazer a comparação.
Eu preciso que quando a pessoa clique no marcador no google maps, ele exiba a imagem do lado. Mas meu código não funciona....
Por favor, me ajudem... preciso entregar o projeto e não consigo terminá-lo! :(
//Recupera as coordenadas do banco e salva na variável $locations
$sql = 'Select nome, latitude, longitude from mapa';
$result = mysql_query($sql);
$locations=array();
while($data=mysql_fetch_assoc($result)){
$locations[]=$data;
}
//Recupera o nome e a foto e salva na variável $imagens
$sql = 'Select nome, foto from mapa';
$result = mysql_query($sql);
$imagens=array();
while($data=mysql_fetch_assoc($result)){
$imagens[]=$data;
}
?>
<script type=text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>'>http://maps.google.com/maps/api/js?sensor=false"></script>
<script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script>
<body>
<div id="tudo">
<div id="header" class="container">
<div id="menu">
<ul>
<li><a href="index.php"> <?php echo $menu_index;?> </a></li>
<li><a href="empresa.php"> <?php echo $menu_empresa;?> </a></li>
<li class="current_page_item"><a href="clientes.php"> <?php echo $menu_clientes;?> </a></li>
<li><a href="produtos.php"> <?php echo $menu_produtos;?> </a></li>
<li><a href="contato.php"> <?php echo $menu_contato;?> </a></li>
</ul>
</div>
</div>
<div id="masterconteudo">
<a href="#" class="show_hide">Show/hide</a>
<!--MAPA DO GOOGLE MAPS-->
<div id="map" style="width: 500px; height: 400px;"></div>
<!--FIM DO MAPA DO GOOGLE MAPS-->
//Cria um array com as coordenadas das imagens do banco
<script>
var imagens = [
<?php
foreach($imagens as $img){
echo '[\'' . $img['nome] .'\',' . $img['foto'] . ',' ."],\r\n";
}
?>
</script>
<!--JAVASCRIPT DO GOOGLE MAPS-->
<script type=text/javascript">
//Cria um array das coordenadas, já dentro da API do google maps
var locations = [
<?php
foreach($locations as $location){
echo '[\'' . $location['nome] .'\',' . $location['latitude'] . ',' . $location['longitude'] .',' ."],\r\n";
}
?>
];
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 5,
center: new google.maps.LatLng(-25.92, -49.25),
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var infowindow = new google.maps.InfoWindow();
var image = 'img/g.png';
var marker, i;
//Google maps cria os marcadores
for (i = 0; i < locations.length; i++) {
marker = new google.maps.Marker({
position: new google.maps.LatLng(locations[1], locations[2]),
map: map,
icon: image
});
//Aqui fica o evento click do google maps
google.maps.event.addListener(marker, 'click', (function(marker, i) {
return function() {
infowindow.setContent(locations[0]);
//Aqui eu tento comparar as variáveis $imagens com $location
var k;
for (j = 0; j < imagens.length; j++) {
if (imagens[j] == locations){
k = $image[foto];
}
};
//Aqui eu insiro o nome da imagem recuperada do banco para que altere a imagem principal com o click.
document.getElementById("imagem1").src="img/mapa/"k"";
infowindow.open(map, marker);
}
})(marker, i));
}
</script>
<!--FIM DO JAVASCRIPT DO GOOGLE MAPS-->
<div id="conteudo">
<div id="bg" height="100px" width="100px">
Teste
<img src="img/mapa/1.jpg" alt="Imagem1" id="imagem1" />
</div>
<center>
<br>
<br>
<?php echo $conteudo;?>
</div>
</div>
</div>
</body>
<footer>
<?php include 'rodape.php'; ?>
</footer>
</html>
Editado por aginattoLink para o comentário
Compartilhar em outros sites
0 respostass a esta questão
Posts Recomendados
Participe da discussão
Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.