Interactive Rendering and Stylization of Transportation Networks using Distance Fields

Matthias Trapp, Amir Semmo, Jürgen DöllnerHasso Plattner Institute, University of Potsdam, Germany

INTRODUCTION

Towards Cartography-oriented Stylization

Paris Street Map – 1780

P1: contour lines surround fine-textured fills or solid colors to add visual contrast and improve figure-ground perception

P2: primary streets overlap secondary or tertiary streets in hierarchical representations of street networks; wavy or fuzzy to express uncertainty

P3: names follow principal line directions and are placed within streets or outside line segments

London Street Map – 1913

London Underground Map – 1933

Modern Tourist Map of Paris

P7: yellow established as a conventional color tone for main streets, with a discrete gradation towards grey and white shading for tertiary roads

P6: streets are tinted using qualitative color schemes to represent street classes and distinguish them from the underlying terrain

P5: a hierarchy of emphasis is drawn among reference elements, such as different line weights and colors to portray different grades of roads

P4: dynamic filtering and scaling of geometric features improves perception of roads at high view distances and avoids cluttering.

Conceptual and Technical Requirements

Pre-processing of discrete level-of-details consume additional memory and yield incoherent rendering when switching between these levels during zooming or within perspective projection.

Levels-of-Detail should be computed during rendering based on viewing settings

Increasingly detailed networks require high amounts of main/video memory.

Network representation should exhibit a small memory footprint and fast updates

View-dependent cartographic stylization of transportation networks are key features for a number of applications.

Rendering technique should provide a sufficient parameterization, i.e., covering level-of-detail rendering, interactive filtering, and highlighting

RELATED WORK

Related Work :: Overview

Street Rendering Approaches

Object-space Approaches

Geometry-based Approach

Texture-based Approach

Screen-Space Approaches

Stencil-based Approach

Discard-based Approach

Geometry-based Approach

Basic Principle:

Pre-compute geometry at different LoD

Forward rendering geometry

Most flexible approach w.r.t. stylization

Limitations:

High memory consumptions for complex networks

No transitions between static LoD

High rendering costs

Texture-based Approach

„Interactive 3D Visualization of Vector Data in GIS”O. Kersting, J. Döllner, ACM GIS 2002

Basic Principle:

Generate texture trees from geometry

Off-screen rendering at different resolutions

Use for texturing during scene rendering

Limitations:

Relies on data pre-processing

Requires intermediate representation

Suffers from texturing artifacts

Stencil-based Approach

„High-Quality Cartographic Roads on High-Resolution DEMs” M. Vaaraniemi, M. Treib, R. Westermann, WSCG Journal 2011

Basic Principle:

Generate shadow volume per street segment

Avoid cracks between segments using cap cones

Enables distance-based scaling of street segments

Rendering using shadow volume approach

Limitations:

Requires additional data structure (volumes)

Limited styling capabilities (color + outline)

Discard-based Approach

„A screen-space approach to rendering polylines on terrain”D. Ohlarik, P. Cozzi; SIGGRAPH Poster 2011

Basic Principle:

Extrude polylines to walls

Compute intersection with terrain

Discard fragments accordingly

Avoid dashing and smearing

Limitations:

Stylization with single color only

No distance-dependent segment width

Distance-fields for Stylization Parametrization

„ Real-Time Rendering of Water Surfaces with Cartography-Oriented Design” A. Semmo, J. E. Kyprianidis, M. Trapp, J. Döllner; CAe 2014

APPROACH

Overview of Approach

Forward Rendering Pass Deferred Rendering Pass

Open Street Map (OSM) Data Representation

Overview of Distance-Field Generation

Geometry Generation

Attributed Vertex Cloud+

Geometry Shader+

Vertex Pulling

Encoding of Distance using Texturing

dresult = min(dsource , ddestination)

Blending Modes

No Blending Min-Blending

Distance Field Colored Distance Field Colored

Result: 2D Texture-Array

Memory consumptions: #layer width height precision (3 * 32 Bit = 12 Byte)

Evaluation of Distance Fields :: Procedural Textures

Procedural textures evaluated on a per-fragment basis:

Deferred texturing based on distance fields

Application of procedural and image textures possible

Bottom-up compositing based on street rank

“Improved Alpha-Tested Magnificationfor Vector Textures and Special Effects”Chris Green; SIGGRAPH 2007

Final Compositing Step

Bottom-up evaluation of each layer (street category) and blending

RESULTS & DISCUSSION

Application Examples :: Distance-based Evaluation

Application Examples :: Stylization Variants

Application Examples :: Regions-of-Interest

Application Examples :: Regions-of-Interest

Performance Evaluation

Test data sets of different complexityfrom Open Street Map (OSM) data base

Approach is fill-limited w.r.t. number ofstreet categories to render

ID Data Set # Nodes #Ways

A Berlin 1 5571 1028

B Istanbul 2004 263

C Berlin 2 9502 1766

A B C A B C A B C

390 x 260 670 x 450 1280 x 800

1 Category 3 2.9 3 3 2.9 3 25.5 25.4 25.3

2 Categories 3.2 3.3 3.4 3.2 3.3 3.4 29 29 29.2

4 Categories 4.1 4.1 4.2 4.1 4.2 4.2 36.1 26.2 36.2

8 Categories 5.5 5.4 5.5 5.7 5.6 5.8 50.1 50.1 50.2

0

10

20

30

40

50

60

Mill

ise

con

ds

Limitations

Distance-field generation:

Intrusion

Protrusion

Memory consumptions for large numbers of categories

Intrusion

Protrusion

Future Work :: Geometry Draping

Draping

Digital Elevation Model Result

Planar Network Geometry

Future Work :: Geometries

Generate alternative geometric representations

View-dependent adaptation of geometric representations

Conclusions

A concept for high-quality cartographic rendering exemplifiedfor complex street networks.

Interactive hardware-accelerated rendering technique havingminimal memory footprint for network representation.

Interactive stylization and colorization using deferred texturingbased on distance fields generated on per-frame basis

Potentials for future research

Questions & Comments ?

Contact:

Matthias Trapp / matthias.trapp@hpi.de

Amir Semmo / amir.semmo@hpi.de

Jürgen Döllner / juergen.doellner@hpi.de

Publications: www.4dndvis.de/publikationen.html

This work was funded by the Federal Ministry of Education and Research (BMBF), Germany within the InnoProfile Transfer research group "4DnD-Vis".

Interactive Rendering and Stylization of Transportation Networks using Distance Fields

Matthias Trapp, Amir Semmo, Jürgen DöllnerHasso-Plattner-Institut, University of Potsdam, Germany