27 Using ADF Geographic Map Components

This chapter describes how to use an ADF geographic map component with databound themes to display data, and provides the options for map customization.

This chapter includes the following sections:

For information about the data binding of ADF geographic map themes, see the "Creating Databound ADF Geographic Maps" section in the Oracle Fusion Middleware Fusion Developer's Guide for Oracle Application Development Framework.

27.1 Introduction to Geographic Maps

A geographic map component is a data visualization component that provides the functionality of Oracle Spatial within the framework. This component lets users represent business data on a geographic map and superimpose multiple layers of information (known as themes) on a single map.

When you create a map, you are prompted to select a base map that an administrator has already configured using the Map Builder tool of Oracle Spatial. During configuration, the map administrator defines the zoom levels that the map supports. These levels also determine the zoom capability of the ADF geographic map.

Administrators also have the option of creating predefined map themes using the Map Builder tool. For example, a predefined theme might use specific colors to identify regions. In the ADF geographic map component, you can select such a predefined map theme, but you cannot modify it because this theme is part of the base map.

The base map becomes the background on which you build interactive layers of information in JDeveloper using the ADF geographic map component. The ADF geographic map requires that you define at least one layer but you can create as many layers as you wish.

27.1.1 Available Map Themes

The ADF geographic map provides a variety of map themes, each of which must be bound to a data collection. Figure 27-1 shows a map with several themes. The following kinds of map themes are available:

  • Color: Applies to regions. For example, a color theme might identify a range of colors to represent the population in the states of a region or the popularity of a product in the states of a region. A map can have multiple color themes visible at different zoom levels. For example, a color theme at zoom levels 1 to 5 might represent the population of a state, and the county median income at zoom levels 6 to 10.

  • Point: Displays individual latitude/longitude locations in a map. For example, a point theme might identify the locations of warehouses in a map. If you customize the style of the point that is displayed, you might choose to use a different image for the type of inventory (electronics, housewares, garden supplies) in a set of warehouses to differentiate them from each other.

  • Graph: Creates any number of pie graph themes and bar graph themes. However, only one graph theme can be visible at a given time. You select the desired theme from the View menu of the map toolbar. Graph themes can show statistics related to a given region such as states or counties. For example, a graph theme could display the sales values for a number of products in a state.

Figure 27-1 Geographic Map of Southwest US with Color, Point, and Pie Graph Themes

Map with color, point, and pie graph themes

27.1.2 Geographic Map Terminology

The following list gives a brief description of the terminology used in a geographic map:

  • Base map: Provides the background geographic data, zoom levels, and the appearance and presence of items such as countries, cities, and roads. The base map can be any image that can be configured using a map viewer and map builder, for example, the floor maps of office buildings.

  • Zoom control: Consists of pan icons and a zoom slider that render in the upper left-hand corner of the map. Figure 27-2 shows a map zoom control that is zoomed-out all the way (that is, the zoom level is set to 0). At zero, the entire map is displayed.

    You can customize the location and the initial setting of the zoom control in the dvt:map tag. The View menu (which appears in the map toolbar just above the sample map) lets you determine the visibility of the zoom control. By default, the initial zoom level for a map is set to 0.

    Figure 27-2 Zoom Control of a Map

    Zoom control of a map
    • Pan icons: Consists of icons (with arrows that point north, south, east, west, northeast, northwest, southeast, and southwest) at the top of the zoom control. You can use these icons to move the entire map in specific directions.

    • Zoom slider: Consists of a slider with a thumb for large scale zooming and icons for zooming a single level. You can use the plus icon to zoom in and the minus icon to zoom out one level at a time. When the thumb is at the bottom of the slider, the zoom level is zero.

  • Scale: Consists of two horizontal bars that display in the lower left-hand corner of the map below the information panel and above the copyright. Figure 27-3 shows the scale. The top bar represents miles (mi) and the bottom bar represents kilometers (km). Labels appear above the miles bar and below the kilometers bar in the format: [distance] [unit of measure]. The length and distance values of the bars change as the zoom level changes and as the map is panned.

    Figure 27-3 Map Information Panel, Scale, and Copyright

    Map Information panel, scale, and Copyright
  • Information panel: Displays latitude and longitude in the lower left-hand corner above the scale. Figure 27-3 shows the information panel. By default, the information panel is not visible. You can display this panel from the View menu or by clicking the Information button on the toolbar.

  • Measurement panel: Displays either distance, area, or radius depending on which tools in the toolbar are currently in use. Text appears in the following format: [label] [value] [unit of measure] to the right of the information panel. Figure 27-4 shows the measurement panel with a distance measurement. Area measurement and radius measurement appear in a similar manner with the appropriate labels.

    Figure 27-4 Map Measurement Panel Beside the Information Panel

    Map measurement panel beside the information panel

    The following tools provide information in the measurement panel:

    • Area measurement: Appears only when the Area, Rectangular Selection, or Multi-Point Selection tools are active.

    • Distance measurement: Appears only when the Distance tool is active.

    • Radius measurement: Appears only when the Circular Selection tool is active.

  • Copyright: Appears in the lower left-hand corner of the map and contains text that you can customize in the dvt:map tag.

  • Overview map: Consists of a miniature view of the main map as shown in Figure 27-5. This map appears in the lower right-hand corner of the main map and lets you change the viewable region of the main map without having to use the pan tool or the pan icons.

    Figure 27-5 Overview Map

    Overview map

    The following items are part of the overview map:

    • Reticule: Appears as a small window that you can move across a miniature view of the main map. The position of the reticule in the miniature map determines the viewable area of the main map. As you move the reticule, the main map is updated automatically.

    • Show/Hide icon: Appears in the upper left-hand corner when the overview map is displayed. When you click the Show/Hide icon, the overview map becomes invisible and only the icon can be seen in the lower right corner of the main map.

  • Toolbar: Contains the following elements in the sequence listed:

    • View menu: Lets you control which themes are visible, select a specific theme for display, and determine the visibility of the zoom control, legend, and the information panel.

    • Toolbar buttons: Provide the following tools for interaction with the map: Pan, Zoom In, Zoom Out, Rectangular Selection, Circular Selection, Polygon Selection, Point Selection, Distance, Area, Legend, and Information.

