Difference between revisions of "IS428 AY2019-20T1 Assign Lim Pei Xuan: Visualization"
Line 37: | Line 37: | ||
The dashboard is organised such that the user will begin with a rough overview of the data, followed by a gradual deep dive into the details of the data. This is to facilitate understanding and prevents the user from getting too overwhelmed by chaotic nature of the data. As the interactive visualization techniques utilised are repeated throughout the dashboard, an overall summary of the techniques utilised can be found in the next section. | The dashboard is organised such that the user will begin with a rough overview of the data, followed by a gradual deep dive into the details of the data. This is to facilitate understanding and prevents the user from getting too overwhelmed by chaotic nature of the data. As the interactive visualization techniques utilised are repeated throughout the dashboard, an overall summary of the techniques utilised can be found in the next section. | ||
<br> | <br> | ||
+ | |||
+ | |||
<p> | <p> | ||
<div style="background: #364558; padding: 15px; font-weight: bold; line-height: 0.3em; text-indent: 0px;font-size:20px"><font face="Arial" color=#fbfcfd><center>'''Home Page'''</center></font></div> | <div style="background: #364558; padding: 15px; font-weight: bold; line-height: 0.3em; text-indent: 0px;font-size:20px"><font face="Arial" color=#fbfcfd><center>'''Home Page'''</center></font></div> | ||
+ | <center>The home page serves as an introduction to the problem that St.Himark faces, describing the context as well as the goal of the interactive visualization. </center> | ||
[[File:LPXASGVIZ2.jpg|900px|center]] | [[File:LPXASGVIZ2.jpg|900px|center]] | ||
{| class="wikitable" style="background-color:#FFFFFF;" width="100%" | {| class="wikitable" style="background-color:#FFFFFF;" width="100%" | ||
Line 48: | Line 51: | ||
1 | 1 | ||
|| | || | ||
− | + | The navigation bar allows for easy toggling between dashboards, and is present throughout the visualization. When the mouse is hovered over the icons, a tooltip with the title of the dashboard it leads to will appear. This is to help the user navigate between pages with ease. | |
|} | |} | ||
<br> | <br> | ||
<p> | <p> | ||
<div style="background: #364558; padding: 15px; font-weight: bold; line-height: 0.3em; text-indent: 0px;font-size:20px"><font face="Arial" color=#fbfcfd><center>'''Overview Page'''</center></font></div> | <div style="background: #364558; padding: 15px; font-weight: bold; line-height: 0.3em; text-indent: 0px;font-size:20px"><font face="Arial" color=#fbfcfd><center>'''Overview Page'''</center></font></div> | ||
+ | <center>The overview page provides the user with a high level overview of the sensor positions and readings over time. </center> | ||
[[File:LPXASGVIZ3.jpg|900px|center]] | [[File:LPXASGVIZ3.jpg|900px|center]] | ||
{| class="wikitable" style="background-color:#FFFFFF;" width="100%" | {| class="wikitable" style="background-color:#FFFFFF;" width="100%" | ||
Line 62: | Line 66: | ||
1 | 1 | ||
|| | || | ||
− | + | This filter applies to all visualizations on this dashboard. The filter is granulated on an hourly basis, so the user can get a quick overview of the sensor readings and positions of any given hour within the simulation. | |
|- | |- | ||
| | | | ||
2 | 2 | ||
|| | || | ||
− | + | There are two separate maps showing the locations of the static and mobile sensors within the given timeframe | |
|- | |- | ||
| | | |
Revision as of 19:37, 12 October 2019
Walkthrough
The final interactive visualization consists of a few linked Dashboards organised as follows:
- Home
- Sensor Availability and Overview
- Neighbourhood Monitoring
- Overview
- Sensor Breakdown
- Sensor Monitoring
- Static Sensors
- Mobile Sensors
The dashboard is organised such that the user will begin with a rough overview of the data, followed by a gradual deep dive into the details of the data. This is to facilitate understanding and prevents the user from getting too overwhelmed by chaotic nature of the data. As the interactive visualization techniques utilised are repeated throughout the dashboard, an overall summary of the techniques utilised can be found in the next section.
No. | Description |
---|---|
1 |
The navigation bar allows for easy toggling between dashboards, and is present throughout the visualization. When the mouse is hovered over the icons, a tooltip with the title of the dashboard it leads to will appear. This is to help the user navigate between pages with ease. |
No. | Description |
---|---|
1 |
This filter applies to all visualizations on this dashboard. The filter is granulated on an hourly basis, so the user can get a quick overview of the sensor readings and positions of any given hour within the simulation. |
2 |
There are two separate maps showing the locations of the static and mobile sensors within the given timeframe |
3 |
Blablabla |
No. | Description |
---|---|
1 |
Blablabla |
2 |
Blablabla |
3 |
Blablabla |
4 |
Blablabla |
No. | Description |
---|---|
1 |
Blablabla |
2 |
Blablabla |
3 |
Blablabla |
No. | Description |
---|---|
1 |
Blablabla |
2 |
Blablabla |
No. | Description |
---|---|
1 |
Blablabla |
2 |
Blablabla |