Configuring Maps to Interact With Other Components

How to:

Variables in requests and maps can be used as parameters that are passed from one component to other components on an HTML page. When selections are made on one component, other components on the HTML page can be automatically updated to show those same selected values.

A point layer on a map has a unique ID field that WebFOCUS App Studio automatically turns into a parameter. When you use that same parameter in a filter in a report or chart component, any selection on the map layer will change the output of the report or chart.

For a polygon layer, you must create the variables to be passed between the map and other components.

A WebFOCUS report or chart request can have drill-down links that select and zoom to points or polygons on a map layer.

Procedure: How to Update a Request Based on Map Selections

In order to cause map selections to update a report or chart, you need a parameter in the request that supplies the location dimension for the map, and a matching parameter in the request that will be updated when a selection is made on the map.

Note: You can specify whether to rerun the request when the map selections are cleared. For information, see Configuring Whether Selections on a Map Are Required to Run a Request.

For a point layer using the map unique ID field, the report or chart must have a parameter matching the unique ID parameter automatically generated for the map. For a polygon layer, you can define a parameter in the request that supplies the location dimension for the map.

Once you have the parameter in the request to be updated and the parameter in the map defined, you must bind it to the map object on the Parameters tab by dragging the mouse from the map object to the request parameter, as shown in the following image.



The example used in this section to provide the point data is the customer_locations procedure created in Configuring a Map Data Layer . The unique ID field is ID_CUSTOMER.

The following version of the request populates a report and contains a parameter named &ID_CUSTOMER. Paste the syntax into the Text Editor and save it as customer_locations2b.fex.

-DEFAULT ID_CUSTOMER=FOC_NONE
TABLE FILE WF_RETAIL_LITE
SUM
  ID_CUSTOMER
  COGS_US
  REVENUE_US
  QUANTITY_SOLD
BY COUNTRY_NAME
BY STATE_PROV_NAME
BY  ID_CUSTOMER NOPRINT
WHERE ID_CUSTOMER EQ &ID_CUSTOMER
ON TABLE NOTOTAL
ON TABLE SET PAGE NOLEAD
ON TABLE SET STYLE *
INCLUDE=IBFS:/FILE/IBI_HTML_DIR/javaassist/intl/EN/combine_templates/ENWarm.sty,$
ENDSTYLE
END

Note that the WHERE condition selects ID_CUSTOMER values that are equal to the &ID_CUSTOMER parameter values. When selections are made on the map, the map component will automatically pass the ID_CUSTOMER values selected to the report component, and the report will update to display those selections only. The -DEFAULT command causes the WHERE test to be ignored when no selection has been made.

The following steps set up the report and the task for updating it.

  1. Add an Esri component to the HTML page.
  2. Add the customer_locations.fex and customer_locations2b.fex external WebFOCUS requests to the HTML page using the Requests & Data Sources panel.
  3. Configure the Esri component to use the Point of Interest geographic role and the customer_locations procedure, as described in Configuring a Map Data Layer.
  4. Add a Frame component next to the map component on the HTML page.
  5. With the map component selected, create a new task in the Tasks & Animations panel.

    Set the following properties for the task.

    • Set the Trigger Type to Selection Changed.
    • For the Trigger, check the map layer whose selections should trigger the task.
    • For Requests/Actions, select Run Request and then customer_locations2b.

      Note: The Load task should also run this request so that it is populated as soon as the HTML page is run.

    • For Target Type, select Frame.
    • For Target/Template Name, select the name of the frame where customer_locations2b will be run.

    The Tasks & Animations panel should look similar to the following:



  6. Bind the parameter to the map object on the Parameters tab by dragging the mouse from the map object to the request parameter, as shown in the following image.


Run the HTML page. The output will be similar to the following:

Make a selection on the map using the selection widget. The report updates to show the selected points on the map, as shown in the following image.

Procedure: How to Update a Request Based on Map Selections for a Polygon Layer

In order to cause map selections to update a report or chart, the report or chart must have a parameter matching a parameter on the map.

The request used in this example to provide the polygon data is the customer_states3 procedure. It is similar to the customer_states procedure created in Configuring a Map Data Layer, but it has a variable added to select regions.

The customer_states3 procedure follows:

