Return to search

An in-depth analysis of dynamically rendered vector-based maps with WebGL using Mapbox GL JS

The regular way of displaying maps in a web browser is by downloading raster images from a server and lay them side by side to make up a map. If any information on the map is changed, new images has to be downloaded, it cannot be done on the client. The introduction of WebGL opens up a whole new world of delivering advanced graphics content to the end user in a web browser. Utilizing this technology for displaying maps means only the source data is sent to the web browser where the map gets rendered using the device's GPU. This adds a number of benefits such as the ability of changing map appearance on the client, add new features to the map and often less data transfer. It however sets higher expectations of the client device's hardware as it needs to render the map at a high enough frame rate to not appear slow and unresponsive. This thesis investigates a framework for client side map rendering in a web browser, Mapbox GL JS, with focus on performance. It shows how map source data can be generated as well as its corresponding style rules are constructed with performance in mind. It provides benchmarking results of different map data sets with different detail intensity and shows that a device with good GPU performance is needed for an acceptable user experience. It also shows that lowering the amount of rendered detail does not necessarily result in better performance.

Identiferoai:union.ndltd.org:UPSALLA1/oai:DiVA.org:liu-121073
Date January 2015
CreatorsEriksson, Oskar, Rydkvist, Emil
PublisherLinköpings universitet, Programvara och system, Linköpings universitet, Tekniska fakulteten, Linköpings universitet, Medie- och Informationsteknik, Linköpings universitet, Tekniska fakulteten
Source SetsDiVA Archive at Upsalla University
LanguageEnglish
Detected LanguageEnglish
TypeStudent thesis, info:eu-repo/semantics/bachelorThesis, text
Formatapplication/pdf
Rightsinfo:eu-repo/semantics/openAccess

Page generated in 0.0026 seconds