Search code examples
jquerygoogle-mapsjquery-pluginsgoogle-maps-api-3jquery-gmap3

GMap: initialize Streetview ONLY (without roadmap)


I am using "Gmap3" Jquery Plugin and am trying to initialize a streetview only, without the combination of street view and roadmap and without the possibility to toggle between street view and map. Gmap3 only has the following 2 examples in their documentation (http://gmap3.net/api/set-street-view.html):

Shows a roadmap and a streetview:

var fenway = [42.345573,-71.098326];
$('#test1').gmap3(
{ action:'init',
   zoom: 14,
   mapTypeId: google.maps.MapTypeId.ROADMAP,
   streetViewControl: true,
   center: fenway
}, 
{ action:'setStreetView',
   id: 'test1-streetview',
options:{
   position: fenway,
   pov: {
     heading: 34,
     pitch: 10,
     zoom: 1
     }
   }
});

or to toggle between roadmap and street view:

$('#test2').gmap3({
   action:'init',
   zoom: 18,
   mapTypeId: google.maps.MapTypeId.ROADMAP,
   streetViewControl: false,
   center: [40.729884, -73.990988]
});

$('#test2-toggle').click(function(){
$('#test2').gmap3({
   action:'getStreetView',
   callback:function(panorama){
     var visible = panorama.getVisible();
     if (visible) {
       panorama.setVisible(false);
     } else {
       var map = $(this).gmap3('get');
       panorama.setPosition(map.getCenter());
       panorama.setPov({
       heading: 265,
       zoom:1,
       pitch:0}
   );
panorama.setVisible(true);
}
}
});
});

But I am sorry, I tried around but could not find a working solution, how to just init a street view in a div #streetview.

I appreciate very much any help, thank you in advance!


Solution

  • I don't know this jquery plugin, to be honest, but have you just tried it using the Maps API?

    https://developers.google.com/maps/documentation/javascript/streetview

    https://google-developers.appspot.com/maps/documentation/javascript/examples/streetview-embed