Tutorial: Filter map content

In this tutorial, you learn how to use the Renderer Editor to select the map content that you want to show.

This image shows the result of the tutorial.

Assets for the tutorial

The starting point of this tutorial is the <KanziWorkspace>/Engine/plugins/maps/tutorials/FilteringMapContent/Start/Tool_project/FilteringMapContent.kzproj Kanzi Studio project.

You can find the completed tutorial in the <KanziWorkspace>/Engine/plugins/maps/tutorials/FilteringMapContent/Completed directory.

In Kanzi Studio, to see the tutorial project in the Preview, in the main menu select Kanzi Maps > Set Up Kanzi Maps. This way, you copy the Kanzi Maps library files to the Application/bin directory of the tutorial project.

Show roads

In this section, you add roads to the map.

To show roads:

1. In Kanzi Studio, open the <KanziWorkspace>/Engine/plugins/maps/tutorials/FilteringMapContent/Start/Tool_project/FilteringMapContent.kzproj project.

   The project contains an orthographic 2D map with Area Renderer nodes that render parks, water areas, and buildings.

2. In the Kanzi Studio main menu, select Kanzi Maps > Set Up Kanzi Maps.

   This way, you copy the Kanzi Maps library files to the Application/bin directory of the tutorial project.

   

3. If Kanzi Studio asks whether you want to set the map plugin credentials, click Yes and set up your Mapbox credentials. See Setting up your Mapbox credentials.

4. In the Node Tree in the MapView node, create a Stroke Renderer node and name it Major roads.

   Use the Stroke Renderer node to render roads, rivers, and borders. The Stroke Renderer renders stroked 2D and 3D line string geometry and stroked 2D polygons.

   

5. In the Properties, add and set:

   • Tags to KanziMaps_2D

     This way, you let the render passes know that this node renders 2D content.

   • Stroke Material to KanziMaps/Phong/MajorRoad_DynamicStroke

     This material supports dynamic stroke width.

   • Dynamic Stroke Width to enabled

     This way, you enable Kanzi Maps to vary the width of the road in the shader.

   

6. Select Kanzi Maps > Renderer Editor.

   Use the Renderer Editor to set layer and metadata filters that define the map features that a Renderer node renders.

   

7. In the Renderer Editor, set Layer to road.

   Make sure that the Major roads node is selected in the Node Tree.

   Kanzi Studio sets in the Major roads node the Stroke Layer Filter property to road.

   This way, you set the Major roads node to render on the map all line string content in the road layer. The road layer contains also polygon and point geometry, but these are not rendered, because the Stroke Renderer node:

   • Has the Stroke Polygons property disabled by default and does not render polygons.

   • Does not support rendering points.

   

Show only major roads

In this section, you filter the map content so that instead of showing all roads on the map, you show only major roads.

To show only major roads:

1. In the Node Tree, select the Major roads node. In the Renderer Editor in the Metadata Filter:

   1. Next to all match, click and select the is one of rule.

      

   2. Click bike_lane and set the key to class.

      

   3. Next to class is one of click to add a value.

      

      Tip

      In the metadata filter editor, hover over an item in the field menu to see its description generated from the Mapbox documentation.

      

   The Major roads node now renders only high-speed grade-separated highways.

   

2. In the class is one of rule, add these fields:

   • primary to render major highways that link large towns.

   • secondary to render highways that link large towns.

   • tertiary to render roads that link small settlements, or the local centres of a large town or city.

   • trunk to render important roads that are not motorways.

   Tip

   To edit the metadata filter, use these keyboard shortcuts:

   Action	Shortcut
   Move the keyboard focus in the list of rules and values.	↑ (Up Arrow) and ↓ (Down Arrow) keys
   Add a value after the selected value.	Tab key
   Copy the selected rule or value.	Ctrl C keys
   Cut the selected rule or value.	Ctrl X keys
   Paste the selected rule or value.	Ctrl V keys
   Remove the selected rule or value.	Delete key

   

   Kanzi Studio sets in the Major roads node the Stroke Metadata Filter property to the expression that matches the filter that you created in the Renderer Editor:

   class == {motorway, primary, secondary, tertiary, trunk}
   

   The map now shows all major roads, including those in underwater tunnels.

   

3. In the Renderer Editor:

   1. Next to all match, click and select the is not rule.

   2. Set the key to structure.

   3. Set the value to tunnel.

   The map now shows all major roads, except for the ones in tunnels.

   

See also

To learn more about using the Stroke Renderer node, see Using the Stroke Renderer node.

To learn more about using the Renderer Editor, see Using the Renderer Editor.