[Google Maps API v3] Street View deets please!

[Brad]

No problems here - just wanted to say thanks to the Google Maps API v3
team for all your hard work, and most especially for releasing Street
View support. AND it's in HTML 5 instead of Flash - SWEET! I just
had one question (and yes I know I'm impatient) - but any details on
when the docs will be updated with the new Street View options and
stuff? I've deduced from the announcement and a few other sites that
it can be as simple as adding "streetViewControl:true" to the
mapOptions params, but was also hoping to get my hands dirty with some
more of the advanced stuff and get it all integrated into the
"PHPGoogleMapAPI Class" that I'm updating that's now using V3 (http://
code.google.com/p/php-google-map-api). Thanks again!

--
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 google-map...@googlegroups.com.
To unsubscribe from this group, send email to google-maps-js-a...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/google-maps-js-api-v3?hl=en.

[Ben Appleton]

Sorry for the delay - we're releasing a bunch of new features at Google I/O and trying to sync docs launches.  Street View docs should be out by tonight.

[Brad]

Awesome - just for reference as well, since V3 is now the "official"
version, will the docs link be http://code.google.com/apis/maps/documentation/v3/
or will we be able to find them at the "base" url
http://code.google.com/apis/maps/documentation/ (ie sans "/v3/") and
move v2 docs to their own folder? Thanks again - and don't be sorry,
you guys ROCK!

On May 19, 3:14 pm, Ben Appleton <apple...@google.com> wrote:
> Sorry for the delay - we're releasing a bunch of new features at Google I/O
> and trying to sync docs launches.  Street View docs should be out by
> tonight.
>

> On 19 May 2010 13:15, "Brad" <b...@mycnl.com> wrote:
>
> No problems here - just wanted to say thanks to the Google Maps API v3
> team for all your hard work, and most especially for releasing Street
> View support.  AND it's in HTML 5 instead of Flash - SWEET!  I just
> had one question (and yes I know I'm impatient) - but any details on
> when the docs will be updated with the new Street View options and
> stuff?  I've deduced from the announcement and a few other sites that
> it can be as simple as adding "streetViewControl:true" to the
> mapOptions params, but was also hoping to get my hands dirty with some
> more of the advanced stuff and get it all integrated into the
> "PHPGoogleMapAPI Class" that I'm updating that's now using V3 (http://
> code.google.com/p/php-google-map-api).  Thanks again!
>
> --
> 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 google-map...@googlegroups.com.
> To unsubscribe from this group, send email to

> google-maps-js-a...@googlegroups.com<google-maps-js-api-v3%2Bunsu...@googlegroups.com>
> .
> 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 google-map...@googlegroups.com.
> To unsubscribe from this group, send email to google-maps-js-a...@googlegroups.com.

> For more options, visit this group athttp://groups.google.com/group/google-maps-js-api-v3?hl=en.

[Thor (Google Employee)]

Hi Brad,

We've launched a completely restructured set of documentation today
that adds a new home page which spans all of the various APIs, a
separate home page for web services, and a new URL for the v3 API:

http://code.google.com/apis/maps/documentation/javascript/

The v2 docs are still available, but have moved to:

http://code.google.com/apis/maps/documentation/javascript/v2/

Many thanks,

Thor.

On May 20, 7:23 am, Brad <b...@mycnl.com> wrote:
> Awesome - just for reference as well, since V3 is now the "official"

> version, will the docs link behttp://code.google.com/apis/maps/documentation/v3/
> or will we be able to find them at the "base" urlhttp://code.google.com/apis/maps/documentation/(ie sans "/v3/") and

> move v2 docs to their own folder?  Thanks again - and don't be sorry,
> you guys ROCK!
>
> On May 19, 3:14 pm, Ben Appleton <apple...@google.com> wrote:
>
>
>
>
>
> > Sorry for the delay - we're releasing a bunch of new features at Google I/O
> > and trying to sync docs launches.  Street View docs should be out by
> > tonight.
>
> > On 19 May 2010 13:15, "Brad" <b...@mycnl.com> wrote:
>
> > No problems here - just wanted to say thanks to the Google Maps API v3
> > team for all your hard work, and most especially for releasing Street
> > View support.  AND it's in HTML 5 instead of Flash - SWEET!  I just
> > had one question (and yes I know I'm impatient) - but any details on
> > when the docs will be updated with the new Street View options and
> > stuff?  I've deduced from the announcement and a few other sites that
> > it can be as simple as adding "streetViewControl:true" to the
> > mapOptions params, but was also hoping to get my hands dirty with some
> > more of the advanced stuff and get it all integrated into the
> > "PHPGoogleMapAPI Class" that I'm updating that's now using V3 (http://
> > code.google.com/p/php-google-map-api).  Thanks again!
>
> > --
> > 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 google-map...@googlegroups.com.
> > To unsubscribe from this group, send email to

> > google-maps-js-a...@googlegroups.com<google-maps-js-api-v3%2B unsub...@googlegroups.com>

[Marc Ridey]

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
},
...
],
...
};
});

[Brad]

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

[Harry G. Osoff]

Is there an issue with using markers with the traffic overlay.

I can get the marker code and traffic to work separately
but have no success with both together.

thanks

Harry Osoff
Web Developer
Harry Osoff Designs

[Chad Killingsworth]

Can you post a link to your site?

Chad Killingsworth

[Al]

I don't think the xxx.getVisible() is working correctly. If I display
a place without a street view I would think that it should return
false. The best I can tell it always returns true.

A sample good display is at: http://m.vpike.com/?p=pgh&submit=Streetview&r=b
A sample failing display is at: http://m.vpike.com/?p=lax&submit=Streetview&r=b

Possibly there is a coding error. Please take a look at it.

Thanks,
Al


On May 21, 9:05 pm, Chad Killingsworth

> For more options, visit this group athttp://groups.google.com/group/google-maps-js-api-v3?hl=en.- Hide quoted text -
>
> - Show quoted text -

[Marc Ridey]

Hi Brad,

Have a look at this too: http://blog.mridey.com/2010/05/how-to-create-and-display-custom.html

Marc