Web Mapping & Analysis

Interactivity

Dani Arribas-Bel

Today

  • Interactiviy
  • Interactive (Web) Maps
  • Interactivity building blocks

Interactivity

Interactivity: what

“[…] two-way flow of information, […] responding immediately to the latter’s [user’s] input”

(OED)

  • Ability to dynamically modify a visualisation
  • Action/response as part of the experience

Interactivity: why

Munzner (2016):

  • Handle complexity
  • Cause the view to change
  • Support investigation at multiple levels of detail
  • Expand the capabilities of vis (many idioms depend on it)

Interactivity: when

“[when] seeing the dataset structure in detail is better than seeing only a brief summary of it”

Munzner (2016)

  • Too much to visualise all at once
  • Both “big picture” and “detail” matter

Interactive (Web) Maps

Interactive (Web) Maps

Image: A. Calafiore

Interactive (Web) Maps

  • Efficient medium for high information throughput (Tufte)
  • Maps as “windows” into large datasets
  • “A map of many maps”

Interactivity Building Blocks

Interactivity Building Blocks

  • Filtering
    • Pan
    • Zoom
    • Subset
  • Perspective
  • Volume
  • Tooltips
  • Split
  • Animate

Filtering

  • Widely used design choice in visualisation
  • Reduction of the set of elements being displayed
  • Discard geographically or attribute-based

Filtering: Pan

What “Travel” within a single scale

Use Segment a map geographically

Abuse Map is meant to focus on a single region

 Mapbox

Filtering: Zoom

What “Travel” across scales

Use Present different degrees of detail

Abuse Map is meant to focus at a single scale

 Mapbox

Filtering: Subset

What Restrict data showed (by attribute)

Use Explore patterns by value/category

Abuse Focus is on the global pattern

 GDSL

Perspective

What Modify the user’s point of reference

Use Different perspective fits the purpose of the map (e.g. car navigation)

Abuse Feature size matters

 Kepler.gl

Volume (3D)

What Add a (pseudo-)third dimension for display

Use Volume is relevant(e.g. height)

Abuse Almost any other case

 Kepler.gl

Tooltips

What Contextual (non-geo) information on-demand

Use Let the user explore feature (multi-media) attributes

Abuse Include more data than required in the tooltip

 Carto

Animate

What Add temporal dimension through compilation of slices

Use Explore space-time patterns

Abuse Communicate cross-sectional insights

 Carto

Split

What Overlay two maps of the same location

Use Compare overall pattern changes

Abuse When you need to view same location in both maps

 ipyleaflet

General tips

  • Think about the experience first, then consider the technology
  • Avoid feature creep
  • “Interactive” is not a binary

Creative Commons License
Web Mapping & Analysis by Dani Arribas-Bel is licensed under a Creative Commons Attribution-ShareAlike 4.0 International License.