Integrar Google Street View en Openlayers3

Question

Me pregunto si es posible integrar Google Street View en mi aplicación Openlayers3. No quiero mostrar Google Maps, sólo Street View, ya que los mapas base con los que estoy trabajando son más detallados.

Answer 1

He conseguido integrar StreetView en mi aplicación sin demasiados problemas. Se basa en la geolocalización y el código para el oyente de eventos está por debajo:

    // update streetview when the position changes.
session.Geolocation.once('change', function () {
    // Add animation to the render pipeline
    var p = session.Geolocation.getPosition();
    var coord3857 = ol.proj.transform(p, 'EPSG:3857', 'EPSG:4326');
    console.log(coord3857);
    var lon = coord3857[0];
    var lat = coord3857[1];
    svLon = lon; 
    svLat = lat;
    initialize();
});

svLon/svLat son variables globales que pueden ser utilizadas por la función de inicialización de Google StreetView que se llama al final del evento de cambio.

initialize es un método estándar de Google StreetView y es así:

function initialize() {
// Google StreetView
var panorama;

if (svLat === undefined) {
    svLat = 53.3154562;
    svLon = -2.3306616;
}

panorama = new google.maps.StreetViewPanorama(
    document.getElementById('street-view'),
    {
        position: {
            lat: svLat,
            lng: svLon
        },
        pov: { heading: 165, pitch: 0 },
        zoom: 1,
        visible: true
    });
}

También necesitarás una llamada a la API de Google Maps en tu página html en algún lugar como este:

<script async defer
    src="https://maps.googleapis.com/maps/api/js?signed_in=true&callback=initialize">

Eso es prácticamente todo lo que hay que hacer, con suerte eso debería sacar la vista de la calle con las coordenadas que has introducido. Google ref aquí