View source for IS428 AY2019-20T1 Assign Chye Soon Hang Dashboard

<div style=background:#f4c20d border:#fff> 
<center><font size = 5; color="#fff"><b>VAST Challenge 2019 MC 2: Managing Radiation Together As A Nation</center></b></font>
</div>
{|style="background-color:#f4c20d; color:#fff; padding: 10 0 10 0;" width="100%" cellspacing="0" cellpadding="0" valign="top" border="0"  |
| style="padding:0.2em; font-size:100%; background-color:#f4c20d; text-align:center; color:#fff" width="10%" | 
[[IS428_AY2019-20T1_Assign_Chye_Soon_Hang |<font color="#fff" size=3 face="Helvetica"><b>Problem & Motivation</b></font>]]

| style="background:none;" width="1%" | &nbsp;
| style="padding:0.2em; font-size:100%; background-color:#f4c20d;  border-bottom:0px solid #3D9DD7; text-align:center; color:#100c08" width="10%" | 
[[IS428_AY2019-20T1_Assign_Chye_Soon_Hang_Data_Cleaning|<font color="#fff" size=3 face="Helvetica"><b>Data Cleaning</b></font>]]

| style="background:none;" width="1%" | &nbsp;
| style="padding:0.2em; font-size:100%; background-color:#f4c20d;  border-bottom:0px solid #3D9DD7; text-align:center; color:#fff" width="10%" | 
[[IS428_AY2019-20T1_Assign_Chye_Soon_Hang_Dashboard|<font color="#fff" size=3 face="Helvetica"><b>Dashboard</b></font>]]

| style="background:none;" width="1%" | &nbsp;
| style="padding:0.2em; font-size:100%; background-color:#f4c20d;  border-bottom:0px solid #3D9DD7; text-align:center; color:#fff" width="10%" | 
[[IS428_AY2019-20T1_Assign_Chye_Soon_Hang_Observations |<font color="#fff" size=3 face="Helvetica"><b>Observations</b></font>]]

| style="background:none;" width="1%" | &nbsp;
| style="padding:0.2em; font-size:100%; background-color:#f4c20d;  border-bottom:0px solid #3D9DD7; text-align:center; color:#fff" width="10%" | 
[[IS428_AY2019-20T1_Assign_Chye_Soon_Hang_Reference|<font color="#fff" size=3 face="Helvetica"><b>References</b></font>]]
|} 
</div>
<h1>Link to Dashboard</h1>
https://public.tableau.com/views/VASTMC22019ChyeSoonHang/Introduction?:embed=y&:display_count=yes&:origin=viz_share_link
<h1>Introduction Page</h1>
<br>
<center>[[File:dashboard_intro_sh.png|600px]]</center>
<p>To help users navigate around the dataset better, I have segregated the dataset into multiple visualization to display different insights. To start off, user will first be greeted by the Introduction page as show above, which helps to give a brief problem statement and objectives. Lastly, it will also display 4 buttons to navigate to the following visualization:</p>
<ol>
<li>Overview by Town – Allow users to see the radiation reading by town according the time they filter by</li>
<li>Overview by Sensor - Allow users to see the radiation reading by sensors according the time they filter by</li>
<li>Detailed Overview of Ind. Sensors - Allow users to check on the fluctuations of individual sensors</li>
<li>Movement of Mobile Sensors – Allow uses to see how the mobile sensors (cars) move around the town and potentially spread the radiation if contaminated</li>
</ol>

<h1>Overview by Town Page</h1>
<center>[[File:overview_by_town_sh.png|600px]]</center>
<p>This visualization aims to show users the radiation reading/contamination level of individual town at different point of the day</p>
{| class="wikitable"
|-
! style="font-weight: bold;background: #f4c20d;color:#fbfcfd;width: 5%;" | Features
! style="font-weight: bold;background: #f4c20d;color:#fbfcfd;width: 48%;" | Rationale
! style="font-weight: bold;background: #f4c20d;color:#fbfcfd;" | Brief Implementation Steps
|-
| <center>Filter by Timestamp</center>
|| Allow users to set the timestamp to check the radiation readings at that point of time
|| 
<ul>
<li>Drag Timestamp to filter pane</li>
<li>Choose Individual Dates and Times as the filter
<br>
<center>[[File:filter_by_timestamp_sh.png|200px]]</center>
</li>
<li>Right click the Timestamp on filter pane and set Show Filter to be True</li>
<li>Choose Single Value (slider) for the filter function
<br>
<center>[[File:single_val_slider_sh.png|200px]]</center>
</li>
</ul>
|}

