Ya tengo un rato manejando la API JavaScript de Google Maps pero ahora con su cambio a la v3 hay cosas que cambiaron y hay que adaptarse, entonces se me ocurrió compartirles lo que vaya aprendiendo desde cero, de cualquier manera pueden leer si así lo desean, toda la documentación oficial de la API de Google Maps.
Lo que voy a intentar hacer es ir al grano del tema del post, para no dar tantas vueltas y quitar toda la paja que viene en la documentación… “Directo y a la cabeza” dicen por ahí.
Para iniciar será necesario y preferente que tengan un poco de conocimiento principalmente de JavaScript y jQuery, asímismo de HTML y un poco de CSS, igual unas pequeñas nociones de HTML5 nos servirán en publicaciones posteriores.
Para empezar hay que declarar nuestra aplicación como HTML5, sencillamente escribiendo el DOCTYPE así:
<!DOCTYPE html>
También para estos ejemplos es necesario incluir los scripts de jQuery, para este dirígete a su sitio oficial, descárgalo y agrega el script, y claro el más importante de estos ejemplos, el script de Google Maps, que para la v3 no es necesario generar una key como en la versión 2 se hacía, ahora solamente agregas el siguiente script:
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=set_to_true_or_false"></script>
Si puedes observar, al final del script dice sensor=set_to_true_or_false es para indicar si queremos que el sensor identifique la posición del usuario, debes indicar true o false según lo requiera tu aplicación.
NOTA: hay una pequeña discusión sobre la localización de los scripts, puedes ponerlos ya sea dentro del head o del body, pero muchos recomiendan que vayan antes de cerrar la etiqueta body, ya que evita que el contenido principal tarde en mostrarse, entonces… es tu decisión donde colocarlos, al final de cuentas para fines didácticos, funcionan igual en cualquier lado.
Dentro del body vamos a declarar un DIV que incluya su id y estilos para un ancho y alto donde queramos que se dibuje el mapa, debe ser algo como esto:
<div id="map_canvas" style="width: 640px; height: 400px;"></div>
Ahora vamos con las opciones del mapa, primero declaremos la latitud y longitud donde queremos que aparezca nuestro mapa de esta manera:
var myLatlng = new google.maps.LatLng(myLatitude, myLongitude)
Lo que hace esa línea de código, es que creamos una instancia de un objeto de la API de GMaps que guardará la latitud y longitud del mapa, marcador o sea lo que sea que queramos dibujar, así que recuérdenla bien para futuros usos.
Los valores pueden variar de la siguiente manera:
- myLatitude es el valor del ángulo que parte del ecuador, puede variar de 90 a -90 de norte a sur respectivamente, siendo 0 el ecuador.
- myLongitude es el valor que parte del meridiano de Greenwich, o sea a partir de Londres, Inglaterra, tomando valores que varian de -180 a 180 de este a oeste respectivamente siendo 0 en Londres.
TIP: Si quieres obtener la latitud y longitud específicos dirígete a Maps.Google.com y en los Labs, activa el marcador de latitud y longitud.
Ahora, vamos con las opciones del mapa, las vamos a declarar de la siguiente forma:
var myOptions = {
zoom: 8,
center: myLatlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
Fácil de entender, ¿no?, lo que se realiza con esto es que a myOptions se le adjuntan las opciones propias de despliegue del mapa, zoom, es el nivel de visión del mapa, el más bajo 1, el más alto puede variar, ya que en algunos lugares puede ser hasta de un nivel 25 (hasta donde he descubierto), ya dependerá de lo que quieras mostrar en tu aplicación; center, si claro, centra el mapa con la latitud y longitud que un paso antes hemos declarado con la variable myLatlng; mapTypeId es una variable que interpreta el tipo de mapa que se va a desplegar, los cuales pueden ser estos:
- ROADMAP muestra el mapa normal, el que es en 2D, si no se declara nada, este es el tipo por default.
- SATELLITE muestra las cuadros fotografiados de la superficie.
- HYBRID muestra una combinación de cuadro fotográficos, y el mapa 2D con nombres de calles y demás sobrepuesto, es como sobrevolar la superficie con todo y direcciones.
- TERRAIN muestra cuadros del relieve físico de la tierra, elevaciones, ríos, montañas, entre otros.
Lo que prosigue es crear una instancia que guarde, interprete y dibuje todas las opciones que hemos visto de un mapa, recuerden tener jQuery cargado para que les funcione este script:
var map = new google.maps.Map($("#map_canvas").get(0), myOptions);
Así creamos la instancia al mapa y le decimos que lo coloque en el DIV con el ID de map_canvas, así como las opciones que requiere el mapa para ser desplegado correctamente. La variable map nos servirá más delante para tener control sobre el mismo mapa, como dibujar marcadores, formas, líneas, etc., haciéndole referencia.
Por último vamos a colocar/dibujar un marcador, un pin, o como lo quieran llamar, es muy simple hacerlo:
var marker = new google.maps.Marker({
position: myLatlng,
map: map,
title:"Hola Mundo"
});
Estas son las opciones básicas y quizá mínimas para dibujar un marcador, para position usaremos la misma variable que usamos para centrar el mapa y colocar el marcador en el centro del mismo, map es la instancia del objeto del mapa sobre el que vamos a colocar el marcador, title es el tooltip del marcador (el que dice un texto cuando dejamos encima el puntero).
Entonces al final, el código lo colocamos en una función que llamaremos initialize, para poder llamarlo posteriormente en cualquier parte de nuestro sitio, que para el ejercicio lo haremos en cuanto se cargue el body, agregando en la etiqueta de apertura:
<body onload="initialize()">
Aunque puedes llamar la función desde cualquier otro lado, ahora si nuestro documento con todo y el script debe verse algo semejante a esto:
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=set_to_true_or_false"></script>
<script type="text/javascript">
function initialize() {
var myLatlng = new google.maps.LatLng(20.68009, -101.35403);
var myOptions = {
zoom: 8,
center: myLatlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map($("#map_canvas").get(0), myOptions);
var marker = new google.maps.Marker({
position: myLatlng,
map: map,
title:"Hola Mundo"
});
}
</script>
</head>
<body onload="initialize()">
<div id="map_canvas" style="width: 640px; height: 400px;"></div>
</body>
</html>
Es todo por esta ocasión, ya tengo otros ejercicios listos, solamente falta desglozarlos, cualquier duda, ya saben cómo contactarme :D.
Enjoy this Life!!
hola,
antes de nada gracias por el aporte 🙂
pero, he copiado y pegado el mismo código poniendo a true el lugar donde lo pide y a false tambien.
he puesto el doctype comleto:
i me sale toda la pantalla en blanco como resultado uso firefox como navegador.
alguna ayudita?m 🙂 pongo el codigo completo aquí para que te sea mas facil:
function initialize() {
var myLatlng = new google.maps.LatLng(41.899372,1.876966);
var myOptions = {
zoom: 8,
center: myLatlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map($(“#map_canvas”).get(0), myOptions);
var marker = new google.maps.Marker({
position: myLatlng,
map: map,
title:”Hola Mundo”
});
}
@Axel estás integrando jQuery y pones un div en el body donde el ID sea map_canvas?? SI puedes también colocame el HTML que estás poniendo por favor =D
hola franco yo tengo el mismo problema que el tengo una pagina donde me carga el mapa todo perfecto pero cuando utilizo ajax porque tengo un formulario principal y llamo el formulario donde se carga el mapa y lo cargo sobre un div establecido el mapa no me carga
Hola, gracias por el tuto pero llegue a este problema:
mi pagina carga sus secciones por medio de ajax en un
. pero cuando trato de cargar un mapa el script de la api no se carga. si coloco el mapa directamente en una pagina si sirve, pero cuando trato de cargarlo por medio de ajax no, puedes ayudarme con esto?
@juanalvarez9 puedes colocar la parte del código que carga el mapa, o enviármela en la parte de contacto y así poder ayudarte, saludos!
http://pastebin.com/sUHAFr0Q
ahi esta mas o menos lo que busco hacer, gracias
@juanalvarez9 Bien sencillo, te falta en el div colocar el width y height (ancho – alto) para que sepa cómo colocar el mapa, recuerda, explícito es mejor que implícito =P
hola, hice el ejemplo tal cual pero me sale en blanco.¿me podrias ayudar? cabe mencionar que no se nada de JQuery y se muy poco de JS, pero como esto me urge muchas veces no da tiempo de estudiarlo y comprenderlo al 100. Lo que hice fue descargar el JQuery me devolvio 2 carpetas dist y test las cuales coloque en donde estoy haciendo las pruebas, aqui el codigo, igual que el tuyo
function initialize() { var myLatlng = new google.maps.LatLng(20.68009, -101.35403); var myOptions = { zoom: 8, center: myLatlng, mapTypeId: google.maps.MapTypeId.ROADMAP }; var map = new google.maps.Map($(“#map_canvas”).get(0), myOptions); var marker = new google.maps.Marker({ position: myLatlng, map: map, title:”Hola Mundo” }); }
@samuel tu script está correcto, pero con respecto a lo de jQuery… agregaste la referencia al script?? lo más seguro es que ese sea el problema, que no encuentra dónde colocar el mapa porque no encuentra las librerías de jQuery, puedes en lugar de usar:
$(“#map_canvas”).get(0)
uses:
document.getElementById(“map_canvas”)
Intenta y ya nos comentas como te fue…
Muchisimas gracias!! Efectivamente no tenia bien direccionado el script(que estupido, lo corregi y aun aparecia en blanco, sustitui el $(“#map_canvas”).get(0)
por el document.getElementById(“map_canvas”) y aun asi no podia verlo, decidi volverlo a hacer de nuevo y funciono perfecto ignoro lo que paso, seguro que algo me faltaba. Te agradezco mucho tu ayuda y tus aportes, seguire viendo el resto de tus tutoriales.
Gracias por el ejemplo y la explicación! Son bastante claros. Bueno, me gustaría aportar un poquito sobre la carga de jQuery y los otros scripts. Esto es lo que yo uso para cargarlos. Nótese que en la carga del jQuery, dentro de mi proyecto tengo una carpeta llamada Scripts, y ahí están los archivos de jQuery.
Espero que sea de ayuda. Saludos!
@Ivan creo que faltó el código que nos ibas a mostrar =P
No me lo puso de nuevo :S Que raro…. :S Lo copie y pegue desde VWD, no se que paso…
@Ivan ponlo entre estos tags [ js ] [/ js ] … (sin espacios dentro de los corchetes)
<%--Agregarmos la referencia para la API jQuery--%> <script src="Scripts/jquery-1.4.1.js" type="text/javascript"> </script> <%--Agregarmos la referencia para la API Google Maps V3. Nota: sensor=false significa que no queremos que el sensor identifique nuestra posición actual--%> <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"> </script> <%--Agregarmos la referencia para la documentación para API Google Maps V3 Nota: El archivo se coloco en la carpeta Scripts de este proyecto--%> <script src="Scripts/google-maps-3-vs-1-0.js" type="text/javascript"> </script>Hola, estoy empezando a utilizar la v3 de la API de Google Maps y no consigo que me cargue con AJAX, el mapa no se muestra en la carga de la página sólo si pinchas en un enlace se muestra una ventana emergente en la que quiero mostrar el mapa pero no lo consigo, te pego el código:
function initialize() { var tierras=new google.maps.LatLng(-34.397,150.644); var myOptions={ zoom:8, center:tierras, mapTypeId: google.maps.MapTypeId.ROADMAP } var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); } function loadScript() { var script=document.createElement("script"); script.type="text/javascript"; script.src="http://maps.google.com/maps/api/js?sensor=false&callback=initialize"; document.body.appendChild(script); } window.onload(loadScript);* Esto pretendo que al cargar este archivo lanze el js pero no consigo que lo haga, podrías ayudarme.
Gracias.
@RafaVillegas El problema es que estás usando un JS que no es compatible con todos los navegadores, por ejemplo window.onload(loadScript) no funnciona en varios navegadores de última generación, hay que crear un event listener para poder echarlo a andar, te recomendaría ampliamente que usaras jQuery para varias de las cosas que pones en tu código
Hola Alex,
gracias por la respuesta, podrías echarme un mano con el jQuery? no lo he tocado nunca, no se como crear un listener, si tuvieras algún ejemplo me vendría muy bien, gracias.
@RafaVillegas pues justo es como está el ejercicio, no tiene ninguna ciencia, necesitaría saber más a detalle lo que intentas hacer para poder ayudarte, saludos…
Hola amigo, tengo una duda, quiero que aparezcan 2 punteros, ya que tengo que apuntar 2 negocios como le hago????
Me podrias resolver esa duda, te lo agradeceria mucho
@carlos bien sencillo creo que este tutorial te va a servir http://jafrancov.com/2010/09/info-window-gmaps-api-v3/ solamente es colocar 2 marcadores y listo 😉
HOLA TOCALLO, PRIMERO QUE NADA MUCHISIMAS GRACIAS POR EL APORTE ALGO MUY MUY INTERESANTE, DESPUES DE UNOS MINUTOS DE PROBLEMILLAS LO SOLUCIONE Y LO TENGO FUNCIONANDO, TENGO UNA INQUIETUD, TENGO MANERA DE SABER EL PAIS DEL QUE ME VISITAN DE ESTA MANERA?
P.D. SERA MUCHA MOLESTIA QUE ME RESPONDAS AL CORREO PORFA, Y SI NO ES AUN MUCHA MOLESTIA TODAVIA, ESTA GENEAL TU TAG CLOUD ESFERICO EN 3D, SERA QUE PUEDAS POSTEARLO?
@Alejandro No, para saber la manera en que te visitan es por medio de las IP o a menos que tengas activada la geolocalización, usa Google Analytics, ahí te da un resumen de lo que me preguntas. Del Tag Cloud es un plugin para wordpress, se llama WP-Cumulus, para Blogger ya lo tengo posteado acá. Saludos…
Buen día. Disculpe, He creado el mapa con el marcador sin problema alguno, pero yo tomo latitud y longitud desde un archivo de texto que se esta actualizando constantemente. La duda es como podría actualizar la posición del marcador sin recargar todo el mapa. Es esto posible? Gracias de ante mano.
@SalvadorOrtiz Si, es posible, la variable del marcador necesitas colocarla de manera global para poder accesar a ella y mediante algún evento (como un click, un enlace, tiempo) se actualice, y redibujar el marcador, algo más o menos así:
//declaras marker como global y la inicializas en el primer proceso o de manera global por igual //puede ser un objeto LatLng o lat y lng por separado function actualizar_marcador(lat,lng){ // Leer coordenadas desde archivo var newLatlng = new google.maps.LatLng(lat, lng); marker.setPosition(newLatlng); marker.setMap(map); map.setCenter(location); }hola alex muy bien explicado todo, te comento mi problema, quise implementar la actualizacion del marcador y no pude, me darias una mano? aca esta el codigo:
**código editado**
if (status == google.maps.GeocoderStatus.OK)
{
map.setCenter(results[0].geometry.location);
marker.setPosition(results[0].geometry.location);
actualizar_marcador(google.maps.latLng.lat(),google.maps.latLng.lng());
**código editado**
function actualizar_marcador(lat,lng){
// Leer coordenadas desde archivo
var newLatlng = new google.maps.LatLng(lat, lng);
marker.setPosition(newLatlng);
marker.setMap(map);
map.setCenter(google.maps.getCenter());
}
La función de actualizar_marcador está de más, ya que en las línea anteriores actualizas la posición del marcador (suponiendo que tienes acceso a la variable marker, es decir que sea global o pertenezca a la clase desde donde lo llamas), prácticamente quedaría así lo que resumí de tu código:
if (status == google.maps.GeocoderStatus.OK) { //actualiza la posición del marcador marker.setPosition(results[0].geometry.location); // Cambia y mueve el centro del mapa a las coord. del objeto Latlng indicado map.panTo(results[0].geometry.location); // algo adicional... }ola yo tengo una duda respecto a los marcadores, se puede agregar un enlace a otra pagina, directamente al dar clic en el marcador sin ser necesario abrir una venntana de informacion y agregar el enlace en esta?..gracias x su ayuda!!..n.n..
@aniitha si, si se puede, se crea un listener de click para el marcador, quedaría algo así:
google.maps.event.addListener(marker, 'click', function(event) { location.href = "http://alexfranco.mx"; });Hola. Muy bueno el articulo. Quisiera saber como se hace para que en lugar de un punto en el icono salga un texto.
Hice un sitio usando la interfaz de wix.com y agregue un mapa donde coloco el nombre del lugar en el icono, como estoy portando todo a html quisiera saber como se hace.
Hice uno y me sale el nro. 1.
Muchas Gracias.
No se puede colocar más de una letra o números, lo que puedes hacer es crear un marcador propio, por cada lugar, y que quede algo como en esta liga, pero más que eso no se podría, puedes colocar la info en el infowindow, así se ve más limpia la presentación
Como puedo hacer para que el resultado de los datos del mapa los coloque dentro de un componente image de gwt, estoy intentando hacer una página web, conde tiene una pestaña de contacto, donde hay un pequeño formulario para mandar un mail (que no se todavía como hacer que funcione), y un mapa con la ubicación, pero todo funciona con gwt, no utilizo el html y el xml, más que para indicar a donde dirigirse para abrir la la aplicación, es mi primer aplicación, me puedes auxiliar?
@Francisco íjole, eso es usando la parte de la API de mapas estáticos… no la he usado porque no se me ha presentado la oportunidad, pero, si me das un poco de tiempo, puedo investigar, o si puedes mándame un mail a jafrancov en gmail y te puedo guiar dónde puedes encontrar la info.
te quería desde ya la pagina esta muy bien lograda, y veo que ayudas mucho a la gente con sus dudas, yo estoy tratando de iniciarme en esto pero estoy de 0… quisiera saber si tendría que combinar con mysql si quiero hacer una pagina de busqueda de cosas… en ejemplo seria preguntar que es lo que estas buscando y dependiendo de tu geolocalizacion indicarte a cuan cerca lo tenes, con varios filtros. se entiende? como ejemplo en comida seria, que tenes ganas de comer? y un catalogo de comidas para darle con checkbox, y con tu geolocalizacion o bien poniendo tu dirección que te filtre y te aparezca solo lo seleccionado en el mapa con los restaurantes que lo hacen/venden, filtros por precios, etc.
@walter en si lo que quieres más o menos hacer es algo como Foursquare (¿lo has usado?), quizá un poco más específico pero para eso tendrías que tener un acceso a cada cosa que vende el lugar para que se mantenga actualizado. ¿Estoy en lo correcto?
Amigo quiero hacer un evento donde:
google.maps.event.addListener(map, “mouseover”, function(){
se oculte los controles
});
google.maps.event.addListener(map, “mouseout”, function(){
muetre los controles
});
le hize ne la v2 pero en la v3 no lo he logrado… por favor si puedes ayudame…
@Ricardo sencillo, tienes todos estos controles:
mapTypeControl
panControl
zoomControl
scaleControl
rotateControl
overviewMapControl
Solamente es habilitarlos o inhabilitarlos, dentro de un setOptions al mapa (la variable del mapa debe ser global o alcanzada por la función), por ejemplo:
google.maps.event.addListener(map, “mouseover”, function(){ map.setOptions({ mapTypeControl: true, panControl: true }); });Buenas amigo Alex, muy buen tutorial, quisiera que me ayudaras llevo dias buscando un codigo que me permita mostrar la ubicacion del usuario y tamb los marcadores que esten cerca del mismo.
Solo he conseguido marcadores y geolocalizacion por separado mas no un codigo que lo realice juntos.
Gracias
@Josue aún sigo escribiéndolo, no lo he terminado por tiempo, entre hoy y mañana lo termino y te aviso.
hola yo establezco los marcadores por filtros pero al selecionar un marcador se desaparecen los otros porque se vuelve a pintar nuevamente el mapa como establezco ese mapa global o que hago para que el mapa siga igual sin perder los otros marcadores mienstra los check esten activos
@Eliana la variable del mapa debe ser declarada global y dibujarse solamente una vez al cargar el sitio, quizá necesite ver un poco tu código, pero en si eso es lo principal para que funcione como debe.
Hola
Gracias por el aporte, estoy comenzando a utilizar la API de Google Maps, y me sirvio de mucho. Quisiera saber si me puedes ayudar, ya que quiero insertar en el mapa las coordenadas que estan guardadas en una base de datos o con un formulario en html.
En LatLng en lugar de poner las coordenadas como 19.2345 se puede poner una variable??, ya que realizo mi conexion a la bd con php y extraigo los datos pero como variables, pero de ahi no se como pasarlas al API
Gracias
@karen todo es posible, pero recuerda que PHP trabaja del lado del servidor y la API es javascript y este trabaja del lado del cliente, para obtener los datos e interactuar, necesitas usar ajax y exportar a XML o JSON tus datos, para que con javascript los manejes e interactuen con la API, la forma más rápida es usando el json_encode de PHP + ajax
Hola,
¿este código vale también para webs diseñadas para móviles.?
@JoseLuis Si, solamente necesitas acomodar tu CSS para que se acomode a tus necesidades
Hola: Estoy haciendo una aplicación que ubica en el mapa una dirección que esta en una base de datos de esta forma (Urquiza 1254, Rosario, Argentina). Funciona pero el problema que tengo es que cuando la dirección es incorrecta igual me ubica algo erroneo (ejemplo Urqdsd 111, Rosario, Argentina), si toda la direccion es incorrecta (ejemplo Urqwe 11,Rossasd, Rgg) entonces sí me dice no encontrado. ¿ Alquien sabe como hacer que busque la dirección exacta ?
Gracias
La API da resultados de acuerdo a lo que le envías, si envías una dirección errónea, no la encontrará, lo que puedes hacer es agregar un campo para latitud y otro para la longitud del lugar, recopilar los datos y actualizar, recuerda que Google depende de los usuarios para reportar y corregir muchos problemas como ubicaciones incorrectas, por lo que no creo tan conveniente que busques por Geocoding, ya que te acabarás muy rápido las llamadas a la API para ese servicio si tu aplicación crece.
hola, ya tengo un mapa a partir de tu buena explicacion, incluso el mapa cuenta con varios marcadores, pero como puedo hacer para filtrarlos con un select de un formulario, que al cambiar la opcion del select actualice en el mapa con los marcadores relacionados. Agradezco mucho tu ayuda.
Ouch, un poco largo para mostrar con código, te digo el proceso que yo haría, necesitas un listener de jQuery para que al cambiar la opción, con un método .live esté verificando si cambió o no la opción, en cuanto cambie, llamas la función de javascript que consultaría los marcadores (ya previamente guardados en una variable u obtenerlos en ese momento con AJAX), lo más sencillo para limpiar el mapa es volverlo a dibujar, aunque es una llamada más a la API, preferentemente guardar los marcadores dibujados en un array y quitarlos con un ciclo, y dibujar ahora si los que corresponden a la opción seleccionada.
Hola Alex, tu código me ha sorprendido ya que es sencillo, y además funciona. Puede que te sorprenda este´último comentariuo pero me descargo mucho código que no hay forma de ponerlo en marcha.
Una cosa que no entiendo es como es que funciona sin la clave API ???
Por otro lado, tu ejemploe s fantastico, pero necesito poner varios marcadores y no uno solo, me podrías echar una mano ??
@Tony Gracias, sin la clave API funciona pero es para usos muy limitados, como pruebas o ejemplos jeje, de los marcadores, depende de cómo obtengas la información o son estáticos?
Hola Alex, quiziera ver si tu me puedes ayudar, necestito colocar un marcador con un icono personalizado, pero también debo poner como 50 mas ya con el icono que da por default google, eso sería posible?
Claro, necesitas crearlo y tenerlo disponible públicamente, al crear el marcador, pon como propiedad “icon: /ruta/al/icono.png” y listo.
Podrias ayudarme en esto http://es.stackoverflow.com/questions/8637/c%C3%B3mo-a%C3%B1adir-un-cuadro-de-b%C3%BAsqueda-en-googlemap-a-mi-mapa-personalizado
Si bien entiendo y corrígeme si no es así, lo que intentas hacer es que te vaya prediciendo los lugares que tienes almacenados en tu base de datos, ¿es correcto?
Buenos dias hermano , excelente post, como pudiera tener control de ambos marker luego de que me marca la ruta y me dice el kilometraje, quisiera tener el control de poder manipular la variable de kilometraje, es posible¿?
Los resultados que arroja Google no pueden ser manipulados o cambiados a menos que cambies el origen/destino, lo que puedes hacer es capturar ese dato y manipularlo según lo que busques hacer, ¿me explico?
muy buena explicación, ¿puedes decirme que se necesita para que muestre el mapa con el trafico?
Necesitas solamente activar la capa después de cargar el mapa
hola como estas, me puedes ayudar por favor para incluir dos mapas, con diferentes posiciones del marcador en una misma pagina con la api v3, por la atencion muchas gracias…
Identifica los div con diferentes ID e inicializalos por separado, es decir:
var map = new google.maps.Map($("#map_canvas1").get(0), myOptions); var map = new google.maps.Map($("#map_canvas2").get(0), myOptions);