Difference between revisions of "About"

From Visual Analytics and Applications
Jump to navigation Jump to search
 
(14 intermediate revisions by 2 users not shown)
Line 1: Line 1:
 +
<div style=background:#2B3856 border:#A3BFB1>
 +
 +
<font size = 5; color="#FFFFFF">Discovering traffic patterns by using network graph visualisations</font>
 +
</div>
 
<!--MAIN HEADER -->
 
<!--MAIN HEADER -->
 
{|style="background-color:#1B338F;" width="100%" cellspacing="0" cellpadding="0" valign="top" border="0"  |
 
{|style="background-color:#1B338F;" width="100%" cellspacing="0" cellpadding="0" valign="top" border="0"  |
| style="font-family:Century Gothic; font-size:100%; solid #000000; background:#2B3856; text-align:center;" width="20%" |  
+
| style="font-family:Century Gothic; font-size:100%; solid #000000; background:#2B3856; text-align:center;" width="15%" |  
 
;
 
;
 
[[Introduction| <font color="#FFFFFF">Introduction</font>]]
 
[[Introduction| <font color="#FFFFFF">Introduction</font>]]
  
| style="font-family:Century Gothic; font-size:100%; solid #1B338F; background:#2B3856; text-align:center;" width="20%" |  
+
| style="font-family:Century Gothic; font-size:100%; solid #1B338F; background:#F5F6CE; text-align:center;" width="15%" |  
 
;
 
;
[[About| <font color="#FFFFFF">About</font>]]
+
[[About| <font color="#1C1C1C">About</font>]]
  
| style="font-family:Century Gothic; font-size:100%; solid #1B338F; background:#2B3856; text-align:center;" width="15%" |  
+
| style="font-family:Century Gothic; font-size:100%; solid #1B338F; background:#2B3856; text-align:center;" width="18.33%" |  
 
;
 
;
 
[[Project Proposal| <font color="#FFFFFF">Project Proposal</font>]]
 
[[Project Proposal| <font color="#FFFFFF">Project Proposal</font>]]
  
| style="font-family:Century Gothic; font-size:100%; solid #1B338F; background:#2B3856; text-align:center;" width="15%" |  
+
| style="font-family:Century Gothic; font-size:100%; solid #1B338F; background:#2B3856; text-align:center;" width="18.33%" |  
 
;
 
;
[[Project Timeline| <font color="#FFFFFF">Project Timeline</font>]]
+
[[Project Timeline| <font color="#FFFFFF">Data Preparation</font>]]
  
| style="font-family:Century Gothic; font-size:100%; solid #1B338F; background:#2B3856; text-align:center;" width="15%" |  
+
| style="font-family:Century Gothic; font-size:100%; solid #1B338F; background:#2B3856; text-align:center;" width="18.33%" |  
 
;
 
;
 
[[App & Deliverables| <font color="#FFFFFF">App & Deliverables</font>]]
 
[[App & Deliverables| <font color="#FFFFFF">App & Deliverables</font>]]
Line 28: Line 32:
 
|}
 
|}
 
<!--MAIN HEADER -->
 
