Show TOC Start of Content Area

Procedure documentation Example for Displaying a Route  Locate the document in its SAP Library structure

The following example illustrates the use of the IWDGeoCoder and IWDGeoRouter interfaces of the BusinessGraphics UI Element Library and describes how it can be used to display a geographic route on a map.

The interfaces are used to display a route from SAP AG in Walldorf (near Heidelberg) to the Frankfurt Airport. Then the example application is run, a map section that includes the cities of Walldorf and Frankfurt first appears. Pressing the button labeled show route displays the route from Walldorf to the Frankfurt Airport.

This example illustrates:

·        How to build the GeoMap UI element

·        The corresponding context structure

·        The source text of the controller implementation

Procedure

Creating the Layout of View GeoRouteComponentView

       1.      Delete the UI element DefaultTextView that was automatically generated with the view.

       2.      Add GeoMap UI element GeoMap1.

       3.      Add text view UI element TextView1.

       4.      Add button UI element Button1.

Screenshot of view structure:

This graphic is explained in the accompanying text

...

Creating the Context Structure

       1.      Create context node GeoData of collection type List

       2.      Create context attribute GeoObject of type com.sap.ide.webdynpro.uielementdefinitions.GeoObject

This graphic is explained in the accompanying text

Defining Action ShowRoute

This graphic is explained in the accompanying text

Defining Data Binding of the User Interface Element Properties

To display an initial map section from Heidelberg to Frankfurt, the corresponding values are assigned t the top/left and bottom/right properties of the GeoMap UI element.

Property geoObjectSource of UI element BG is bound to context attribute GeoData.GeoObject. At runtime, the GeoData node elements define the values to display the start and end points of the route.

This graphic is explained in the accompanying text

The OnAction event of pushbutton Button1 is bound to action ShowRoute.

This graphic is explained in the accompanying text

 

Implementing a Controller

In this example, the addresses of the departure point and destination of the route are written directly in the source text of the controller implementation. However, you can also develop an application that would allow the user to display any desired route. To do so, you have to provide appropriate input fields to enter the addresses for the departure and destination points of the route. You can develop an application that offers this enhanced functionality using the tutorial for the geographic service itself.

Note

If you want to use the SAP icons as geographic objects, assign string "@<SAP icon ID>@", such as "@AV@" for an airplane icon, to the setImage method of the geographic point for type IWDGeoPoint. For a description and a listing of all possible SAP icons, see the SAP Design Guild at sapdesignguild.org/. Select the following path:
Sitemap
Resources  Visual Design & Icons SAP R/3 Icons R/3 Icon Lists. 
The ID of the image appears in the table of ID names for the SAP icons.

...

