Difference between revisions of "About"

From Visual Analytics and Applications
Jump to navigation Jump to search
(motivation edit)
 
(10 intermediate revisions by one other user not shown)
Line 1: Line 1:
 
<div style=background:#2B3856 border:#A3BFB1>
 
<div style=background:#2B3856 border:#A3BFB1>
  
<font size = 5; color="#FFFFFF">Group1: Unlocking insights from the VAST Challenge 2017</font>
+
<font size = 5; color="#FFFFFF">Discovering traffic patterns by using network graph visualisations</font>
 
</div>
 
</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:#F5F6CE; 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="#1C1C1C">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 34: Line 34:
 
== Abstract ==
 
== Abstract ==
  
<p>The project aims to illustrate the power of visual analytics to highlight patterns vehicles show when traversing through various traffic corridors. By linking the information captured by RFID tags when vehicles move through checkpoints, an interactive application is designed which will help to unravel insights such as frequently travelled corridors, preferred routes amongst vehicles, traffic density, etc. The application will be primarily developed using R, and specifically the versatile <strong><em>ggraph</em> package</strong>, which helps to develop powerful network visualisations.</p>
+
<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==
  
<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;">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;"><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==
 
==Practical use cases==
  
* Traffic planning.
+
<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>
* Systems such as Singapore ERP.
+
<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>
* Implementing diversions during peak periods.
+
 
 +
==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.