27.1.3 Geographic Map Component Tags

The geometric map has parent tags, map child tags, and tags that modify map themes.

27.1.3.1 Geographic Map Parent Tags

The map component includes the following parent tags:

  • Map tag dvt:map: The parent tag for the main map component. Unlike other data visualization parent tags, the map tag is not bound to data. Instead, all the map theme child tags are bound individually to data collections. The map tag contains general information about the map including the identification of the base map, the URL for the remote server that is running Oracle Application Server MapViewer service and the URL for the Geocoder web service that converts street addresses into longitude and latitude coordinates for mapping. For a list and description of the child tags, see Section 27.1.3.2, "Geographic Map Child Tags."

  • Map toolbar dvt:mapToolbar: A parent tag that allows the map toolbar to be placed in any location on a JSF page that contains a map. This toolbar contains a mapID attribute that points to the map associated with the toolbar. The toolbar lets you perform significant interaction with the map at runtime including the ability to display the map legend and to perform selection and distance measurement. The map toolbar tag has no child tags.

27.1.3.2 Geographic Map Child Tags

The dvt:map tag has the following child tags:

  • Color theme dvt:mapColorTheme: One of the optional map layers that you bind to a data collection.

  • Point theme dvt:mapPointTheme: One of the optional map layers that you bind to a data collection. The point theme identifies individual locations on a map.

  • Bar graph theme dvt:mapBarGraphTheme: One of the optional map layers that you must bind to a data collection. This theme displays a bar graph at points to represent multiple data values related to that location. For example, this tag might be used to display a graph that shows inventory levels at warehouse locations.

  • Pie graph theme dvt:mapPieGraphTheme: One of the optional map layers that you must bind to a data collection. This theme displays a pie graph at specific points to represent multiple values at that location. For example, this tag might be used to display a graph that shows inventory levels at warehouse locations.

  • Map legend dvt:mapLegend: Created automatically when you create a map. Use this tag to customize the map legend.

  • Overview map dvt:mapOverview: Created automatically when you create a map. Use this tag to customize the overview map that appears in the lower right-hand corner of the map.

27.1.3.3 Tags for Modifying Map Themes

