HERE Real-Time Traffic Data

Currently, the Data Inspector Library provides two mechanisms for visualizing HERE Real-Time Traffic data (the Flow layer):

For implementation details, see the chapters below.

Visualization through Dedicated Plugin

The dedicated rendering plugin for HERE Real-Time Traffic data is included in the data schema of the Flow layer:

Traffic flow data visualization with the rendering plugin
Figure 1. Traffic flow data visualization with the rendering plugin

Note

When using a local Data Inspector instance, keep in mind that if no rendering plugin is found in the connected data schema of the Flow layer, the visualization automatically falls back to TrafficTileDataSource.

For more information on how to work with rendering plugins, see Create rendering plugins.

Visualization through TrafficTileDataSource

Note

Traffic flow data visualization through TrafficTileDataSource will be kept for the next 6 months and then deprecated. Consequently, only the dedicated rendering plugin will be used for visualizing HERE Real-Time Traffic data.

TrafficTileDataSource is used to visualize HERE Real-Time Traffic Data provided by the HERE platform.

To visualize traffic data from a catalog, follow these steps:

  1. Create an instance of TrafficTileDataSource and connect it to Data Service and MapView instance.

    const trafficDataSource = new TrafficTileDataSource({
       dataProvider: new DataProvider({
          hrn: "HRN string",
          layer: "Layer ID where data is stored",
          environment: "here",
          getToken: async () => "Your Token"
       })
    });
    mapView.addDataSource(trafficDataSource);
    
  2. To visualize the traffic data for a certain tile, call the selectTile method:

    trafficDataSource.selectTile(tileMortonCode);
    

Optional Parameters

  • intersectionAgent { InteractiveIntersectionAgent }: An instance of InteractiveIntersectionAgent that fires events when an intersection traffic item happens. It is used to set custom handlers on mouse over or mouse click on the traffic items.

Example App

Before you can visualize traffic flow data, you need to know the HERE Resource Name (HRN) of the layer that contains this data and the zoom level of the layer with traffic data. You can find the catalog HRN in the Data section of the portal.

To visualize HERE Real-Time Traffic Data from a catalog, follow these steps:

  1. Install the web app generator and enter your application name when prompted.

  2. When prompted What kind of data will you visualize on top of the Basemap?, select the option Traffic Flow data.

  3. When prompted HRN of the Catalog you want to visualize?, enter the HRN of the catalog that has traffic data.

  4. When prompted Name of the layer you want to visualize?, enter the name of the layer that contains traffic data.

  5. When prompted On which level the data is stored?, enter the level of the layer with traffic data.

  6. Once the code is generated, you can build and serve the web app by running the following command:

    npm run start
    

    To see the web app, open http://localhost:8080 in a web browser.

    To render the basemap, enter the credentials that you obtained from the platform portal.

results matching ""

    No results matching ""