2012-05-17 17 views
6

Nuevo en Google Maps, y tampoco un experto en scripts. Gracias de antemano por cualquier ayuda que pueda brindar.Google Maps Places api, ¿cómo obtengo el contenido estándar de infowindow desde un marcador?

Estoy colocando un mapa de Google en una página de ubicaciones de tiendas. Logré obtener el mapa para mostrar el marcador que quiero para la ubicación de la tienda utilizando la búsqueda. Ahora quiero que la ventana de información se rellene para que se vea como la ventana estándar de google. Pero al usar el código que pude encontrar en la biblioteca de lugares, los resultados aparecen sin formato, sin saltos de línea, y muestra errores si falta una pieza, etc ... He buscado y no encontré nada que me ayudó - así que, por favor, perdónenme si esto ya está respondido, y he leído muchas veces la biblioteca de lugares de google, así que o soy muy exigente o simplemente no abordan esta pregunta específica.

El usuario hará clic en la ubicación de la tienda en la página y quiero mostrarle el mapa con el marcador (a través de la búsqueda creo que puedo lograrlo) y quiero que la información de la tienda aparezca en el InfoWindow cuando hacen clic en el marcador (preferiblemente, me gustaría que la ventana de información ya se haya abierto, pero tampoco pude encontrar nada al respecto). Como soy nuevo en el sitio, no puedo publicar una imagen de la ventana de información, así que espero que no sea necesario. Al igual que el sitio web de mapas de Google, quiero un nombre muy bien formateado, las estrellas de reputación, una dirección formateada, número de teléfono y sitio web, junto con una imagen del negocio si existe. El ejemplo que uso a continuación es para una empresa donde toda esta información existe dentro de google. El código que tengo actualmente para el mapa está incluido.

No responda simplemente para dirigirme de nuevo a la biblioteca de lugares; si eso es todo lo que tienes, entonces no está ayudando. Necesito alguna aclaración e idealmente un ejemplo. Gracias.

<script type="text/javascript"> 
    var map; 
    var service; 
    var infowindow; 

    function initialize() { 
    var mvale = new google.maps.LatLng(40.708572,-74.017385); 

    map = new google.maps.Map(document.getElementById('map_canvas'), { 
     mapTypeId: google.maps.MapTypeId.ROADMAP, 
     center: mvale, 
     zoom: 16 
    }); 

    var request = { 
     location: mvale, 
     radius: '500', 
    keyword: "Michelle Vale" 
    }; 

    infowindow = new google.maps.InfoWindow(); 
    var service = new google.maps.places.PlacesService(map); 
    service.search(request, callback); 
    } 

    function callback(results, status) { 
    if (status == google.maps.places.PlacesServiceStatus.OK) { 
     for (var i = 0; i < results.length; i++) { 
     var place = results[i]; 
     createMarker(results[i]); 
    } 
    } 
    } 
    function createMarker(place) { 
     var placeLoc = place.geometry.location; 
     var marker = new google.maps.Marker({ 
      map: map, 
      position: place.geometry.location 
     }); 

     google.maps.event.addListener(marker, 'click', function() { 
      infowindow.setContent(place.name + place.rating + place.vicinity + 
      place.formatted_address + place.website); 
      infowindow.open(map, this); 
     }); 
     } 

    function openInfoWindow(id){return true;} 

    google.maps.event.addDomListener(window, 'load', initialize); 
    </script> 

Respuesta

3

finalmente localicé un cierto código para formatear la infoWindow en otro post where they were answering a question about removing the border para la infoWindow.

Aquí está mi ejemplo:

infowindow.setContent('<span style="padding: 0px; text-align:left" align="left"><h5>' + place.name + '&nbsp; &nbsp; ' + place.rating 
          + '</h5><p>' + place.formatted_address + '<br />' + place.formatted_phone_number + '<br />' + 
          '<a target="_blank" href=' + place.website + '>' + place.website + '</a></p>') ; 

También me di cuenta de cómo utilizar la función getDetails descrito en el Places Library

Todavía no sé cómo obtener la información de clasificación (I estoy usando la etiqueta pero da un error), cómo recuperar la imagen de la ubicación, y cómo eliminar el error "indefinido".

El último elemento es tener abierta infoWindow cuando el mapa carga ... Vi una publicación al respecto pero no pude conseguir que funcionase.

+0

Como no todos los lugares tienen datos de calificación, la variable 'place.rating' será' 'indefinida' si los datos no están disponibles. Debería verificar que las variables no estén '' indefinidas'' antes de usarlas. Actualmente no hay forma de recuperar la imagen de un lugar. Hay una solicitud de funciones para esto en el rastreador de problemas de la API Places aquí: http://code.google.com/p/gmaps-api-issues/issues/detail?id=3552 Haga clic en el ícono de "estrella" para notificado de cambios futuros, y para informarnos que está interesado en verlo resuelto. –

Cuestiones relacionadas