Configuring Siebel Open UI > Customizing Styles, Applets, Fields, and Controls > Customizing Applets >

Customizing List Applets to Render as Maps

A list applet can be configured to display a map instead of a standard list of records. When the list applet is configured to display a map, the following features are available:

• Markers. A marker is displayed on the map at the location address for each record.
• Contextual menu. Clicking a marker reveals a contextual menu with the following options:
  • View Details. Clicking this option opens a pop-up dialog box with details about the record associated with the marker.
  • Select. Clicking this option zooms in on the map to the location address associated with the marker record.
• Tooltip. When you hover over a marker, a tooltip is revealed, showing the address associated with the record.
• Map panning.
• Map zooming.

The example in this topic describes how to customize Siebel Open UI to render a list applet as a map in Siebel Open UI.

To customize list applets to render as maps

1. Add files to the manifest:
   1. Log in to a Siebel client with administrative privileges.

      For more information about the screens that you use in this step, see Configuring Manifests.

   2. Navigate to the Administration - Application screen, and then the Manifest Files view.
   3. In the Files list, add the following files. You must add a separate record for each file:

   siebel/mappmodel.js

   siebel/maprenderer.js

2. Administer the manifest for the applet:
   1. Navigate to the Administration - Application screen, and then the Manifest Administration view.
   2. In the UI Objects list, specify the following applet.

      Field	Value
      Type	Applet
      Usage Type	Physical Renderer
      Name	Applet Name Where Applet Name is the name of the applet in which you want the map to appear.

   3. In the Object Expression list, add the following expression. Siebel Open UI uses this expression to render the applet on a desktop platform.

      Field	Value
      Expression	Desktop
      Level	1

   4. In the Files list, add the following file:

   siebel/custom/maprenderer.js

   5. In the UI Objects list, specify the following applet.

      Field	Value
      Type	Applet
      Usage Type	Presentation Mode
      Name	Applet Name Where Applet Name is the name of the applet in which you want the map to appear.

   13. In the Object Expression list, add the following expression. Siebel Open UI uses this expression to render the applet on a desktop platform.

       Field	Value
       Expression	Desktop
       Level	1

   14. In the Files list, add the following file:

   siebel/custom/mappmodel.js

3. Define the PM user properties:
   1. Open Siebel Tools.

      For more information about using Siebel Tools, see Using Siebel Tools.

   2. In the Object Explorer, click Applet.
   3. In the Applets list, query the Name property for the applet that you must modified in Step 2.
   4. In the Object Explorer, expand the Applet tree, and then click Applet User Property.
   5. In the Applet User Properties list, create four new applet user properties. Use values from the following table.

      Name	Value
      MapMarkerLocation	Business Component
      MapMarkerTitle	Business Component
      MapSelectedRowImage	The SVG image, as added in the CSS
      MapUnSelectedRowImage	The SVG image, as added in the CSS

      When specifying the Value field for the MapMarkerLocation and the MapMarkerTitle, the business component specified must meet at least one of the following conditions in order to properly display the markers on the map:

      • It must be exposed in the list column of the list applet configured for the map.
      • It must be exposed as an applet control or list column of a sibling applet to the map applet of the same business component.
      • It must be set as a private field.
   6. Compile your work.
4. Define the Web Template for the map:
   1. Open Siebel Tools.

      For more information about using Siebel Tools, see Using Siebel Tools.

   2. In the Object Explorer, expand the Applet tree, and then click Applet Web Template.
   3. In the Applet Web Templates list, add the following applet Web template.

      Property	Description
      Name	Enter text that describes the visualization behavior. For example, enter Map View to describe a map visualization.
      Type	Edit List
      Web Template	Choose a Web template that defines the desired visualization. For example, choose Applet Map.

   4. Make sure Siebel Tools defines ODH for the Web template that you defined in Step c.

      For example, make sure the Web Template Definition column in Siebel Tools includes ODH for Applet Map template. If your deployment requires a new Web template, then you must define it before you can define the applet Web template. For more information about configuring Web templates, see Configuring Siebel Business Applications.

5. Test your modifications:
   1. Clear the browser cache.
   2. Refresh the list applet that you modified in Step 2.
   3. Make sure that it renders a map.