CodeAve.com CodeAve.com - Maps - Google Maps
ASP
JavaScript
CSS
HTML
Maps
·Map Script Writers
·Bing Maps
·Google Maps
·Contents
Links
Mail List
Search
Sitemap


 


Google Maps Street View Panorama
Google Maps provides 360 degree panoramic street-level views of various U.S. cities and various other locations around the world. These panoramic street-level views can easily be incorporated into your site complete with or without controls for movement within the panoramic view. In this example we feature a view of the Washington Monument in Washington, DC as viewed from Constitution Avenue near the White House ellipse. Comments within the code will help enable you to pick a view from any location that Google has online and easily adapt it into your site.
View the Output
Text View
Print View
Mail this Link

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>CodeAve.com/Maps - Google Maps Street View</title>
<link href="http://code.google.com/apis/maps/documentation/javascript/examples/standard.css" rel="stylesheet" type="text/css" />
<script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script>
<script type="text/javascript">



function initialize()
{

var location = new google.maps.LatLng(38.892106,-77.036562);
// sets the center of the map to the varible "location" that contains the coordinates


var panoramaOptions =
{
position: location,
// sets thelocation to the lat long vale set in the varible location

addressControl: true,
// Dispalys the address within the Street View Panorama
// The default is true

addressControlOptions: {
position: google.maps.ControlPosition.TOP_RIGHT,
// Places the Address Controls on the map
// BOTTOM, BOTTOM_LEFT, BOTTOM_RIGHT, LEFT, RIGHT, TOP, TOP_LEFT, TOP_RIGHT
// The default position is TOP_LEFT.

style:
{
"fontWeight": "bold",
// Sets the weight of the font in the adrress box

"color": "#0000FF",
// Color of the font for the address in HTML hex style, ie. "#0000FF"

"backgroundColor": "#FFFFCC"
// background color of the address control area in HTML hex style, ie. "#FFFFCC"
}
},

linksControl: true,
//shows the arrows and paths within the street
//true by default

enableCloseButton: false,
// If true, the close button is displayed. Disabled by default

pov:
{
heading: 160,
// The camera heading in degrees relative to true north.
// North is 0, East is 90, etc.

pitch: 10,
// The camera pitch in degrees, relative to the street view
// 90 is directly up, -90 is directly down

zoom: 1
// The zoom level. Fully zoomed-out is level 0
},

navigationControl: true,
// Enables/disables the the map navigation controls (Zoom In, Zoom Out, etc)


navigationControlOptions:
{
style: google.maps.NavigationControlStyle.DEFAULT
// ZOOM_PAN
// DEFAULT
// SMALL
// ANDROID
},


visible: true
// If true, the Street View panorama is visible on page load
};

var panorama = new google.maps.StreetViewPanorama(document.getElementById("pano"), panoramaOptions);

}
</script>
</head>
<body onload="initialize()">
<table align=center>
<tr>
<td>
<div id="pano" style="width: 640px; height: 480px"></div>
</td>
</tr>
</table>


</body>
</html>

 



ASP: What's New? | Articles | Script Writers | Database Display | Read/Write
Server Variables | Response Objects | Random Events | Miscellaneous
HTML: Forms | Hyperlinks | Headers | Tables | Hyperlinks | Headers | Text Display
JavaScript: Document Info | Forms | Images | Navigation | Script Writers
CSS: Basics | Page Display | Text Display | Script Writers | Miscellaneous
  • 2014 michael kors
  • air max women 2013
  • 2014 michael kors
  • air max 2014
  • oakley glasses
  • oakley glasses

  • Maps: Map Script Writers | Bing Maps | Google Maps
  • bottes fr
  • ugg boot
  • Privacy Statement

    CodeAve.com is hosted by MyHosting.com
    Donate Food Online with a Mouse Click at TheHungerSite.com
    Donate Land Online with a Mouse Click at TheRainForestSite.com
    © 1999 - 2017 CodeAve.com
    All Rights Reserved