Visitas virtuales en Infocampus con StreetView. Datos técnicos
Si ayer os informábamos de la nueva opción incluida en el portal de anuncios de Infocampus para poder realizar visitas virtuales, hoy vamos a contaros cómo se puede conseguir integrar el sitema de Google Street View en una página web, solventando el problema de determinar si una coordenada pertenece a una ciudad disponible en Street View.
Primeros pasos
En nuestro ejemplo, vamos a tener dos capas: una para el mapa y otra para el Street View, de manera que cuando se pinche en un punto del mapa, mostremos ese punto en la capa de Street View:
- <div id=”mapa” style=”width:400px; height:150px;”></div>
- <div id=”pano” style=”width:400px; height:150px;”></div>
En javascript, cuando detectamos si el navegador es compatible con Google Maps, le decimos a la API que la capa con id pano va a ser una vista Street View. Además, mostramos un mensaje de error en caso de que el navegador del usuario no tuviera Flash (requerido para Street View). Por último, añadimos el listener para cuando se pinche en un punto del mapa, se muestre la calle en Street View.
- // función que se ejecutará en caso de error
- function handleNoFlash(errorCode) {
- if (errorCode == FLASH_UNAVAILABLE) {
- alert(”Error: Flash no encontrado”);
- return;
- }
- }
- if (GBrowserIsCompatible()) {
- var myPano = new GStreetviewPanorama(document.getElementById(”pano”));
- GEvent.addListener(myPano, “error”, handleNoFlash);
- … (crear el mapa con new GMap2, añadir controles, centrarlo…)
- // al hacer click en un punto del mapa muestra la vista Street View
- GEvent.addListener(map,”click”, function(overlay,latlng) {
- myPano.setLocationAndPOV(latlng);
- });
- }
Y ya está! Solamente con este código tendrÃais un mapa en el que al pinchar en un punto, se mostrarÃa la calle. El problema: Street View solamente está disponible en cuatro ciudades españolas: Madrid, Barcelona, Sevilla y Valencia.
Detectar si una coordenada está disponible en Street View
Lamentablemente, Google todavÃa no tiene nada que te indique si una coordenada está disponible en Street View, por lo que debemos construirnos un sistema que lo detecte.
Utilizando las llamadas HTTP a Google, y con la nueva opción de geocodificación inversa (obtener una dirección a partir de un par latitud/longitud) podemos conocer el paÃs, provincia, localidad e incluso dirección de un punto, por lo tanto consultando estos valores podemos saber si un punto está disponible para Street View.
Si realizamos una llamada a http://www.google.es/maps/geo?output=xml&oe=utf8&ll=41.442041,2.18749 obtendremos un XML, que nos indicará que se corresponde con la dirección: Plaça de Mossèn Clapés, 08030, Barcelona, España.
Ya sabemos como tener la información, ahora hay que usarla, nosotros lo haremos en PHP con ayuda de SimpleXML:
- define(’MAPS_HOST’,'www.google.es’);
- define(’GOOGLE_MAPS_KEY’,'vuestra_clave’);
- $delay=0;
- $base_url = “http://” . MAPS_HOST . “/maps/geo?output=xml&oe=utf8″ . “&key=” .GOOGLE_MAPS_KEY;
- $geocode_pending = true;
- $coordenadas=’41.442041,2.18749′;
- while ($geocode_pending) {
- $request_url = $base_url . “&ll=” . $anuncio_coordinadas;
- $xml = simplexml_load_file($request_url) or die(”url not loading”);
- $status = $xml->Response->Status->code;
- if (strcmp($status, “200″) == 0) {
- // geocodificación inversa resuelta
- $geocode_pending = false;
- $pais = $xml->Response->Placemark->AddressDetails->Country->CountryNameCode;
- $provincia = $xml->Response->Placemark->AddressDetails->Country->AdministrativeArea->SubAdministrativeArea->SubAdministrativeAreaName;
- $localidad = $xml->Response->Placemark->AddressDetails->Country->AdministrativeArea->SubAdministrativeArea->Locality->LocalityName;
- if ($pais_mapa==’ES’ && (
- ($provincia_mapa==’Madrid’ && $localidad_mapa==’Madrid’) || ($provincia_mapa==’Barcelona’ && $localidad_mapa==’Barcelona’) ||
($provincia_mapa==’Valencia’ && $localidad_mapa==’Valencia’) ||
($provincia_mapa==’Sevilla’ && $localidad_mapa==’Sevilla’)
)) { - // tiene streetview disponible!!
- $streetview=1;
- }
- } else if (strcmp($status, “620″) == 0) {
- // se reduce la velocidad de peticiones
- $delay += 100000;
- } else {
- // fallo al realizar la geocodificación inversa
- $geocode_pending = false;
- }
- usleep($delay);
- }
- }
Nos quedarÃa en la variable $streetview un 1 si está disponible en ese punto, o un 0 si no lo está. Si tenemos varios mapas es recomendable guardar esta información, para evitar tener que estar resolviendo siempre si el mapa va a tener Street View disponible.
Esta solución es obviamente mejorable en dos sentidos: Google proporcionará una manera de conocer si un punto está disponible en Street View, lo que nos facilitará mucho la tarea, y por otra parte, mientras no añada esta opción, y se vayan añadiendo ciudades, este código puede volverse muy engorroso.
Recordad que podeis ver el ejemplo funcionando en alguno de los anuncios de Infocampus: por ejemplo, http://anuncios.infocampus.es/anuncio/2008-11-04-30-alquilo-piso-en-el-barrio-de-sant-andreubarcelona




























Google Street View: ¿cómo saber si un punto latitud/longitud está disponible en Street View? dijo
6 de Noviembre del 2008 a las 2:08 pm
[...] Google Street View: ¿cómo saber si un punto latitud/longitud está disponible en Street View?blog.infocampus.es/2008/11/06/visitas-virtuales-en-infocampu… por mierda hace pocos segundos [...]