...

  //@@begin javadoc:wdDoModifyView

  /**

   * Hook method called to modify a view just before rendering.

   * This method conceptually belongs to the view itself, not to the

   * controller (cf. MVC pattern).

   * It is made static to discourage a way of programming that

   * routinely stores references to UI elements in instance fields

   * for access by the view controller's event handlers, and so on.

   * The Web Dynpro programming model recommends that UI elements can

   * only be accessed by code executed within the call to this hook method.

   *

   * @param wdThis Generated private interface of the view's controller, as

   *        provided by Web Dynpro. Provides access to the view controller's

   *        outgoing controller usages, etc.

   * @param wdContext Generated interface of the view's context, as provided

   *        by Web Dynpro. Provides access to the view's data.

   * @param view The view's generic API, as provided by Web Dynpro.

   *        Provides access to UI elements.

   * @param firstTime Indicates whether the hook is called for the first time

   *        during the lifetime of the view.

   */

  //@@end

  public static void wdDoModifyView(IPrivateGeoRouteComponentView wdThis, IPrivateGeoRouteComponentView.IContextNode wdContext, com.sap.tc.webdynpro.progmodel.api.IWDView view, boolean firstTime)

  {

    //@@begin wdDoModifyView

   

   IWDGeoMap geomap = (IWDGeoMap) view.getElement("GeoMap1");

  

   geomap.setLeft(geomap.getLeft());

   geomap.setRight(geomap.getRight());

   geomap.setTop(geomap.getTop());

   geomap.setBottom(geomap.getBottom());

 

    //@@end

  }

 

  //@@begin javadoc:onActionShowRoute(ServerEvent)

  /** Declared validating event handler. */

  //@@end

  public void onActionShowRoute(com.sap.tc.webdynpro.progmodel.api.IWDCustomEvent wdEvent )

  {

    //@@begin onActionShowRoute(ServerEvent)

         // read the User Input from Context and Add it to the WDGeoCoder.WDAddress   

         WDGeoCoderAddress addressStart = new WDGeoCoderAddress(

            "16","Neurottstraße","Walldorf","","69190","DE");

        

         WDGeoCoderAddress addressEnd = new WDGeoCoderAddress(

         "","Flughafen","Frankfurt","","60549","DE");

     

         // give the addresses to the geoCoder and let the geocoordinates calculate

         IWDGeoCoder geoCoder = WDGeoFactory.createGeoCoder();

         try {

            geoCoder.setIgsUrl(new URL("<The URL of the IGS>”));

            try {

               geoCoder.addAddress("0", addressStart);

               geoCoder.addAddress("1", addressEnd);

            } catch (WDException e1) {

               e1.printStackTrace();

            }

           

         } catch (MalformedURLException e) {

            e.printStackTrace();

         }

 

         geoCoder.execute();

 

         // GeoPositions and MapBorder --------------------------------------------------------------------

 

         WDGeoCoderResultAddress sResult = (WDGeoCoderResultAddress)
         geoCoder.getResultAddresses("0").get(0);

         WDGeoPosition startPos = sResult.getGeoPosition();

     

         WDGeoCoderResultAddress eResult = (WDGeoCoderResultAddress)
         geoCoder.getResultAddresses("1").get(0);

         WDGeoPosition endPos = eResult.getGeoPosition();

        

     

         // Calculate Route -------------------------------------------------------------------------------

         IWDGeoRouter geoRouter = WDGeoFactory.createGeoRouter();

         try {

            geoRouter.setIgsUrl(new URL("<The URL of the IGS>"));

         } catch (MalformedURLException e) {

            e.printStackTrace();

         }

  

         geoRouter.addStop("0", "0", startPos);

         geoRouter.addStop("1", "1", endPos);

     

         geoRouter.execute();

         List routeList = geoRouter.getRoutePath();

  

         // Add GeoObjects -----------------------------------------------------------------------------------

         // GeoLine: (Route)

         IWDGeoLine line = WDGeoFactory.createGeoLine("route");

         line.setPositions(routeList);

         line.setColor(java.awt.Color.blue);

         line.setWidth(4);

       

         IGeoDataNode geoDataNode = wdContext.nodeGeoData();

         IGeoDataElement geoDataElement;

         geoDataElement = wdContext.createGeoDataElement();

         geoDataElement.setGeoObject(line);

         geoDataNode.addElement(geoDataElement);

 

         //Start Point

         IWDGeoPoint geoStartPoint = WDGeoFactory.createGeoPoint("0");

         geoStartPoint.setTooltip("SAP");

         geoStartPoint.setPosition(startPos);

         geoStartPoint.setTriggersEvent(true);

         geoStartPoint.setSize(15);

         geoStartPoint.setColor(java.awt.Color.blue);

         geoStartPoint.setStyle(WDGeoPointStyle.ELLIPSE);

         geoStartPoint.setLabel("SAP");

         geoDataElement = wdContext.createGeoDataElement();

         geoDataElement.setGeoObject(geoStartPoint);

         geoDataNode.addElement(geoDataElement);

        

         //End Point

         IWDGeoPoint geoEndPoint = WDGeoFactory.createGeoPoint("1");

         geoEndPoint.setTooltip("Airport");

         geoEndPoint.setPosition(endPos);

         geoEndPoint.setTriggersEvent(true);

         geoEndPoint.setImage("@AV@");

         geoEndPoint.setLabel("Airport");

         geoDataElement = wdContext.createGeoDataElement();

         geoDataElement.setGeoObject(geoEndPoint);

         geoDataNode.addElement(geoDataElement);

        

    //@@end

  }

...

...

Result

When the application is started, a map section from Heidelberg to Frankfurt is displayed.

This graphic is explained in the accompanying text

When the user presses the show route button in the lower-right corner of the image, the route from Walldorf (SAP) to the Frankfurt Airport is displayed. The position of the Frankfurt Airport is marked with an airplane icon, which represents a geographic object.

This graphic is explained in the accompanying text

 

End of Content Area