Oracle Maps example - show/hide Theme Based FOI layers


Instructions

This demo displays two Theme based FOI layers. One layer shows customers as red dots. The other shows counties shaded according to its population. You can use the two check boxes above the map to toggle each FOI layer on or off. Note that you can also click on the colored counties layer (when it is visible) to display an info-tip window showing the county population.

Source code

The JavaScript code for the above map is below.
    var mapview;
    
    function showMap() 
    {	
      var baseURL  = "http://"+document.location.host+"/mapviewer";
      var mapCenterLon = -122.45;
      var mapCenterLat =  37.7706;
      var mapZoom      =  4;       
      var mpoint = MVSdoGeometry.createPoint(mapCenterLon,mapCenterLat,8307);
      mapview = new MVMapView(document.getElementById("map"), baseURL);
      mapview.addMapTileLayer(new MVMapTileLayer("mvdemo.demo_map"));   
      mapview.setCenter(mpoint);   
      mapview.setZoomLevel(mapZoom);
      
      addThemeBasedFOI();
      
      mapview.addNavigationPanel();
      mapview.display();
    }
    
    function addThemeBasedFOI()
    {
      var themebasedfoi1 = new MVThemeBasedFOI('themebasedfoi1','mvdemo.THEME_DEMO_COUNTY_POPDENSITY');
      themebasedfoi1.enableAutoWholeImage(true) ;
      mapview.addThemeBasedFOI(themebasedfoi1);
      
      var themebasedfoi2 = new MVThemeBasedFOI('themebasedfoi2','mvdemo.customers');
      mapview.addThemeBasedFOI(themebasedfoi2);
    }
    
    function setVisible(item)
    {
      var themebasedfoi = mapview.getThemeBasedFOI(item.value);	  		
      themebasedfoi.setVisible(!themebasedfoi.isVisible());
    }	
    
  
The HTML code that wires the setVisible() function is listed here:
        <LI><INPUT TYPE="checkbox" value="themebasedfoi1" onclick="setVisible(this)" checked/>Show Customers<LI>
        <LI><INPUT TYPE="checkbox" value="themebasedfoi2" onclick="setVisible(this)" checked/>Show County population density<LI>