Vectorkaarten

De toekomst voor digitale kaarten

Bij Jimbo zijn we overtuigd van de mogelijkheden van vectorkaarten en geloven dat dit de toekomst is voor digitaal kaartmateriaal. In dit document proberen we uitleg te geven over wat vectorkaarten zijn, wat het verschil is met (huidige) bitmapkaarten en wat de voor(- en na)delen zijn.

Wat zijn vectorkaarten

Om het verschil tussen vector- en bitmapkaarten uit te leggen moeten we eerst kijken naar de verschillen tussen vector- en bitmapafbeeldingen. Bitmap (of raster-)afbeeldingen bestaan uit rijen gekleurde punten (pixels) die samen de afbeelding vormen. Deze opbouw zie je als je de afbeelding sterk uitvergroot, waardoor het beeld blokkig of onscherp wordt:

Het effect van uitvergroten (Bron: wikipedia)

Vectorafbeeldingen bestaan niet uit pixels maar uit mathematische beschrijvingen van een aantal primitieven (zoals curves, cirkels, vierkanten), met daarbij attributen als dikte, kleur, invulling, etc. Bij het sterk uitvergroten van een vectorafbeelding gaan details niet verloren en blijft de afbeelding scherp, ongeacht hoever uitvergroot wordt.

Beeldbewerkingsoperaties zoals rotatie en verplaatsen (en dus ook schaling) zijn eenvoudiger bij vectorafbeeldingen en zorgen niet voor kwaliteitsverlies, zoals dat bij bitmapafbeeldingen wel het geval is.

Hoe werken vectorkaarten

Vectorkaarten maken dus gebruik van vectordata voor de weergave van kaartmateriaal. Verder lijken ze erg op bitmapkaarten in hoe ze werken (zgn. ‘slippy maps’). Beide delen het kaartmateriaal op in verschillende niveaus, afhankelijk van het gewenste detailniveau. Neem als voorbeeld een kaart van de wereld:

Hoe werkt een ‘slippy map’

Bij beide methoden werken ongeveer als volgt. De kaartdata (in dit voorbeeld de wereld) wordt opgedeeld in blokken (zgn. ‘tiles’). Op het hoogste niveau zijn er (bijvoorbeeld) 4 blokken, waarbij, als er ingezoomd wordt op blok 1, dit blok verder opgedeeld wordt in 4 andere blokken (10 t/m 13), en als er op blok 13 wordt ingezoomd, er weer 4 blokken ontstaan (130 t/m 133), etc. Dit proces wordt herhaald tot een van te voren bepaald maximaal zoomniveau (in dit voorbeeld dus 3).

In het geval van bitmapkaarten wordt er voor elk blok/zoomniveau een bitmapafbeelding gemaakt, in het geval van vectorkaarten wordt een blokje met data gemaakt waar alle geografische informatie zit benodigd voor het tonen van het blok op dat zoomniveau. Denk hierbij aan landschapscontouren, gebouwen, straatnamen + huisnummers, etc. Deze informatie is georganiseerd in verschillende lagen, die bovenop elkaar worden geprojecteerd. Voor het weergeven van een dergelijk blok wordt deze data in lagen gecombineerd met stijlinformatie die bepaalt hoe de data weergegeven moet worden. Deze stijlinformatie kan zeer uitgebreid zijn en geeft antwoord op onder meer de volgende vragen:

• Wat is de dikte van een snelweg op dit zoomniveau?
• Wat is de kleur van water?
• Moeten gebouwen worden getoond op dit zoomniveau?
• Wat is het symbool voor een restaurant?

Deze scheiding van geografische informatie en stijlinformatie maakt het mogelijk om dezelfde kaartdata er compleet verschillend eruit te laten zien, afhankelijk van het gewenste gebruik. Zal de kaart gebruikt worden voor navigeren in een natuurgebied, dan zijn ‘natuureigenschappen’ (wandelpaden, gebiedstype, hoogtelijnen) van het landschap interessanter en kan daar de focus op liggen:

Andersom zal een kaart die gebruikt wordt voor navigatie in een auto de nadruk meer kunnen leggen op aspecten als (snel)wegen, maximum-snelheid, fileinformatie en wegwerkzaamheden:

Deze mogelijkheden zijn er natuurlijk ook voor bitmapkaarten, maar vanwege het feit dat alle informatie in de afbeeldingen ligt besloten, zijn deze een stuk minder flexibel. Om beide voorbeelden hierboven mogelijk te maken voor bitmapkaarten, zullen twee keer alle tiles gemaakt moeten worden. Voor vectorkaarten hoeft er slechts een omschakeling plaats te vinden van de stijlinformatie.

