Marc, Thanks for the thorough response - much appreciated!
I've just filed a bug as I noticed that setPosition isn't working entirely the same as it was before/ as expected. What's more is that the bug is actually kinda affecting your guys' own demo (http:// code.google.com/apis/maps/documentation/javascript/examples/streetview- simple.html ) - if I'm not mistaken, isn't the point of this map supposed to display "a map of Boston with an initial view of Fenway Park"? If so, it's not displaying the initial view. The bug I've filed can be found at http://code.google.com/p/gmaps-api-issues/issues/detail?id=2401 Keep up the good work! Thanks, Brad On May 20, 11:14 pm, Marc Ridey <[email protected]> wrote: > Hi Brad, > > Here's my notes on how to use Street View in Maps Javascript API v3. > I'm hoping to blog in more details but i'm still recovering from the > launch and Google IO. > We'll also publish demo pages soon. > > Enabling and initializing Street View > ===================================== > > How to enable StreetView > > map.set('streetViewControl', true); > > or > > map.setOptions({ > streetViewControl: true > > }); > > How to access the panorama in the map > > var panorama = map.getStreetView(); > > How to know if the panorama is displayed > > var panoramaDisplayed = panorama.getVisible(); > > How to set a manual Pano Id > > panorama.setPano('-gfXi6db7jFB-cwAkTbBgA'); > > or > > panorama.setOptions({ > pano: '-gfXi6db7jFB-cwAkTbBgA' > > }); > > How to set a manual position > > panorama.setPosition(new google.maps.LatLng(48.85969, 2.29720)); > > or > > panorama.setOptions({ > position: new google.maps.LatLng(48.85969, 2.29720) > > }); > > How to set the point of view > > panorama.setPov({heading:30, pitch:0, zoom:4}); > > or > > panorama.setOptions({ > pov: {heading:30, pitch:0, zoom:4} > > }); > > How to create a panorama without a map > > var div = document.getElementById('panoramadiv'); > var panorama = new google.maps.StreetViewPanorama(div); > > How to have a separate panorama next to the map > > var div = document.getElementById('panoramadiv'); > var panorama = new google.maps.StreetViewPanorama(div); > map.setStreetView(panorama); > > or > > var div = document.getElementById('panoramadiv'); > var panorama = new google.maps.StreetViewPanorama(div); > map.setOptions({ > streetView: panorama > > }); > > Events > ====== > > How to monitor changes to pano Id > > google.maps.event.addListener(panorama, 'pano_changed', function() > {}); > > How to monitor changes to position > > google.maps.event.addListener(panorama, 'position_changed', function() > {}); > > How to monitor changes to the point of view > > google.maps.event.addListener(panorama, 'pov_changed', function() {}); > > Markers, InfoWindows and Custom Overlays > ========================================= > > How to add a marker in the panorama > > var marker = new google.maps.Marker(); > marker.setMap(panorama); > > How to add an infowindow in the panorama > > var infowindow = new google.maps.InfoWindow(); > infowindow.open(panorama); > > how to add a custom overlay in the panorama > > function CustomOverlay() {}; > CustomOverlay.prototype = new google.maps.OverlayView; > var customOverlay = new CustomOverlay(); > customOverlay.setMap(panorama); > > Controls > ======== > > How to show/hide the address control > > panorama.set('addressControl', true/false); > > or > > panorama.setOptions({ > addressControl: true/false > > }); > > how to style the address control in the panorama > > panorama.setOptions({ > 'addressControlOptions': { > 'style': { > 'border': '1px solid red', > 'backgroundColor': 'blue' > }, > ... > } > > }); > > how to position the address control in the panorama > > panorama.setOptions({ > 'addressControlOptions': { > 'position': google.maps.ControlPosition.TOP_RIGHT, > ... > } > > }); > > How to show/hide the links control > > panorama.set('linksControl', true/false); > > or > > panorama.setOptions({ > linksControl: true/false > > }); > > How to add a link in the links control > > var links = panorama.getLinks(); > links.push({ > 'yaw': 150, > 'description' : 'For Sale', > 'pano' : 'entrance', > 'roadColor': 'blue', > 'roadOpacity': 0.4 > > }); > > then > > panorama.setLinks(links); > > or > > panorama.setOptions({ > links: links > > }); > > or > > panorama.notify('links'); > > how to add a custom control in the panorama > > var aLink = document.createElement('a'); > aLink.innerHTML = "Hello"; > aLink.href = "http://google.com"; > panorama.controls[google.maps.ControlPosition.BOTTOM].push(aLink); > > How to show/hide the close button > > panorama.set('enableCloseButton', true/false); > > or > > panorama.setOptions({ > enableCloseButton: true/false > > }); > > How to detect the close button has been clicked > > google.maps.event.addListener(panorama, 'closeclick', function() {}); > > How to show/hide the Navigation controls > > panorama.set('navigationControl', true/false); > > or > > panorama.setOptions({ > navigationControl: true/false > > }); > > How to select the style and position of the navigation controls > > panorama.set('navigationControlOptions', { > position: google.maps.ControlPosition.TOP_LEFT, > style: google.maps.NavigationControlStyle.ZOOM_PAN > > }); > > or > > panorama.setOptions({ > navigationControlOptions: { > position: google.maps.ControlPosition.TOP_LEFT, > style: google.maps.NavigationControlStyle.ZOOM_PAN > } > > }); > > Custom Panorama > =============== > > How to display a custom panorama > > panorama.registerPanoProvider(function(pano) { > return { > location: { > pano: pano, > }, > tiles: { > tileSize: new google.maps.Size(256, 256), > worldSize: new google.maps.Size(256 * 64, 256 * 32), > originHeading: 110, > getTileUrl: function(pano, zoom, x, y) { > return 'http://someurl/somepath/'+ pano + '/' + zoom + '_' + > x + '_' + y + '.png'; > } > } > }; > > }); > > How to set the address text in a custom panorama > > panorama.registerPanoProvider(function(pano) { > return { > location: { > ... > description: 'Address Text' > }, > ... > }; > > }); > > How to set the copyright in a custom panorama > > panorama.registerPanoProvider(function(pano) { > return { > copyright: 'Copyright text', > ... > }; > > }); > > How to set the links in a custom panorama > > panorama.registerPanoProvider(function(pano) { > return { > links: [ > { > 'heading': 171, > 'description' : 'Link Text 1', > 'pano' : '5pXLKKqtDowwU0mrpx8pWw' > }, > { > 'heading': 351, > 'description' : 'Link Text 2', > 'pano' : '0682ricVXBNcNuEcpSb-rA' > } > ], > ... > }; > > }); > > How to set specify the color and opacity of a link in a custom > panorama > > panorama.registerPanoProvider(function(pano) { > return { > links: [ > { > ... > 'roadColor' : '#0020C0', > 'roadOpacity' : 0.6 > }, > ... > ], > ... > }; > > }); > > -- > You received this message because you are subscribed to the Google Groups > "Google Maps JavaScript API v3" group. > To post to this group, send email to [email protected]. > To unsubscribe from this group, send email to > [email protected]. > For more options, visit this group > athttp://groups.google.com/group/google-maps-js-api-v3?hl=en. -- You received this message because you are subscribed to the Google Groups "Google Maps JavaScript API v3" group. To post to this group, send email to [email protected]. To unsubscribe from this group, send email to [email protected]. For more options, visit this group at http://groups.google.com/group/google-maps-js-api-v3?hl=en.