-DEFAULT REGION = FOC_NONE
DEFINE FILE WF_RETAIL_LITE
STATE/A20 = WF_RETAIL_LITE.WF_RETAIL_GEOGRAPHY_CUSTOMER.STATE_PROV_NAME;
REGION/A10 = IF STATE EQ 'Connecticut' OR 'Maine' OR 'Massachusetts' OR
    'New Hampshire' OR 'Rhode Island' OR 'Vermont' OR
    'New Jersey' OR 'New York' OR 'Pennsylvania' THEN 'Northeast'
    ELSE IF STATE EQ 'Illinois' OR 'Indiana' OR 'Michigan' OR 'Ohio'
    OR 'Wisconsin' OR 'Iowa' OR 'Kansas' OR 'Minnesota' OR 'Missouri'
    OR 'Nebraska' OR 'North Dakota' OR 'South Dakota' THEN 'Midwest'
    ELSE IF STATE EQ 'Delaware' OR 'Florida' OR 'Georgia' OR 'Maryland'
    OR 'North Carolina' OR 'South Carolina' OR 'Virginia' OR
    'Washington D.C.' OR 'West Virginia' OR 'Alabama' OR 'Kentucky' OR
    'Mississippi' OR 'Tennessee' OR 'Arkansas' OR 'Louisiana' OR
    'Oklahoma' OR 'Texas' THEN 'South' ELSE 'West';
END
TABLE FILE WF_RETAIL_LITE
SUM QUANTITY_SOLD
BY REGION
BY STATE_PROV_NAME
WHERE REGION EQ &REGION
WHERE COUNTRY_NAME EQ 'United States'
ON TABLE PCHOLD FORMAT XML
END

The DEFINE FILE command defines which states are in which regions. The WHERE phrase for REGION sets the values of the REGION field to the values of the &REGION parameter. When a selection has been made on the map, the parameter values will be passed to a report request. The -DEFAULT command causes the WHERE test to be ignored when no selection has been made.

Paste this syntax into the Text Editor, and save it as customer_states3.fex.

The following version of the request, named customer_states3b, populates a report and also contains a parameter named &REGION. Paste the syntax into the Text Editor and save it as customer_states3b.fex.

-DEFAULT &REGION = FOC_NONE
DEFINE FILE WF_RETAIL_LITE
STATE/A20 = STATE_PROV_NAME;
REGION/A10 = IF STATE EQ 'Connecticut' OR 'Maine' OR 'Massachusetts' OR
    'New Hampshire' OR 'Rhode Island' OR 'Vermont' OR
    'New Jersey' OR 'New York' OR 'Pennsylvania' THEN 'Northeast'
    ELSE IF STATE EQ 'Illinois' OR 'Indiana' OR 'Michigan' OR 'Ohio'
    OR 'Wisconsin' OR 'Iowa' OR 'Kansas' OR 'Minnesota' OR 'Missouri'
    OR 'Nebraska' OR 'North Dakota' OR 'South Dakota' THEN 'Midwest'
    ELSE IF STATE EQ 'Delaware' OR 'Florida' OR 'Georgia' OR 'Maryland'
    OR 'North Carolina' OR 'South Carolina' OR 'Virginia' OR
    'Washington D.C.' OR 'West Virginia' OR 'Alabama' OR 'Kentucky' OR
    'Mississippi' OR 'Tennessee' OR 'Arkansas' OR 'Louisiana' OR
    'Oklahoma' OR 'Texas' THEN 'South' ELSE 'West';
END
TABLE FILE WF_RETAIL_LITE
SUM QUANTITY_SOLD
BY REGION AS Region
BY STATE_PROV_NAME
WHERE REGION EQ &REGION
WHERE COUNTRY_NAME EQ 'United States'
ON TABLE SET PAGE NOLEAD
ON TABLE SET STYLE *
INCLUDE=IBFS:/FILE/IBI_HTML_DIR/javaassist/intl/EN/combine_templates/ENWarm.sty,$
ENDSTYLE
END

Note that the WHERE condition selects REGION values that are equal to the &REGION parameter values. When selections are made on the map, the map component will pass the REGION values selected to the report component, and the report will update to display those selections only.

The following steps set up the report and the task for updating it.

  1. Add an Esri component to the HTML page.
  2. Add the customer_states3.fex and customer_states3b.fex external WebFOCUS requests to the HTML page using the Requests & Data Sources panel.
  3. Configure the Esri component to use the State geographic role and the customer_states3 procedure. The field that matches the geographic role is STATE_PROV_NAME.

    For clarity, the map component has been configured with unique symbology using the REGION field, as described in Configuring Unique Symbology for Polygons.

  4. Add a Frame component next to the map component on the HTML page.
  5. With the map component selected, create a new task in the Tasks & Animations panel.

    Set the following properties for the task.

    • Set the Trigger Type to Selection Changed.
    • For the Trigger, check the map layer whose selections should trigger the task.
    • For Requests/Actions, select Run Request and then customer_states3b.

      Note: The Load task should also run this request so that it is populated as soon as the HTML page is run.

    • For Target Type, select Frame.
    • For Target/Template Name, select the name of the frame where customer_states3b will be run.

    The Tasks & Animations panel should look similar to the following:



  6. On the parameters tab, make the map parameter populate the report parameter (drag the REGION parameter onto the emfobject1 parameter and back down), as shown in the following image.


