I am wondering if it is possible to integrate Google Street View into my Openlayers3 application. I do not want to show Google Maps, only Street View, since the base maps I am working with are more detailed.

1 Answer 1


I've managed to integrate StreetView into my app without too much trouble. It's based on geolocation and the code for the event listener is below:

    // 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');
    var lon = coord3857[0];
    var lat = coord3857[1];
    svLon = lon; 
    svLat = lat;

svLon/svLat are global variables which can be utilised by the Google StreetView initialize function which is called at the end of the change event.

initialize is a standard Google StreetView method and goes like this:

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

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

panorama = new google.maps.StreetViewPanorama(
        position: {
            lat: svLat,
            lng: svLon
        pov: { heading: 165, pitch: 0 },
        zoom: 1,
        visible: true

You'll also need a call to the Google Maps API in your html page somewhere like this:

<script async defer

That's pretty much all there is too it, hopefully that should pull up the streetview with the coords you've fed in. Google ref here

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.