3D Interchange Viewer and Walk Planner

Richard Shaw
Anyone who has ever planned a walking route using one of the online services available, or navigated on foot using a mobile phone’s mapping service, may have spotted that it stops working as a building is entered and it fails to provide adequate information about levels and heights.


The UK Government, public transport authorities and operators and some Not for Profit accessibility organisations have spent considerable time collecting information about public transport interchanges, which is then delivered to the public in a number of ways (e.g. lines on a flat 2D map, text descriptions and flow chart diagrams). All of these fail to give the traveller a ‘feel’ for what the terrain will be like once they get to the interchange. Switching the 2D map background to aerial photography or using the street level 3D photography can help in some respects but it falls short once a building is entered (such as a railway station or more importantly an underground station).

This project attempts to address these issues by rendering an interchange as a 3D model with clear separation of levels that makes it much more obvious where stairs, escalators and lifts are required without the need for a textual description. When a route through the model has been calculated, the user can ‘fly’ or ‘walk’ the route by starting an animation which follows the route from origin to destination. In a future version the user’s position will be tracked in real time to navigate the route like a sat nav.

A secondary problem is the lack of information about the availability of roadside footpaths and the disappointing lack of a walk planner that uses footpaths rather than road centre lines.

Source Data

The choice of source data has a large bearing on the project. Some data sets are country-centric, some carry large licence costs and almost all are ‘closed’ (i.e. the data cannot be edited by the user). The latter was deemed to be the biggest hurdle because none of the available data sets contains enough detail about interchanges to produce the desired 3D models. A new system would need to be created to store and manage additional data before the real task at hand could be addressed – the 3D drawing.

OpenStreetMap was eventually selected because it provides a world view (although sometimes incomplete). It also provides the ability to add extra data. OpenStreetMap has a further advantage in that some indoor interchanges have already been mapped, such as Newcastle Monument Metro Underground Station.

Before any 3D drawing could be done a technology needed to be selected. A technology that was portable to various devices was desirable. HTML5 Canvas was chosen, with the ThreeJS open source javascript library. This combination has the benefit that, on some devices, hardware acceleration can be used to render the 3D model (via WebGL) and, as a fallback, the three.js library will perform software rendering in 3D.


 3D rendering of Milibank tower

Figure 1. Milibank Tower, London


There were two key issues relating to the actual drawing; Interpreting the source data and converting road centrelines into 3D roads.

As the tool only draws a 3D model of approximately one square kilometre, the interpretation issue was relatively easy to solve by converting the data into a common format as it is being loaded.

Road centrelines were converted into solid roads by creating a pair of lines parallel to the centreline, each half the road width away. The intersections of these lines with the parallel lines for the next section of road were then calculated to create a seamless join at junctions.

When these lines were used to draw the roads in the 3D world, they worked well except for acute angles which caused spikes in the model, short links which caused gaps to appear, gaps appearing at the top/bottom of stairs and lifts which could not be rendered because of their vertical nature (they were eventually drawn as blue cylinders).


 3D rendering of Westminster, London

Figure 2. Westminster, London (Height data exists for the palace but not the abbey)


Walk Planning

A simple walk planning algorithm was added for the initial version of the project to calculate a shortest path along road/path centrelines. The only additional feature added at this stage is the ability to avoid stairs, causing the algorithm to use lifts, ramps, or return ‘no route found’. The user can select their start and end points by clicking on the map or selecting one of the bus stops rendered as billboards in the 3D model.

Preliminary work has started to plan on the footpaths instead of road centrelines. A new attribute was added to OpenStreetMap to indicate whether a road has a footpath on the left, right or both sides, or has no footpath at all. This is used to render a 2D map of all footpaths to show what is available for routing. The key issue to address is where to allow road crossing (in addition to the pedestrian crossing defined in the source data).


The ability to ‘fly’ (3rd person sky view) and ‘walk’ (1st person street view) has been developed, but tracking the navigation of a route needs to be added. Research suggests two options for indoor navigation; using wifi router triangulation or dead reckoning. However, wifi is unlikely to work in an underground station. A Munich University project has shown some promising results with indoor dead reckoning using a mobile phone’s digital compass and accelerometer. A simple approach may be the best solution – show the ‘walk’ animation in real time and ask the user to press a button each time they come to a corner. If they arrive sooner it will advance the animation and if they arrive later it will continue the animation.


The work produced so far has generated quite a bit of interest from various sources: Traveline, (the UK public transport partnership) have added it to their list of desirable things for the future and the Atkins Pavement Design Team have suggested potential for integrating it with their 2D line of sight product.

The next steps are to find a partner to assist with funding and then to improve the quality of the rendered images (potentially with textures), migrate to mobiles phones, add navigation tracking and develop the pavement walk planner.

Written by