Een bijkomend voordeel van vectorkaarten is dat de geografische data benodigd voor het tonen van de kaarten vaak vele male kleiner is dan die van bitmapkaarten. Dit verschil kan oplopen tot een factor 3 tot 5, en wordt alleen maar groter naarmate er voor diepere zoomniveaus kaartmateriaal gegenereerd moet worden. Dit verschil wordt veroorzaakt doordat:

• Vectordata is in het algemeen (stukken) kleiner van omvang dan bitmapdata
• Op diepere zoomniveaus is er over het algemeen steeds minder onderscheidend detail beschikbaar (op het niveau van een vierkante millimeter is er geografisch gezien meestal weinig te melden). Qua vectordata betekent dit: weinig data nodig voor een dergelijk blok, voor bitmapdata betekent dit dat er alsnog een volledige afbeelding (waarschijnlijk een egaal blok) voor het blok gemaakt dient te worden.

Dit heeft tevens tot gevolg dat er bij vectorkaarten met minder diepe zoomniveaus hetzelfde bereikt kan worden als bitmapkaarten met een dieper zoomniveau.

Voor- en nadelen

Er zijn dus veel voordelen van het gebruik van vectordata. Opgesomd:

1. De hoeveelheid data is stukken kleiner (~ factor 4) dan bij gebruik van bitmapdata, oplopend naarmate het kaartgebied groter is en meer zoomniveaus heeft. Dit is voornamelijk interessant voor het offline gebruik van kaartmateriaal.
2. Er zijn meer details bij vergelijkbare zoomniveaus als bitmapdata.
3. ‘Overzoom’ (verder zoomen dan de data toelaat) mogelijkheden zijn uitgebreider. Dit is hetzelfde verschil als het sterk uitvergroten van bitmap- vs. vectorafbeeldingen in de eerste afbeelding.
4. Schalen, roteren en perspectiefmode (bij navigeren) zijn eenvoudiger te realiseren dan bij bitmapdata.
5. Traploos schalen behoort tot de mogelijkheden. Vanwege het discrete karakter van zoomniveaus is het bij bitmapkaarten lastig om tussen 2 zoomniveaus in te gaan zitten. Bij vectorkaarten is dit triviaal.
6. Er is meer interactiviteit mogelijk omdat de data direct beschikbaar is; zo kan een klik op een weg, een gebouw of een natuurgebied worden geïnterpreteerd en relevante informatie getoond worden. Dit kan niet bij bitmapkaarten.
7. Door de scheiding tussen data en styling zijn er veel meer weergavemogelijkheden, zoals de dynamisch aanpasbare stijl: zo kunnen kaartlagen aan- en uitgezet worden, of minder relevante informatie uitgefilterd, waar je als gebruiker op dat moment niet in bent geïnteresseerd.
8. Andere toepassingen van de dynamische stijl: vergroten van (straat)namen bij slechte leesbaarheid, highlighten van een route of een weg, kenmerken als pinautomaten of tankstations (on)zichtbaar maken.

Nadelen

Er zijn natuurlijk ook nadelen. Te weten:

1. Het weergeven van vectorkaartmateriaal (zgn. ‘renderen’) is ingewikkelder dan het tonen van bitmapafbeeldingen. Dit resulteert in een trager mechanisme. Dit is pas echt merkbaar bij oudere desktops en smartphones. Bij enigzins moderne apparaten zul je hier geen last van hebben.
2. Huidige technieken (zoals mapbox) voor het tonen van vectorkaarten maken gebruik van WebGL, wat niet overal ondersteund wordt. Volgens de site WebGL Stats staat de totale ondersteuningsgraad (desktop/smartphone/tablet/console) op het moment van schrijven op 96%. Verreweg de meeste moderne browsers ondersteunen het.
3. Niet elk kaartmateriaal is geschikt voor vector. Als het gaat om historisch kaartmateriaal of satelliet-beeldmateriaal (met andere woorden: het bronmateriaal is bitmap), dan is bitmap nog steeds the way to go.
4. Het is een relatief nieuwe technologie. Dit neemt niet weg dat het al op grote schaal ingezet wordt (veel grote partijen zoals google en apple gebruiken het al), maar nog niet overal.

Conclusies (tl;dr)

Wij zijn van mening dat vectorkaarten de toekomst hebben. Voor (traditionele) geografische kaarten zijn er veel voordelen en bieden vectorkaarten een betere, prettiger gebruikerservaring. De scheiding tussen data en stijling maken het mogelijk om prachtige en unieke kaarten te genereren. Zeker op mobiele devices en bij offline gebruik zijn de mogelijkheden groot en wegen de voordelen ruim op tegen de nadelen.

Voorbeelden

Tot slot nog een kleine collage van een greep uit verschillende mogelijke kaartstijlen. Bedankt voor het lezen!

Kijk voor meer informatie op http://www.jimbo-platform.nl

Voorbeelden van kaartstijlen (bron: Mapbox)