Foros del Web » Programando para Internet » Javascript »

Como ubicar puntos en un mapa google maps desde array json

Estas en el tema de Como ubicar puntos en un mapa google maps desde array json en el foro de Javascript en Foros del Web. hola amigos espero me puedan ayudar tengo que ubicar unos puntos en un map de google maps, hasta el momento tengo lo siguiente @import url("http://static.forosdelweb.com/clientscript/vbulletin_css/geshi.css"); ...
  #1 (permalink)  
Antiguo 17/10/2013, 22:18
 
Fecha de Ingreso: septiembre-2010
Mensajes: 1.853
Antigüedad: 13 años, 6 meses
Puntos: 6
Como ubicar puntos en un mapa google maps desde array json

hola amigos espero me puedan ayudar

tengo que ubicar unos puntos en un map de google maps, hasta el momento tengo lo siguiente

Código HTML:
Ver original
  1. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>  
  2.     <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?key=AIzaSyDY0kkJiTPVd2U7aTOAwhc9ySH6oHxOIYM&sensor=fals"></script>
  3. <script type="text/javascript" src="mapa.js"></script>

en mapa.js

Código Javascript:
Ver original
  1. function initialize()
  2. {
  3. var mapProp = {
  4.   center:new google.maps.LatLng(5.07,-75.52056),
  5.   zoom:5,
  6.   mapTypeId:google.maps.MapTypeId.ROADMAP
  7.   };
  8. var map=new google.maps.Map(document.getElementById("googleMap")
  9.   ,mapProp);
  10. }
  11.  
  12. google.maps.event.addDomListener(window, 'load', initialize);


Código HTML:
Ver original
  1. <div id="googleMap" align="center"style="width:300px;height:280px;" ></div>

con php estoy generando este array json

Cita:
[{"id":1,"nombre":"OLLETA","longitud":"-75.35410416666670","latitud":"4.89291416666667","v olcan_id":1,"map_id":1,"image_id":5,"descripcion": "","created_at":"2013-10-10 11:46:51","updated_at":"2013-10-10 11:59:46"},{"id":5,"nombre":"EL ALGUACIL","longitud":"-75.35259777777780","latitud":"4.96046944444444","v olcan_id":1,"map_id":1,"image_id":4,"descripcion": "","created_at":"2013-10-10 11:47:36","updated_at":"2013-10-10 14:44:07"},{"id":2,"nombre":"CISNE","longitud":"-75.34563166666670","latitud":"4.84416333333333","v olcan_id":1,"map_id":1,"image_id":5,"descripcion": "","created_at":"2013-10-10 11:47:07","updated_at":"2013-10-10 14:54:58"}]
como coloco los puntos en el mapa?

amigos primero debo mediante javascript atrapar el array json?

Última edición por Montes28; 17/10/2013 a las 23:43
  #2 (permalink)  
Antiguo 18/10/2013, 01:08
Avatar de Carlangueitor
Moderador ლ(ಠ益ಠლ)
 
Fecha de Ingreso: marzo-2008
Ubicación: México
Mensajes: 10.037
Antigüedad: 16 años, 1 mes
Puntos: 1329
Respuesta: Como ubicar puntos en un mapa google maps desde array json

¿Que encontraste en la documentación de Google maps?
__________________
Grupo Telegram Docker en Español
  #3 (permalink)  
Antiguo 18/10/2013, 23:47
 
Fecha de Ingreso: septiembre-2010
Mensajes: 1.853
Antigüedad: 13 años, 6 meses
Puntos: 6
Respuesta: Como ubicar puntos en un mapa google maps desde array json

amigos ya le pongo marcadores al mapa pero me falta que al darle click aparezca la InfoWindow

Código Javascript:
Ver original
  1. $(function() {
  2.         // Inicializando Google Maps Api
  3.    
  4.         // Punto de latitud y longitud usado por el api
  5.         var myLatlng = new google.maps.LatLng(4.8925, -75.32361);
  6.         // Opciones del mapa
  7.         var mapOptions = {
  8.             center: myLatlng,
  9.             zoom: 12,
  10.             mapTypeId: google.maps.MapTypeId.TERRAIN
  11.         };
  12.         var map = new google.maps.Map(document.getElementById("googleMap"), mapOptions);
  13.  
  14.         $.ajax({
  15.             url: 'http:/volcano/public/getRepetidoras/',
  16.             type: 'GET'      
  17.         }).done(function(response){
  18.             var repetidoras = JSON.parse(response);
  19.             //console.log(repetidoras);
  20.             //alert(repetidoras);
  21.  
  22.             var myIcon = new google.maps.MarkerImage("../public/img/Repetidora.png", null, null, null, new google.maps.Size(16,16));
  23.  
  24.  
  25.             $.each(repetidoras, function(index, item){                
  26.                 var marker = new google.maps.Marker({
  27.                     position: new google.maps.LatLng(item.latitud, item.longitud),
  28.                     map: map,
  29.                     title: item.nombre,
  30.                     icon: myIcon,
  31.  
  32.                 });
  33.  
  34.                
  35.             });            
  36.        });
  37.  
  38. });

alguien me puede orientar

Última edición por Montes28; 18/10/2013 a las 23:55
  #4 (permalink)  
Antiguo 08/04/2016, 13:42
Avatar de Sandala  
Fecha de Ingreso: marzo-2016
Ubicación: México
Mensajes: 5
Antigüedad: 8 años, 1 mes
Puntos: 0
Respuesta: Como ubicar puntos en un mapa google maps desde array json

Montes28, cómo le hiciste? Yo quiero hacer exactamente los mismo, tengo mi mapa y mis datos para pintar los puntos en un archivo JSON como el tuyo, sólo que no entiendo muy bien la estructura y ya me he agotado en buscarlo.

No logro entenderlo ya que es la primera vez que hago esto

Etiquetas: ajax, google, jquery, js, json, mapa, maps, php, puntos, ubicar
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.
Tema Cerrado




La zona horaria es GMT -6. Ahora son las 20:02.