<dvt:mapPointTheme>

Built-In Images

The Point Theme provides a collection of built-in images including the normal, selected and hover states. Consider the following:

1. Same image for all data points -- simply set the builtInImage attribute on the Point Theme tag.
2. Different image based on data value -- add one or more Point Style Item tags and specify the builtInImage attribute on each tag.

In the example below, all the points are shown using the built-in large orange pin rather than the default orange ball.

                    <dvt:map ...map attributes...>
                      <dvt:mapPointTheme id="theme1" value="#{backingBean.geoMapModel}"
                         builtInImage="OrangePinLarge"/> <-- Changes default rendering of all points -->
                    </dvt:map>
                    

HTML

By specifying a value for the customPointCallback attribute HTML representing the point can be returned to the Point Theme for each point in the data model. The Point Theme will render the HTML at the location of the point.

The attribute takes a method expression that taeks a oracle.adf.view.faces.bi.component.geoMap.DataContent object as the argument and returns an instance of oracle.adf.view.faces.bi.component.geoMap.PointContent

In the example below, the mapPointTheme is bound to a method expression, "backingBean.processPointInfo"

                    <dvt:map ...map attributes...>
                      <dvt:mapPointTheme id="theme1" value="#{backingBean.geoMapModel}"
                         customPointCallback="#{backingBean.processPointInfo}" />
                    </dvt:map>
                    

The method for generating the custom HTML content:

                    public PointContent processPointInfo(DataContent dataContent) {
                        String pointHTML = "<div>" + dataContent.getValues()[0] + "</div>";
                        String selectHTML = "<div><b>You are selected</b></div>";
                        String hoverHTML = "<div><b>Mouse over</b></div>";
                        PointContent pContent = new PointContent(pointHTML, selectHTML, hoverHTML);
                        return pContent;
                    }
                    

Left Click

The leftClickBehavior attribute defines the behavior when the end user left clicks on a point. In the example below, when the user left clicks on a point, a popup dialog will be shown. The popup dialog is defined in the "popup" facet.

                    <dvt:map ...map attributes...>
                      <f:facet name="popup">
                        <af:dialog title="TestPopup" modal="true">
                          <af:panelGroupLayout layout="vertical">
                            <af:image id="photoImage" source="#{popupBean.imageSrc}"/>
                          </af:panelGroupLayout>
                        </af:dialog>
                      </f:facet>
                      <dvt:mapPointTheme id="theme1" value="#{backingBean.geoMapModel}"
                         clickListener="#{popupBean.processClickAction}" 
                         leftClickBehavior="Popup"/>
                    </dvt:map>
                    

Hover

The hoverBehavior attribute defines the behavior when the end user hovers over a point with the mouse. In the example below, when the user mouses over a point, the info window will be shown.

                    <dvt:map ...map attributes...>
                      <dvt:mapPointTheme 
                         hoverBehavior="InfoWindow" />
                    </dvt:map>