House StreetView

Please respect!

This example code uses panorama in a personal house.

Don't visit in real and monkey tricks!
Please respect the privacy of the house. Thank you!

(And special thanks for the family!)


Description

This is a demo of custom StreetView.
How to create is here.



Code

<script type='text/javascript'>
var initPosPanoID, streetView;

function initialize() {
  // Set StreetView provider.
  var streetViewOptions = {
    zoom: 0,
    panoProvider:  getCustomPanorama,
    pano : "frontyard"
  };
  
  // Create a StreetView object.
  var streetViewDiv = document.getElementById('streetview_canvas');
  streetView = new google.maps.StreetViewPanorama(streetViewDiv, streetViewOptions);

  // Add links when it happens "links_change" event.
  google.maps.event.addListener(streetView, "links_changed", createCustomLink);
  
}

function getCustomPanoramaTileUrl(panoID, zoom, tileX, tileY) {
  // Return a pano image given the panoID.
  return "house_tiles/" + panoID + '/'  + tileX + '-' +tileY + '_s1.jpg';
}

function getCustomPanorama(panoID) {
  var streetViewPanoramaData = {
    links: [],
    copyright: 'Imagery (c) Masashi Katsumata',
    tiles: {
        tileSize: new google.maps.Size(256, 256),
        worldSize: new google.maps.Size(2048, 1024),
        centerHeading: 0,
        getTileUrl: getCustomPanoramaTileUrl
     }
  };
  switch(panoID) {
    case "backyard":
      // Description of this point.
      streetViewPanoramaData["location"] = {
        pano: 'backyard',
        description: "Back yard",
        latLng: new google.maps.LatLng(0, 0)
      };
      return streetViewPanoramaData;
      
    case "diningroom":
      streetViewPanoramaData["location"] = {
        pano: 'diningroom',
        description: "Dining room",
        latLng: new google.maps.LatLng(0, 0)
      };
      return streetViewPanoramaData;
      
    case "frontyard":
      streetViewPanoramaData["location"] = {
        pano: 'frontyard',
        description: "Front yard",
        latLng: new google.maps.LatLng(0, 0)
      };
      return streetViewPanoramaData;
      

  }
}

function createCustomLink() {
  /*
   * add links
   */
  var links = streetView.getLinks();
  var panoID = streetView.getPano();
  
  switch(panoID) {
    case "frontyard":
      links.push({
        description : "Dining Room",
        pano : "diningroom",
        heading : 0
      });
      break;
    case "backyard":
      links.push({
        description : "Dining Room",
        pano : "diningroom",
        heading : 180
      });
      break;
      
    case "diningroom":
      links.push({
        description : "Backyard",
        pano : "backyard",
        heading : 0
      });
      links.push({
        description : "Front Yard",
        pano : "frontyard",
        heading : 180
      });
      break;
  }
}

google.maps.event.addDomListener(window, 'load', initialize);
    </script>

Search
Books
Google Maps API Programming Guide

Four Google Maps API Experts wrote this book. Introducing useful examples for developers!
See more details