The following tags modify various map themes:

  • Point style item dvt:mapPointStyleItem: An optional child tag of the dvt:mapPointTheme tag. Use this tag only if you want to customize the image that represents points that fall in a certain data value range. To define multiple images, create a tag for each image and specify the associated data value range and image.

  • Pie slice set dvt:mapPieSliceSet: A child of the dvt:mapPieGraphTheme tag. This is an optional tag that you use to wrap dvt:mapPieSliceItem tags, if you want to customize the color of the slices in a map pie graph.

  • Pie slice item dvt:mapPieSliceItem: A child of the dvt:mapPieSliceSet tag. Each pie slice item tag customizes the color of one slice in a map pie graph.

  • Bar graph series set dvt:mapBarSeriesSet: A child of the dvt:mapBarGraphTheme tag. This is an optional tag that you use to wrap dvt:mapBarSeriesItem tags if you want to customize the color of bars in a map bar graph.

  • Bar graph series item dvt:mapBarSeriesItem: A child of the dvt:mapBarSeriesSet tag. Each bar graph series item tag customizes the color of one bar in a map bar graph.

27.2 Understanding Data Requirements for Geographic Maps

The following data requirements apply to the geographic map:

  • Configuration requirements include the following information:

    • Map Viewer URL: You must provide a URL for the location of the Oracle Application Server MapViewer service. This service is required to run the base map that provides the background for the layers in the ADF geographic map component. OracleAS MapViewer is a programmable tool for rendering maps using spatial data managed by Oracle Spatial.

    • Geocoder URL: If you want to convert street addresses into coordinates, then you must provide the URL for the Geocoder for the geographic map. A Geocoder is a Web service that converts street addresses into longitude and latitude coordinates for mapping.

  • Base map: You must have a base map created by the Map Builder tool in OracleAS MapViewer. This base map must define polygons at the level of detail that you require for your map themes to function as desired. For example, if you have a map pie graph or bar graph theme that you want to use for creating graphs in each state of a certain region, then you must have a base map that defines polygons for all these states at some zoom level. You can display only one graph in a polygon.

  • Data controls for map themes: Each map theme must be bound to a data control. The data control must contain location information that can be bound to similar information in the base map.

27.3 Customizing Map Size, Zoom Control, and Selection Area Totals

You can customize the map size, zoom strategy, appearance of selected regions, and the initial display of the information window and the scale bar.

27.3.1 How to Adjust the Map Size

You can control the width and height of the map by using the inlineStyle attribute in the dvt:map tag.

To adjust the size of a map:

  1. In the Structure window, right-click the dvt:map node and choose Go to Properties.

  2. In the Style attributes category of the Property Inspector, enter the width and height in the inlineStyle attribute.

    For example, to specify a width of 600 pixels and a height of 400 pixels, use the following setting: inlineStyle="width:600px;height:400px".

    For a width that uses the entire available width of the page and a height of 400 pixels, use the following setting: inlineStyle="width:600px;height:400px".

27.3.2 How to Specify Strategy for Map Zoom Control

Several attributes on the dvt:map tag let you control the initial zoom level, starting location, initial map theme, and zoom strategy.

To control the initial zoom and starting location on a map:

  1. In the Structure window, right-click the dvt:map node and choose Go to Properties.

  2. In the Appearance attributes category of the Property Inspector, enter values for the following attributes:

    1. In AutoZoomThemeID, enter the ID of the first theme that will be displayed.

    2. In ZoomBarStrategy, select the default value MAXZOOM to direct the map to zoom down to the maximum level where all objects in the autoZoomThemeId are visible, or select CENTERATZOOMLEVEL to direct the map to center on the theme in autoZoomThemeId and to set the zoom level to the value in the mapZoom attribute.

    3. If you want to change the starting location on the map, enter latitude and longitude in startingX and startingY respectively.

    4. In MapZoom, enter the beginning zoom level for the map. This setting is required for the zoom bar strategy CENTERATZOOMLEVEL.

      Note:

      The property autoZoomThemeID takes precedence over the property set in mapZoom.

27.3.3 How to Total Map Selection Values

You can provide a selection listener that totals the values associated with a map area selected with one of the map selection tools such as the rectangular selection. The total is displayed in an area under the map. Provide a class that takes MapSelectionEvent as an argument in a backing bean method. Example 27-1 shows sample code for a backing bean.

Example 27-1 Sample Code in Backing Bean for Selection Listener

package view;
 
import java.util.Iterator;
 
import oracle.adf.view.faces.bi.component.geoMap.DataContent;
import oracle.adf.view.faces.bi.event.MapSelectionEvent;
 
public class SelectionListener {
    private double m_total = 0.0;
    
    public SelectionListener() {
    }
 