<h1>Overview by Sensors</h1>
<center>[[File:overview_by_sensors_sh.png|600px]]</center>
<p>This visualization aims to show users the radiation levels based on all of the sensors spread across the map and can filter by time and sensor type.</p>
{| class="wikitable"
|-
! style="font-weight: bold;background: #f4c20d;color:#fbfcfd;width: 5%;" | Features
! style="font-weight: bold;background: #f4c20d;color:#fbfcfd;width: 48%;" | Rationale
! style="font-weight: bold;background: #f4c20d;color:#fbfcfd;" | Brief Implementation Steps
|-
| <center>Filter by Timestamp</center>
|| Allow users to set the timestamp to check the radiation readings at that point of time
|| 
<ul>
<li>Drag Timestamp to filter pane</li>
<li>Choose Individual Dates and Times as the filter
<br>
<center>[[File:filter_by_timestamp_sh.png|200px]]</center>
</li>
<li>Right click the Timestamp on filter pane and set Show Filter to be True</li>
<li>Choose Single Value (slider) for the filter function
<br>
<center>[[File:single_val_slider_sh.png|200px]]</center>
</li>
</ul>
|-
| <center>Filter by SensorType</center>
|| Allow users to filter to see only the sensor type they want to see
|| 
<ul>
<li>First create Group among the sensor id in terms of their type (static/mobile)</li>
<li>Drag the newly created group to the filter pane</li>
</ul>
|}

<h1>Detailed Overview of Ind. Sensors</h1>
<center>[[File:detail_ind_sensors_sh.png|600px]]</center>
<p>This visualization aims to give the users a more in-depth understandings of the data captured in individual sensors and analyze its fluctuations over the 5 days.</p>
{| class="wikitable"
|-
! style="font-weight: bold;background: #f4c20d;color:#fbfcfd;width: 5%;" | Features
! style="font-weight: bold;background: #f4c20d;color:#fbfcfd;width: 48%;" | Rationale
! style="font-weight: bold;background: #f4c20d;color:#fbfcfd;" | Brief Implementation Steps
|-
| <center>Filter by SensorType</center>
|| Allow users to filter to see only the sensor type they want to see
|| 
<ul>
<li>First create Group among the sensor id in terms of their type (static/mobile)</li>
<li>Drag the newly created group to the filter pane</li>
</ul>
|}

<h1>Movement of Mobile Sensors</h1>
<center>[[File:movement_of_mob_sensors_sh.png|600px]]</center>
<p>This visualization helps to illustrate the movements of mobile sensors. As there is possibility of contamination outspread due to the sensors’ movement, it will be beneficial to be able to track the movements over the 5 days.</p>
{| class="wikitable"
|-
! style="font-weight: bold;background: #f4c20d;color:#fbfcfd;width: 5%;" | Features
! style="font-weight: bold;background: #f4c20d;color:#fbfcfd;width: 48%;" | Rationale
! style="font-weight: bold;background: #f4c20d;color:#fbfcfd;" | Brief Implementation Steps
|-
| <center>Filter by Timestamp</center>
|| Allow users to set the timestamp to check the radiation readings at that point of time
|| 
<ul>
<li>Drag Timestamp to filter pane</li>
<li>Choose Individual Dates and Times as the filter
<br>
<center>[[File:filter_by_timestamp_sh.png|200px]]</center>
</li>
<li>Right click the Timestamp on filter pane and set Show Filter to be True</li>
<li>Choose Single Value (slider) for the filter function
<br>
<center>[[File:single_val_slider_sh.png|200px]]</center>
</li>
</ul>
|}