<!--MAIN HEADER -->
== About this project ==
+
== Abstract ==
The project here aims to solve the questions posed in the Visual Analytics Science and Technology challenge [[http://www.vacommunity.org/VAST+Challenge+2017]]. The team chose the project, as it gives a chance to apply varied concepts of visualizing through geography, image sensing and sensor detection. An amalgamation of the three different mini challenges [[http://www.vacommunity.org/VAST+Challenge+2017#Overview]] allows the group to build an unified application to explore the unknown, to unlock the potential reasons on why the Red Pipit bird is disappearing. Whilst this might not be a real world data set, the application of these kind of data is very much pragmatic.
+
 
 +
<p><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: 400; font-variant: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;">Transportation networks are key lifelines that aid movement of people, goods, services and resources that are vital to the productivity of a nation. A good visualization of corridors along which vehicular transport moves is key in understanding patterns of such movement. Using a dataset that captures that timestamp information of vehicles passing through a wildlife preserve, a network visualization application is created using R Shiny as the platform. The insights derived can help understand metrics such as traffic density along corridors, the directions of traffic flow, and the daily and seasonal patterns of traffic flow.</span></p>
  
 
==Motivation==
 
==Motivation==
  
In regions with minimal human access such as the wildlife preserve shown in the challenge, drones are fast gaining traction. This kind of application is aimed to provide an insight on how to carry out path analysis, how to trace anomalies based on wind data and how to use satellite imagery, to get a clearer picture and draw out an inference.
+
<p style="line-height: 1.38; margin-top: 0pt; margin-bottom: 0pt; text-align: justify;"><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: 400; font-variant: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;">Network patterns can reveal very interesting insights but it is very difficult to implement with off-the-shelf software tools such as Tableau&reg;. Gephi&reg;, an open-source and free software is one of the leading tools to visualise network graphs. But, in order to make our findings easily accessible to everyone without any installation of any tools at their end, we propose the usage of the recently introduced </span><em><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: 400; font-variant: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;">ggraph</span></em><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: 400; font-variant: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;"> package from R. Besides bringing the same kind of flexibility offered by a commercial tool, it offers an extension on the well-acclaimed ggplot2 package in R. Built specifically for supporting relational data structures such as networks, graphs and trees, the API provides a self-contained set of facets and customisations, enhancing the quality of visualisations.</span></p>
 +
 
 +
<p style="line-height: 1.38; margin-top: 0pt; margin-bottom: 0pt; text-align: justify;"><br /><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: 400; font-variant: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;">Besides providing custom made visualisations to find out the traffic flow between various nodes in a predefined geography, the links that connect the nodes can also be represented with various measures of the user&rsquo;s choice. In this case, the relevant choice is chosen to be traffic density. In addition to </span><em><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: 400; font-variant: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;">ggraph </span></em><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: 400; font-variant: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;">which provides a comprehensive network, we add an interactive version with the well known </span><em><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: 400; font-variant: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;">ggplotly </span></em><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: 400; font-variant: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;">which helps to provide interactivity to the nodes and edges, along with hoverable tooltips which give users a quick visual summary.</span></p>
 +
 
 +
==Practical use cases==
 +
 
 +
<p style="line-height: 1.8; margin-top: 3pt; margin-bottom: 1pt; margin-left: 0pt; text-align: justify;"><span style="font-size: 11pt; font-family: Arial; color: #252525; background-color: transparent; font-weight: 400; font-variant: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;"> In a country like Singapore with limited land space, the problems of congestion can be extremely severe. Congestion can bring about several repercussions such as the monetary value of time spent in traffic jams, increased fuel consumption resulting in air pollution, stressed and frustrated motorists leading to an increase occurrence of road rages incidents and higher chances of accidents due to reasons such as tailgating etc.</span></p>
 +
<p style="line-height: 1.8; margin-top: 3pt; margin-bottom: 1pt; margin-left: 0pt; text-align: justify;"><span style="font-size: 11pt; font-family: Arial; color: #252525; background-color: transparent; font-weight: 400; font-variant: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;">Singapore has several sources which provide real time traffic conditions. They include junction eyes, green link determining system (GLIDE), webcams and parking guidance system (PGS) etc. These data can be fed into our model to provide a traffic network map of Singapore. The sources collecting the data will be equivalent to the nodes. Using centrality measures to identify the nodes experiencing a higher volume of traffic, LTA can choose to install additional gantries there, raise existing ERP pricings to divert traffic or expand the road to accommodate a heavier volume of traffic and smoothen the flow.</span></p>
 +
 
 +
==About the Dataset==
 +
 
 +
<p style="line-height: 1.38; margin-top: 0pt; margin-bottom: 0pt; text-align: justify;"><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: 400; font-variant: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;">The data for designing the interactive application is obtained from the [http://vacommunity.org/VAST+Challenge+2017+MC1 Visual Analytics Science and Technology Challenge, 2017]. The dataset involves 4 attributes, namely the timestamp, car-id, car-type and gate-name. A snippet is as shown below. A particular car (Car-id) passing through a check point (Gate-name) is recorded at a particular instance of time (Timestamp) through an RFID tag. The Car-type indicates the type of car, where Car-type 2 indicates a 2-axle truck. A snippet of the dataset is as shown below. </span></p>
 +
<p>&nbsp;</p>
 +
<table style="border: none; border-collapse: collapse; width: 468pt;">
 +
 
 +
<tr style="height: 0pt;">
 +
<td style="vertical-align: top; padding: 5pt 5pt 5pt 5pt; border: solid #000000 1pt;">
 +
<p style="line-height: 1.2; margin-top: 0pt; margin-bottom: 0pt;"><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: 400; font-variant: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;">Timestamp</span></p>
 +
</td>
 +
<td style="vertical-align: top; padding: 5pt 5pt 5pt 5pt; border: solid #000000 1pt;">
 +
<p style="line-height: 1.2; margin-top: 0pt; margin-bottom: 0pt;"><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: 400; font-variant: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;">Car-id</span></p>
 +
</td>
 +
<td style="vertical-align: top; padding: 5pt 5pt 5pt 5pt; border: solid #000000 1pt;">
 +
<p style="line-height: 1.2; margin-top: 0pt; margin-bottom: 0pt;"><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: 400; font-variant: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;">Car-type</span></p>
 +
</td>
 +
<td style="vertical-align: top; padding: 5pt 5pt 5pt 5pt; border: solid #000000 1pt;">
 +
<p style="line-height: 1.2; margin-top: 0pt; margin-bottom: 0pt;"><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: 400; font-variant: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;">Gate-name</span></p>
 +
</td>
 +
</tr>
 +
<tr style="height: 0pt;">
 +
<td style="vertical-align: top; padding: 5pt 5pt 5pt 5pt; border: solid #000000 1pt;">
 +
<p style="line-height: 1.2; margin-top: 0pt; margin-bottom: 0pt;"><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: 400; font-variant: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;">2015-05-01 00:15:13</span></p>
 +
</td>
 +
<td style="vertical-align: top; padding: 5pt 5pt 5pt 5pt; border: solid #000000 1pt;">
 +
<p style="line-height: 1.2; margin-top: 0pt; margin-bottom: 0pt;"><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: 400; font-variant: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;">20151501121513-39</span></p>
 +
</td>
 +
<td style="vertical-align: top; padding: 5pt 5pt 5pt 5pt; border: solid #000000 1pt;">
 +
<p style="line-height: 1.2; margin-top: 0pt; margin-bottom: 0pt;"><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: 400; font-variant: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;">2</span></p>
 +
</td>
 +
<td style="vertical-align: top; padding: 5pt 5pt 5pt 5pt; border: solid #000000 1pt;">
 +
<p style="line-height: 1.2; margin-top: 0pt; margin-bottom: 0pt;"><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: 400; font-variant: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;">entrance4</span></p>
 +
</td>
 +
</tr>
 +
<tr style="height: 0pt;">
 +
<td style="vertical-align: top; padding: 5pt 5pt 5pt 5pt; border: solid #000000 1pt;">
 +
<p style="line-height: 1.2; margin-top: 0pt; margin-bottom: 0pt;"><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: 400; font-variant: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;">2015-05-01 01:14:22</span></p>
 +
</td>
 +
<td style="vertical-align: top; padding: 5pt 5pt 5pt 5pt; border: solid #000000 1pt;">
 +
<p style="line-height: 1.2; margin-top: 0pt; margin-bottom: 0pt;"><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: 400; font-variant: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;">20155501015525-264</span></p>
 +
</td>
 +
<td style="vertical-align: top; padding: 5pt 5pt 5pt 5pt; border: solid #000000 1pt;">
 +
<p style="line-height: 1.2; margin-top: 0pt; margin-bottom: 0pt;"><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: 400; font-variant: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;">1</span></p>
 +
</td>
 +
<td style="vertical-align: top; padding: 5pt 5pt 5pt 5pt; border: solid #000000 1pt;">
 +
<p style="line-height: 1.2; margin-top: 0pt; margin-bottom: 0pt;"><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: 400; font-variant: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;">ranger-stop2</span></p>
 +
</td>
 +
</tr>
 +
 
 +
</table>
 +
<p><br /><br /></p>
 +
<p style="line-height: 1.38; margin-top: 0pt; margin-bottom: 0pt; text-align: justify;"><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: 400; font-variant: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;">Devising a network graph visualisation needs a definition of nodes, edges and layouts. Nodes are entities that need to be connected, and in this case, the gate names serve as nodes. Edges help connect various nodes on a well-defined layout. Through a map image provided for this particular dataset, the layout has been pre-set to the respective Cartesian coordinates of each gate name. The edges here would represent the number of vehicles that follow the particular path between two gates. Deriving new variables from the timestamp information such as time of day, weeks and months can help the user visualise daily and seasonal patterns of traffic movement. Also, the gate names are aggregated into gate categories such as gates, entrances, etc.</span></p>
 +
 
 +
<p style="line-height: 1.38; margin-top: 0pt; margin-bottom: 0pt; text-align: justify;"><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: 400; font-variant: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;">An impetus for why this particular data set was chosen is because it provided us a predefined geography with a set of 40 gate names (such as camp1, camp2, entrance 1) which represent locations. The timestamp entry of a vehicle moving through such locations is obtained and the car type is also known. The closeness with which it can be associated to real world case is evidently seen. </span></p>

Latest revision as of 15:11, 7 August 2017

Discovering traffic patterns by using network graph visualisations

Introduction

About

Project Proposal

Data Preparation

App & Deliverables

Poster

 

Abstract

Transportation networks are key lifelines that aid movement of people, goods, services and resources that are vital to the productivity of a nation. A good visualization of corridors along which vehicular transport moves is key in understanding patterns of such movement. Using a dataset that captures that timestamp information of vehicles passing through a wildlife preserve, a network visualization application is created using R Shiny as the platform. The insights derived can help understand metrics such as traffic density along corridors, the directions of traffic flow, and the daily and seasonal patterns of traffic flow.

Motivation

Network patterns can reveal very interesting insights but it is very difficult to implement with off-the-shelf software tools such as Tableau®. Gephi®, an open-source and free software is one of the leading tools to visualise network graphs. But, in order to make our findings easily accessible to everyone without any installation of any tools at their end, we propose the usage of the recently introduced ggraph package from R. Besides bringing the same kind of flexibility offered by a commercial tool, it offers an extension on the well-acclaimed ggplot2 package in R. Built specifically for supporting relational data structures such as networks, graphs and trees, the API provides a self-contained set of facets and customisations, enhancing the quality of visualisations.


Besides providing custom made visualisations to find out the traffic flow between various nodes in a predefined geography, the links that connect the nodes can also be represented with various measures of the user’s choice. In this case, the relevant choice is chosen to be traffic density. In addition to ggraph which provides a comprehensive network, we add an interactive version with the well known ggplotly which helps to provide interactivity to the nodes and edges, along with hoverable tooltips which give users a quick visual summary.

Practical use cases

In a country like Singapore with limited land space, the problems of congestion can be extremely severe. Congestion can bring about several repercussions such as the monetary value of time spent in traffic jams, increased fuel consumption resulting in air pollution, stressed and frustrated motorists leading to an increase occurrence of road rages incidents and higher chances of accidents due to reasons such as tailgating etc.

Singapore has several sources which provide real time traffic conditions. They include junction eyes, green link determining system (GLIDE), webcams and parking guidance system (PGS) etc. These data can be fed into our model to provide a traffic network map of Singapore. The sources collecting the data will be equivalent to the nodes. Using centrality measures to identify the nodes experiencing a higher volume of traffic, LTA can choose to install additional gantries there, raise existing ERP pricings to divert traffic or expand the road to accommodate a heavier volume of traffic and smoothen the flow.

About the Dataset

The data for designing the interactive application is obtained from the Visual Analytics Science and Technology Challenge, 2017. The dataset involves 4 attributes, namely the timestamp, car-id, car-type and gate-name. A snippet is as shown below. A particular car (Car-id) passing through a check point (Gate-name) is recorded at a particular instance of time (Timestamp) through an RFID tag. The Car-type indicates the type of car, where Car-type 2 indicates a 2-axle truck. A snippet of the dataset is as shown below.

 

Timestamp

Car-id

Car-type

Gate-name

2015-05-01 00:15:13

20151501121513-39

2

entrance4

2015-05-01 01:14:22

20155501015525-264

1

ranger-stop2



Devising a network graph visualisation needs a definition of nodes, edges and layouts. Nodes are entities that need to be connected, and in this case, the gate names serve as nodes. Edges help connect various nodes on a well-defined layout. Through a map image provided for this particular dataset, the layout has been pre-set to the respective Cartesian coordinates of each gate name. The edges here would represent the number of vehicles that follow the particular path between two gates. Deriving new variables from the timestamp information such as time of day, weeks and months can help the user visualise daily and seasonal patterns of traffic movement. Also, the gate names are aggregated into gate categories such as gates, entrances, etc.

An impetus for why this particular data set was chosen is because it provided us a predefined geography with a set of 40 gate names (such as camp1, camp2, entrance 1) which represent locations. The timestamp entry of a vehicle moving through such locations is obtained and the car type is also known. The closeness with which it can be associated to real world case is evidently seen.