    public void processSelection(MapSelectionEvent mapSelectionEvent) {
        // Add event code here...
        m_total = 0.0;
        Iterator selIterator = mapSelectionEvent.getIterator();
        while (selIterator.hasNext())
        {
            DataContent dataContent = (DataContent) selIterator.next();
            if (dataContent.getValues() != null)
            {
                Double allData[] = dataContent.getValues();
                m_total += allData[0];    
            }
        }
    }
    
    public double getTotal () {
        return m_total;
    }
    
    public void setTotal (double total) {
        m_total = total;
    }
}

To provide a selection listener to total map values:

  1. In the Structure window, right-click the geographic map node and choose Go to Properties.

  2. In the Behavior attributes category, for the SelectionListener field, enter a method reference that points to the backing bean. For example,

27.4 Customizing Map Themes

You can customize each type of map theme using one or more of the following: the map theme binding dialogs, the attributes of the theme tag, or the child tags of the theme tag.

27.4.1 How to Customize Zoom Levels for a Theme

For all map themes, verify that the theme specifies zoom levels that match the related zoom levels in the base map. For example, if the base map shows counties only at zoom levels 6 through 8, then a theme that displays points or graphs by county should be applied only at zoom levels 6 through 8.

To customize the zoom levels of a map theme:

  1. In the Structure window, locate the map theme tag (dvt:mapColorTheme, dvt:mapPointTheme, dvt:mapBarGraphTheme, or dvt:mapPieGraphTheme) that you want to customize.

  2. Right-click the tag and choose Go to Properties.

  3. In the Appearance attributes category of the Property Inspector, enter the desired low and high zoom values for the MinZoom and the MaxZoom attributes respectively.

27.4.2 How to Customize the Labels of a Map Theme

By default, the ID of the map theme is used as the label when that theme is displayed in the legend or in the Theme Selection dialog. However, each map theme tag has the following attributes that serve as optional labels for the theme:

  • shortLabel: Specifies a label for the theme when displayed in the map legend.

  • menuLabel: Specifies a label for the theme in the Theme Selection dialog.

Use these attributes to create meaningful labels that identify both the theme type (color, point, bar graph, or pie graph) and the data (such as population, sales, or inventory) so that users can easily recognize the available themes.

To customize the labels of a map theme:

  1. In the Structure Window, locate the map theme tag that you want to customize.

  2. Right-click the tag node and choose Go to Properties.

  3. In the Appearance attributes category of the Property Inspector, enter text in the shortLabel attribute (for display in the legend) and in the menuLabel attribute (for display in the Theme Selection Dialog).

    For example, you might want to enter the following text for a color theme that colors New England states according to population:

    shortLabel="Color - Population, NE Region"
    

27.4.3 How to Customize Color Map Themes

When you create a color map theme, you can customize the colors used for the coloring of the background layer. You can specify the colors associated with the minimum and maximum ranges, and then specify the number of color ranges for the theme. For example, if the colors relate to the population on the map, the least populated areas display the minimum color and the most populated areas display the maximum color. Graduated colors between the minimum and maximum color are displayed for ranges between these values.

To customize the colors of a color map theme:

  1. In the Structure window, right-click the dvt:mapColorTheme node and choose Go to Properties.

  2. In the Theme Data attributes category of the Property Inspector:

    • If you want to change the default colors associated with the minimum and maximum range of data values, then select the desired colors for the MinColor and MaxColor attributes respectively.

    • If you want to change the default number of color ranges for this theme, change the integer in the bucketCount attribute.

    For example, if <dvt:mapColorTheme minColor="#000000" maxColor= "#ffffff" bucketCount="5"/>, then the color for the five buckets are: #000000, #444444, #888888, #bbbbbb, #ffffff.

Alternatively, you can specify the color for each bucket. To specify colors for multiple buckets, for the colorList attribute of dvt:mapColorTheme, bind a color array to the attribute or use a semicolon-separated string. Color can be specified using RGB hexadecimal. For example, if the value is colorList="#ff0000;#00ff00;#0000ff", then the value of the first bucket is red, the second bucket is green, and the third bucket is blue.

27.4.4 How to Customize Point Images in a Point Theme

A map point theme uses a default image to identify each point. However, you can specify multiple custom images for a point theme and identify the range of data values that each image should represent.

You define a dvt:mapPointStyleItem tag for each custom image that you want to use in a map point theme.

