Map Cache Server/Map Client

Oracle Maps example - build your own collapsible map legend

Instructions

This demo shows two things. First, it shows how to add a Map Decoration inside the map area to display a map legend (or any HTML content for that matter). Second, it shows how to build your own map legend using the new MapViewer request for style samples.

Source code

The source code for this demo is shown below.

  var legend;
  function showMap()
  {	
    var baseURL  = "http://"+document.location.host+"/mapviewer";
    var mapCenterLon = -122.45;
    var mapCenterLat =  37.6706;
    var mapZoom      =  4;  
    var mpoint = MVSdoGeometry.createPoint(mapCenterLon,mapCenterLat,8307);
    var mapview = new MVMapView(document.getElementById("map"), baseURL);
    mapview.addMapTileLayer(new MVMapTileLayer("mvdemo.demo_map")); 
    mapview.setCenter(mpoint); 
    mapview.setZoomLevel(mapZoom);

    var html = buildLegend(baseURL);
    
    legend = new MVMapDecoration(html,null,null,200,110);
    legend.setCollapsible(true);
    mapview.addMapDecoration(legend);
    
    mapview.display();  			
  }

  function buildLegend(baseURL)
  {
    var html = "<table border=0> <tr><td><img src="+baseURL+"/omserver?sty=L.PH&w=45&h=20&ds=mvdemo></td><td> Highways </td></tr>" +
               "                 <tr><td><img src="+baseURL+"/omserver?sty=M.CITY+HALL+3&w=20&h=20&ds=mvdemo></td><td> Cities </td></tr>" +
               "</table>";
    return html;
  }