Foros del Web » Programando para Internet » Javascript »

crear tooltip en marcas de google maps

Estas en el tema de crear tooltip en marcas de google maps en el foro de Javascript en Foros del Web. Hola, estoy intentando crear un mapa con puntos en un mapa de google, ya me sale los puntos y datos si clico sobre el. Por ...
  #1 (permalink)  
Antiguo 18/01/2011, 13:17
 
Fecha de Ingreso: marzo-2006
Mensajes: 216
Antigüedad: 18 años, 8 meses
Puntos: 0
crear tooltip en marcas de google maps

Hola, estoy intentando crear un mapa con puntos en un mapa de google, ya me sale los puntos y datos si clico sobre el.

Por favor una ayuda.

LO que necesito aprender es como hacer que salga el titulo, al pasar el puntero sobre la marca dibujada en dicho mapa de google. El codigo que estoy usando y funciona bien hasta ahora:
Código PHP:
<? 
$dbname            
='xxx'//Name of the database 
$dbuser            ='xxx'//Username for the db 
$dbpass            ='xxx'//Password for the db 
$dbserver          ='localhost'//Name of the mysql server 
  

  
$dbcnx mysql_connect ("$dbserver""$dbuser""$dbpass"); 
mysql_select_db("$dbname") or die(mysql_error()); 
?> 
<html> 
 <head> 
 <meta http-equiv="content-type" content="text/html; charset=utf-8"/> 
 <title>Google Map API V3 with markers</title> 
 <style type="text/css"> 
 body { font: normal 10pt Helvetica, Arial; } 
 #map { width: 1100px; height: 650px; border: 0px; padding: 0px; } 
 </style> 
 <script src="http://maps.google.com/maps/api/js?v=3&sensor=true" type="text/javascript"></script> 
 <script type="text/javascript"> 
 //Sample code written by August Li 
 var icon = new google.maps.MarkerImage("http://maps.google.com/mapfiles/ms/micons/blue.png", 
 new google.maps.Size(32, 32), new google.maps.Point(0, 0), 
 new google.maps.Point(16, 32)); 
 var center = null; 
 var map = null; 
 var currentPopup; 
 var bounds = new google.maps.LatLngBounds(); 
 function addMarker(lat, lng, info) { 
 var pt = new google.maps.LatLng(lat, lng); 
 bounds.extend(pt); 
 var marker = new google.maps.Marker({ 
 position: pt, 
 icon: icon, 
 map: map 
 }); 
         
                    
 var popup = new google.maps.InfoWindow({ 
 content: info, 
 maxWidth: 300 
 }); 
 google.maps.event.addListener(marker, "click", function() { 
 if (currentPopup != null) { 
 currentPopup.close(); 
 currentPopup = null; 
 } 
 popup.open(map, marker); 
 currentPopup = popup; 
 }); 
 google.maps.event.addListener(popup, "closeclick", function() { 
 map.panTo(center); 
 currentPopup = null; 
 }); 
 } 
 function initMap() { 
 map = new google.maps.Map(document.getElementById("map"), { 
 center: new google.maps.LatLng(0, 0), 
 zoom: 8, 
 mapTypeId: google.maps.MapTypeId.SATELLITE, 
 mapTypeControl: true, 
 mapTypeControlOptions: { 
 style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR 
 }, 
 navigationControl: true, 
 navigationControlOptions: { 
 style: google.maps.NavigationControlStyle.SMALL 
 } 
 }); 
 <? 
 $query 
mysql_query("SELECT * FROM xxx"); 
 while (
$row mysql_fetch_array($query)){ 
 
$name=$row['name']; 
 
$lat=$row['lat']; 
 
$lon=$row['lon']; 
 
$desc=$row['desc']; 
 echo (
"addMarker($lat, $lon,'<b>$name</b><br/>$desc');\n"); 
 
 } 
 
?> 
 center = bounds.getCenter(); 
 map.fitBounds(bounds); 
  
 } 
 
 </script> 
 </head> 
 <body onload="initMap()" style="margin:0px; border:0px; padding:0px;"> 
 <div id="map"></div> 
 </html>
  #2 (permalink)  
Antiguo 18/01/2011, 13:36
Avatar de pateketrueke
Modernizr
 
Fecha de Ingreso: abril-2008
Ubicación: Mexihco-Tenochtitlan
Mensajes: 26.399
Antigüedad: 16 años, 7 meses
Puntos: 2534
Respuesta: crear tooltip en marcas de google maps

te recuerdo que la API de Google Maps no es PHP, sino Javascript... por lo tanto esta fuera de lugar tu duda...

además, Google tiene bien documentada su API, para que investigues ahí mismo y no aquí en el foro:
http://code.google.com/intl/es-419/a...reference.html
__________________
Y U NO RTFM? щ(ºдºщ)

No atiendo por MP nada que no sea personal.
  #3 (permalink)  
Antiguo 18/01/2011, 15:39
Avatar de GatorV
$this->role('moderador');
 
Fecha de Ingreso: mayo-2006
Ubicación: /home/ams/
Mensajes: 38.567
Antigüedad: 18 años, 6 meses
Puntos: 2135
Tema movido desde PHP a Javascript
  #4 (permalink)  
Antiguo 19/01/2011, 01:21
 
Fecha de Ingreso: marzo-2006
Mensajes: 216
Antigüedad: 18 años, 8 meses
Puntos: 0
Respuesta: crear tooltip en marcas de google maps

Perdon, por el error de postear en el foro incorrecto. Revise lo que dijeron, pero no se como hacer que al pasar el puntero muestre el titulo de la marca en el mapa. ¿Algun ejemplo para ver? gracias
  #5 (permalink)  
Antiguo 19/01/2011, 03:44
 
Fecha de Ingreso: marzo-2006
Mensajes: 216
Antigüedad: 18 años, 8 meses
Puntos: 0
Respuesta: crear tooltip en marcas de google maps

Bueno ya vi que hay que usar title, ejemplo:

var marker = new google.maps.Marker({
position: pt,
icon: icon,
map: map,
title:"Hello World!"




¿pero como hago para que title tome el valor guardado en la base de datos y que esta en $name??

Estoy un poco perdido en verdad.
  #6 (permalink)  
Antiguo 19/01/2011, 05:40
 
Fecha de Ingreso: marzo-2006
Mensajes: 216
Antigüedad: 18 años, 8 meses
Puntos: 0
Respuesta: crear tooltip en marcas de google maps

Estoy dando palos de ciego, hice lo siguiente sin exito, me muestra el tooltip, pero el mismo para todas las marcas que corresponde al ultimo registro:

$dbcnx = mysql_connect ("$dbserver", "$dbuser", "$dbpass");
mysql_select_db("$dbname") or die(mysql_error());

$query = mysql_query("SELECT * FROM xxx");


while ($row = mysql_fetch_array($query)){
$name=$row['name'];

}
....
..
var titulo= "<? echo($name)?>";
...
..
var marker = new google.maps.Marker({
position: pt,
icon: icon,
map: map,
title: titulo

Etiquetas: google, maps, marcas, tooltip
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 06:03.