To customize the images for points in a map point theme:

  1. In the Structure window, right-click the dvt:mapPointTheme node and select Insert inside dvt:mapPointTheme > Point Style Item.

  2. In the ensuing Insert Point Style Item wizard, provide settings for the data value range of this custom point by doing the following:

    1. In Step 1 of the wizard (Common Properties), you must specify the URL for the image that should be displayed on the map for a point that falls in the data value range for this custom image.

    2. In Step 2 of the wizard (Advanced Properties), specify the data value range that this custom image should represent by entering values in MaxValue and MinValue fields.

    3. In the Id field, enter a unique identifier for the custom image that you are defining.

    4. In the Short Label field, specify the descriptive text that you want to display in front of the actual data value when a user hovers the cursor over a point that falls in the range represented by this tag.

      For example, you might want to enter the following text for a custom point that falls in the lowest data value range: Low Inventory.

    5. Optionally, specify different image URLs for a hover image and a selected image.

    6. Click Finish.

  3. Repeat Step 1 and Step 2 for each custom image that you want to create for your point theme.

27.4.5 What Happens When You Customize the Point Images in a Map

When you use the Insert Point Style Item wizard to specify a custom image representing a range of data values for a point theme, a child dvt:mapPointStyleItem tag is defined inside the parent dvt:mapPointTheme tag. Example 27-2 shows the code generated on a JSF page for a map point theme that has three custom point images that represent ranges of inventory at each warehouse point.

The initial point style setting (ps0) applies to values that do not exceed 500. This point style displays an image for very low inventory and provides corresponding tooltip information.

The second point style setting (ps1) applies to values between 500 and 1000. This point style displays an image for low inventory and provides corresponding tooltip information.

The final point style setting (ps2) applies to values between 1000 and 1600. This point style displays an image for high inventory and provides corresponding tooltip information.

Example 27-2 Map Point Theme Code with Custom Point Images

<dvt:map id="map1"
     .
     .
     .
 <dvt:mapPointTheme id="mapPointTheme1"
     shortLabel="Warehouse Inventory"
     value="{bindings.WarehouseStockLevelsByProduct1.geoMapModel}">
   <dvt:mapPointStyleItem id="ps0" minValue="0"
         maxValue="500"
         imageURL="/images/low.png"
         selectedImageURL="/images/lowSelected.png"
         shortLabel="Very Low Inventory"/>
   <dvt:mapPointStyleItem id="ps1" minValue="500"
         maxValue="1000"
         imageURL="/images/medium.png"
         selectedImageURL="/images/mediumSelected.png"
         shortLabel="Low Inventory"/>
   <dvt:mapPointStyleItem id="ps2" minValue="1000"
         maxValue="1600"
         imageURL="/images/regularGreen.png"
         selectedImageURL="/images/regularGreenSelected.png"
         shortLabel="High Inventory"/>
 </dvt:mapPointTheme>
</dvt:map>

27.4.6 How to Customize the Bars in a Bar Graph Theme

When you create a map bar graph theme, default colors are assigned to the bars in the graph. You can customize the colors of the bars by using the mapBarSeriesSet tag and the mapBarSeriesItem tag.

Use one mapBarSeriesSet tag to wrap all the mapBarSeriesItem tags for a bar graph theme and insert a mapBarSeriesItem tag for each bar in the graph.

To customize the color of the bars in a map bar graph theme:

  1. In the Structure window, right-click the dvt:mapBarGraphTheme tag and choose Insert inside dvt:mapBarGraphTheme > Map Bar Series Set.

    There are no attributes to set for this tag. It is used to wrap the individual bar series item tags.

  2. In the Structure window, right-click the dvt:mapBarSeriesSet tag and choose Insert inside dvt:mapBarSeriesSet > Map Bar Series Item.

  3. In the Property Inspector, enter any unique ID and color you want to use for the first bar that appears in the graph.

    To find the sequence of the bars in the graph, examine the Edit Bar Graph Map Theme Binding dialog. The sequence of the entries in the Series Attribute column of that dialog determines the sequence that bars appear in the graph. For example, in Figure 27-6, the first bar in the graph represents Income2000 and the second bar represents Income2005.

    Figure 27-6 Edit Bar Graph Map Theme Binding Dialog

    Edit bar graph map theme binding dialog
  4. Repeat Step 3 for every bar in the graph.

27.4.7 What Happens When You Customize the Bars in a Map Bar Graph Theme

When you use the Edit Bar Graph Map Theme Binding dialog to customize the bars in a map bar graph theme, the sequence of the bars reflect the sequence of the entries in the Series Attribute column in the dialog. Example 27-3 shows sample XML code generated when you customize the bars in a map bar graph.