Run the HTML page. The output will be similar to the following:

Make a selection on the map using the selection widget. The report updates to show the selected points on the map, as shown in the following image, in which the South and West regions have been selected on the map.

Syntax: How to Drill Down From a WebFOCUS Request to Selections on a Map

The JavaScript function IbComposer_selectEsriMap can be used in a WebFOCUS StyleSheet to make a selection on a WebFOCUS request and zoom to that selection on a map. The syntax is.

TYPE=DATA,
     COLUMN=requestcol,
      JAVASCRIPT=parent.IbComposer_selectEsriMap( \
     'mapobject' \
     'maplayer' \
     'mapfield' [\
     fieldvalue]
     ),

where:

requestcol

Is a designation for the drilldown column in the request.

'mapobject'

Is the object name for the map component that is the target of the drilldown.

'maplayer'

Is the name of the map layer that is the target of the drilldown.

'mapfield'

Is the name of the map field that is the target of the drilldown.

fieldvalue

Is the field value of the target field, passed from the request when a drill-down link is selected.

Example: Creating a Drilldown From a Report to a Map

This example has a report component named customer_states4 that has a drilldown from the REGION field to the map component. The syntax follows. Paste it into the Text Editor and save it as customer_states4.fex.

DEFINE FILE WF_RETAIL_LITE
STATE/A20 = WF_RETAIL_LITE.WF_RETAIL_GEOGRAPHY_CUSTOMER.STATE_PROV_NAME;
REGION/A10 = IF STATE EQ 'Connecticut' OR 'Maine' OR 'Massachusetts' OR
    'New Hampshire' OR 'Rhode Island' OR 'Vermont' OR
    'New Jersey' OR 'New York' OR 'Pennsylvania' THEN 'Northeast'
    ELSE IF STATE EQ 'Illinois' OR 'Indiana' OR 'Michigan' OR 'Ohio'
    OR 'Wisconsin' OR 'Iowa' OR 'Kansas' OR 'Minnesota' OR 'Missouri'
    OR 'Nebraska' OR 'North Dakota' OR 'South Dakota' THEN 'Midwest'
    ELSE IF STATE EQ 'Delaware' OR 'Florida' OR 'Georgia' OR 'Maryland'
    OR 'North Carolina' OR 'South Carolina' OR 'Virginia' OR
    'Washington D.C.' OR 'West Virginia' OR 'Alabama' OR 'Kentucky' OR
    'Mississippi' OR 'Tennessee' OR 'Arkansas' OR 'Louisiana' OR
    'Oklahoma' OR 'Texas' THEN 'South' ELSE 'West';
END
TABLE FILE WF_RETAIL_LITE
SUM QUANTITY_SOLD
BY REGION
BY STATE
WHERE COUNTRY_NAME EQ 'United States'
ON TABLE SET PAGE NOLEAD
ON TABLE SET STYLE *
INCLUDE=IBFS:/FILE/IBI_HTML_DIR/javaassist/intl/EN/combine_templates/ENWarm.sty,$
TYPE=DATA,
     COLUMN=REGION,
     JAVASCRIPT=parent.IbComposer_selectEsriMap( \
     'emfobject1' \
     'State' \
     'REGION' \
      REGION \
     ),
$
END

The drilldown in the StyleSheet is on the REGION column. It uses the IbComposer_selectEsriMap function to target the map object on the State layer using the REGION field and the REGION values passed from the selected drill-down link.

The map component will use the customer_states3 procedure, as described in the previous example.

Use the following steps to set up the report request and map component.

  • Add the customer_states3 and customer_states4 requests to the HTML page in the Requests & Data Sources panel.
  • Add a Frame component on the HTML page.
  • Set the Load task to run the customer_states4 request in the Tasks & Animation panel, with the target being the frame you created.
  • Add a map component next to the report frame on the HTML page. Configure it to use the customer_states3 request, the State geographic role, and the STATE_PROV_NAME field. Name the layer State, as shown in the following image.

    The map component in this example has been configured for unique symbology based on the REGION field, as described in Configuring Unique Symbology for Polygons.

Run the HTML page. The output should be similar to the following.

Click the Northeast link on the report. The map component zooms to that region with all of the states selected, as shown in the following image.

You can change the selection by clicking another drill-down link on the report. You can also change the extent or clear the selection using the map widgets.