efecto en google maps

felipe rojas · #1 (**permalink**) 27/05/2011, 10:45

hola
alguien sabe como se hace est e efecto para que gire automaticamente esta utilidad de google maps
http://www.airbnb.com/rooms/121393#street-view

extubo · #2 (**permalink**) 28/05/2011, 23:13

nunca lo hice.
y no tiene nada que ver con html.
es un servicio de google. y solo puedes usarlo si tu región tiene la posibilidad de street view.
(solo grandes ciudades centrales lo tienen, )
pero te dejo el enlace de google map con street view: http://maps.google.com/help/maps/streetview/
http://maps.google.com/help/maps/streetview/learn/using-street-view.html

Saludo

felipe rojas · #3 (**permalink**) 06/06/2011, 10:44

la pregunta es clara, si estoy diciendo para que gire automaticamente, quiere decir que yo puedo ver el street-view, pero no se ve el automatico,(no lo ofrece el google maps) ese es el que quiero aprender hacer. y creo que es por html por que es lo unico que te deja manipular de esta aplicacion, creo yo

inieva · #4 (**permalink**) 06/06/2011, 14:17

La pregunta es clara pero la respuesta es acertada y comprensible. Yo no pude ver el efecto en el link que dejaste pero rotar la camara del street view nada tiene que ver con HTML. Hay que programarlo utilizando el api de google maps. (JavaScript) Y lo que hay que manipular es la propiedad heading (El ángulo de la cámara) del objeto StreetViewPov que especifica la orientación de la cámara en la posición de la panorámica de Street View.

Acá te dejo la referencia: [URL="http://code.google.com/intl/es/apis/maps/documentation/javascript/reference.html#StreetViewPov"]http://code.google.com/intl/es/apis/maps/documentation/javascript/reference.html[/URL]

Y un ejemplo sencillo de cómo se puede hacer:

Código:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>Ejemplo de como rotar la camara del street view. Google Maps</title>
<script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script>
<script type="text/javascript">



  function initialize() {
    var bryantPark = new google.maps.LatLng(37.869260, -122.254811);
    var panoramaOptions = {
      position:bryantPark,
      pov: {
        heading: 165,
        pitch:0,
        zoom:1
      }
    };
    var myPano = new google.maps.StreetViewPanorama(document.getElementById("pano"), panoramaOptions);
    myPano.setVisible(true);
	

 
	setInterval(function() {

		pov=myPano.getPov();
		pov.heading++;
		myPano.setPov(pov);
		
	}, 100);


 }
</script>
</head>
<body onload="initialize()">
  <div id="pano" style="width: 425px; height: 240px"></div>
</body>
</html>