Example 27-3 Code for Customizing the Bars in a Map Bar Graph

<dvt:map
  .
  .
  .
  <dvt:mapBarGraphTheme
    .
    .
    .
    <dvt:mapBarSeriesSet>
      <dvt:mapBarSeriesItem color="#333399" id="bar1"/>
      <dvt:mapBarSeriesItem color="#0000ff" id="bar2"/>
    </dvt:mapBarSeriesSet>
  </dvt:mapBarGraphTheme>
</dvt:map>

27.4.8 How to Customize the Slices in a Pie Graph Theme

When you create a map pie graph theme, default colors are assigned to the slices in the graph. You can customize the colors of the slices by using the mapPieSlicesSet tag and the mapPieSliceItem tag.

Use one mapPieSliceSet tag to wrap all the mapPieSliceItem tags for a pie graph theme, and insert a mapPieSliceItem tag for each slice in the graph.

To customize the color of the slices in a map pie graph theme:

  1. In the Structure window, right-click the dvt:mapPieGraphTheme tag and choose Insert inside dvt:mapPieGraphTheme > Pie Slice Set.

    There are no attributes to set for this tag. It is used to wrap the individual pie graph item tags.

  2. In the Structure window, right-click the dvt:mapPieSliceSet node and choose Insert inside dvt:mapPieSliceSet > Pie Slice Item.

  3. In the Property Inspector, enter any unique ID and color you want to use for the first slice that appears in the graph.

    To find the sequence of the slices in the graph, examine the Edit Pie Graph Map Theme Binding dialog. The sequence of the entries in the Pie Slices Attribute column of that dialog determines the sequence that slices appear in the graph. For example, in Figure 27-7, the first slice in the graph represents Sales, the second slice represents Profit, and the third slice represents Cost.

    Figure 27-7 Edit Pie Graph Map Theme Binding Dialog

    Edit pie graph map theme binding dialog
  4. Repeat Step 3 for every slice in the graph.

27.4.9 What Happens When You Customize the Slices in a Map Pie Graph Theme

When you use the Edit Pie Graph Map Theme Binding dialog to customize the slices in a map pie graph theme, the sequence of the slices reflect the sequence of the entries in the Pie Slices Attribute column of the dialog. Example 27-4 shows sample XML code generated in a JSF page when you customize the slices in a map pie graph.

Example 27-4 Code for Customizing the Slices in a Map Pie Graph

<dvt:map
  .
  .
  .
  <dvt:mapPieGraphTheme
    .
    .
    .
    <dvt:mapPieSliceSet>
      <dvt:mapPieSliceItem color="#ffffff" id="slice1"/>
      <dvt:mapPieSliceItem color="#ffff00" id="slice2"/>
      <dvt:mapPieSliceItem color="#ff0000" id="slice3"/>
    </dvt:mapPieSliceSet>
  </dvt:mapPieGraphTheme>
</dvt:map>

27.5 Adding a Toolbar to a Map

When you create an ADF geographic map, also create a map toolbar if you want to be able to display the legend and the information panel, select themes (if you have multiple themes of the same type), or use any of the distance measurement, area measurement, or selection tools.

27.5.1 How to Add a Toolbar to a Map

Because the map toolbar is a component that is separate from the map, you can position the toolbar on the JSF page above or below the map. The following procedure assumes that a map component exists on the JSF page.

To create a map toolbar:

  1. In the Structure window, right-click the dvt:map node and choose Insert before dvt:map or Insert after dvt:map > ADF Data Visualization.

  2. From the ADF Data Visualization Item dialog, select Toolbar.

  3. In the Insert Toolbar wizard that displays, enter the ID of the map on which this toolbar will operate and click Next.

  4. Enter a unique ID for the toolbar and optionally change the settings that control the visibility of each tool.

27.5.2 What Happens When You Add a Toolbar to a Map

When you add a toolbar to a map, the following occur:

  • A toolbar appears in the JSF page above or below the map as requested. The toolbar contains all the tools unless you change the visibility of one or more tools.

  • XML code is generated and appears in the JSF page above or below the code for the map.

Example 27-5 shows sample code for a toolbar that is associated with a map with the ID of map_us. It also shows the location of the code for the map.

Example 27-5 Code Generated for a Map Toolbar

<af:form>
  <dvt:mapToolbar mapId="map_us" id="T1"/>
  <dvt:map  id="map_us" 
   .
   .
   .
  </dvt:map>
</af:form>