Oracle Maps example - Overview map


Instructions

This demo shows how to place the overview map outside the main map area.

Source code

  var mainmap;
  var basemap=new MVMapTileLayer("mvdemo.demo_map");
  function showMap()
  {
    var baseURL  =  "http://"+document.location.host+"/mapviewer";
    var mapCenterLon = -122.45;
    var mapCenterLat =  37.6706;
    var mapZoom      =  7;       
    
    mainmap = new MVMapView(document.getElementById("map"), baseURL);
    
    var center=MVSdoGeometry.createPoint(mapCenterLon, mapCenterLat,8307);
    mainmap.addMapTileLayer(basemap);   
    mainmap.setCenter(center);   
    mainmap.setZoomLevel(mapZoom);
    
    mainmap.addCopyRightNote("©2006 powered by oracle™");                                       
    mainmap.addNavigationPanel("WEST"); 
    mainmap.addScaleBar();
    
    var over = new MVOverviewMap(document.getElementById("map2"),3);
    over.setRectangleStyle("1px solid red","red")
    mainmap.addOverviewMap(over);
    
    mainmap.display();
    
  }
The HTML code that adds the overview map is shown here.
 <div style="top:10px;left:0px;width:100%;height:150px;border:1px solid" id="map2"> </div>