Enable Street View mode with Javascript function

Navigation
0

How to call Google Maps panorama mode via API?

Using JS, you can parameterize and display Google Maps in a custom way: 

//Setup Maps
function initialize(){

  var geoLatLong = {lat:-23.5615129,lng:-46.6581976};

  var mapOptions = {
    zoom: 15,
    disableDefaultUI: true,    
    center: geoLatLong,
    mapTypeId: google.maps.MapTypeId.ROADMAP,
    scrollwheel: false,
    streetViewControl: true,
    mapTypeControl: false
  };
  
  var map = new google.maps.Map(document.getElementById('divparamaps'),mapOptions);
  
  var image = 'logo.png';

  var pinPersonalizado = new google.maps.Marker({
    position: geoLatLong,
    map: map,
    icon: image,
    title: 'Masp Museu de Arte de São Paulo Assis Chateubriand - Avenida Paulista, São Paulo - SP',
    animation: google.maps.Animation.DROP
  });
}

//Após o carregamento do Document, chama o maps
google.maps.event.addDomListener(document, "load", initialize);
<!-- Considerar o import da API no Header -->
<div id="divparamaps"></div>

In case, to call Street View Mode, you can use the conventional way of Google Maps (Dragging the yellow doll up to a point that accepts Panorama view), but would like to know how to call via DOM.

I believe I could link an Event to Mark / Pin like this: 

pinPersonalizado.addListener('click', function() {
      // Chama Street View
});

But I can not understand how this will happen. I tried some of the ways that did not work.

If someone has already used this practice, please share! If I am traveling and this is impossible, please also alert me and I will remove the question to avoid problems!

    
asked by anonymous 14.12.2015 / 17:13

1 answer

0

Well,

Developing the question, I found the answer!

Just call the panorama mode the same way you called Maps. But now, instead of tying to the page load event, for example, just call it in the event you want:

Ex: 

pinPersonalizado.addListener('click', function() {
  var panorama = new google.maps.StreetViewPanorama(
  document.getElementById('divparamaps'), {
     position: {lat:-23.6331987,lng:-46.6917166},
     pov: {
       heading:0,
       pitch:0
     },
     zoom:0,
     visible: true
   });
});

This will replace the MAPS instance created with the upload (following the one defined during the question).

Here's the link to the full explanation of how to use Google Street View: link

The link also contains parameter definitions for customization.

    
14.12.2015 / 17:48
Allow only one instance Difficulty in making RewriteEngine work