ViTFlow: a platform to visualize tourists flows in a
rich interactive map-based interface
Diogo Redin, Diogo Vilela
Madeira-ITI
Tecnico – U. of Lisbon
Lisbon, Portugal
{diogo.redin, diogo.vilela}@tecnico.ulisboa.pt
Nuno Nunes
Madeira-ITI
Tecnico – U. of Lisbon
Lisbon, Portugal
njn@m-iti.org
Miguel Ribeiro
Madeira-ITI
Tecnico – U. of Lisbon
Lisbon, Portugal
jose.ribeiro@m-iti.org
Catia Prandi
Madeira-ITI
ARDITI
Funchal, Portugal
catia.prandi@m-iti.org
Abstract—In this paper, we describe ViTFlow, a platform to
visualize tourists flows, integrating different data sources into a
rich interactive map-based visualization. The data are collected
using low-cost routers, enabling wi-fi passive tracking, and
sensors, detecting environmental conditions, spread over the
Madeira Islands. Different types of data can be visualized in the
map-based interface, including spatio-temporal mobility data
(i.e., movements between places and common paths taken by
tourists), airplane and cruise ship traffic, weather information,
and official events. We designed the interface with the aim of
providing citizens and tourists with a public display to facilitate a
dialog between the different communities, exploiting synergies to
promote the sustainability of the archipelago.
Keywords—spatio-temporal data, mobility, tourism, map-based
interface, sustainability
I. INTRODUCTION
Island destinations represent a natural attraction for
tourists, who often exceed the number of inhabitants, creating
special challenges to sustainability [1, 2, 3]. That is the case of
the Madeira islands, where, on the one hand, tourism has an
important impact on the local economy (accounting for
approximately 20% of the region’s GDP), but on the other
hand, it affects the sustainability of the archipelago.
An initial step to overcome this challenge is to understand
the mobility patterns of tourists in the islands. That kind of
information is gathered by the infrastructure developed in the
BeanStalk project, exploiting a wi-fi tracking system and
environmental conditions and air quality sensors, located in
more than 60 points of interest in Madeira [4, 5].
Taking advantage of the APIs provided by BeanStalk, we
designed and developed ViTFlow, a platform to visualize
tourists flows, integrating different data sources into a rich
interactive map-based visualization. The idea behind the
system is to provide residents and tourists with a tool to
stimulate reflections and dialog, with the aim to promote the
suitability of the islands between the different communities.
II. THE SYSTEM
ViTFlow was built using Web Technologies, mainly
HTML5, CSS3, JavaScript and SVG. The application is
composed by different visualizations (layers) that enable users
to interact with the diverse animations, each one originated
from a data source and displayed in the map of the island.
When a user requests a layer, ViTFlow has a Node.js
application that establishes a connection with the Beanstalk
APIs and returns the data requested to the client in a JSON
format. Each visualization is integrated in the platform as a
module that handles its own data processing and animation.
Thanks to this structure, new visualizations can be created and
added to the application, using a defined template.
To render the visualizations, ViTFlow uses the SVG
transformation techniques, through the primitives provided by
the D3.js framework [6]. This framework is also exploited to
render the map, transforming the geographic coordinates of
the geoJSON format into absolute positions on the screen.
A. Interaction
The navigation menu, on the top left corner of the interface
(see Figure 1), allows to select multiple layers, from different
macro categories. At the bottom, there is a navigation time
graph, which displays historical data chronologically and
allows the selection of an official event (red dots in the
timeline of Figure 1), or a time window and a year. After
selecting the visualizations and the time window, the system
starts running an animation (at the selected speed), showing
the data changes on the map chronologically. During the
animation, the user can interact with the layer (by clicking and
moving the cursor) to obtain more details.
In order to enable residents and tourists to interact with the
animated visualizations using a public display, ViTFlow has
been designed to support the menu navigation and the
activation/deactivation of the layers by means of a gamepad,
through the mapping of the functionalities into the gamepad
buttons.
B. Available Data sources
Different data sources are explorable within the platform,
each one including different layers, as described below.
Activity. It includes visualizations related to the mobility in
the islands. With Movements it is possible to visualize how
people move across the time between various points of
interest, while Common Paths allows users to select a city and
see the most common paths that start on that city.
978-3-901882-99-9 ©2017 IFIP