|
|
| Line 1: |
Line 1: |
| − | <!--Logo-->
| |
| − | [[File:CJSlogo.png|center|260px]]
| |
| − | '''<center>[[Project Groups|Back to Project Groups]]</center>'''
| |
| − | <!--/Logo-->
| |
| | | | |
| − | <!--Header-->
| |
| − | {|style="background-color:#138D75; padding: 10 0 10 0;" width="100%" cellspacing="0" cellpadding="0" valign="top" border="0" |
| |
| − | | style="font-family: tahoma; padding:0.3em; font-size:100%; background-color:#138D75; text-align:center;" color:#138D75" width="10%" border="0" |
| |
| − | [[IS428 Team wiki: Group12(CJS) Home |
| |
| − | <font color="#F5F5F5" size=3><b>HOME</b></font>]]
| |
| − |
| |
| − | | style="background:#1B2631;" width="1%" |
| |
| − | | style="font-family:tahoma; padding:0.3em; font-size:100%; background-color:#1B2631; text-align:center; color:#1B2631" width="10%" |
| |
| − | [[IS428 Team wiki: Group12(CJS) Proposal |
| |
| − | <font color="#F5F5F5" size=3><b>PROPOSAL</b></font>]]
| |
| − |
| |
| − | | style="background:#138D75;" width="1%" |
| |
| − | | style="font-family:tahoma; padding:0.3em; font-size:100%; background-color:#138D75; border-bottom:0px solid #138D75; text-align:center; color:#138D75" width="10%" |
| |
| − | [[IS428 Team wiki: Group12(CJS) Poster |
| |
| − | <font color="#F5F5F5" size=3><b>POSTER</b></font>]]
| |
| − |
| |
| − | | style="background:#138D75;" width="1%" |
| |
| − | | style="font-family:tahoma; padding:0.3em; font-size:100%; background-color:#138D75; border-bottom:0px solid #138D75; text-align:center; color:#138D75" width="10%" |
| |
| − | [[IS428 Team wiki: Group12(CJS) Application |
| |
| − | <font color="#F5F5F5" size=3><b>APPLICATION</b></font>]]
| |
| − |
| |
| − | | style="background:#138D75;" width="1%" |
| |
| − | | style="font-family:tahoma; padding:0.3em; font-size:100%; background-color:#138D75; border-bottom:0px solid #138D75; text-align:center; color:#138D75" width="10%" |
| |
| − | [[IS428 Team wiki: Group12(CJS) Research Paper |
| |
| − | <font color="#F5F5F5" size=3><b>RESEARCH PAPER</b></font>]]
| |
| − | |}
| |
| − | <!--/Header-->
| |
| − |
| |
| − | <!--Sub Header-->
| |
| − | {| style="background-color:white; text-transform: uppercase; font-size:85%; text-align:center; padding: 5px 0 0 0;" width="100%" height=50px cellspacing="0" cellpadding="0" valign="top" border="0" |
| |
| − |
| |
| − | <!-- Current Page -->
| |
| − | | style="vertical-align:top;width:33.3%;" | <div style="padding: 3px; line-height: wrap_content; border-bottom:5px solid #138D75; font-family:Century Gothic"> [[IS428 Team wiki: Group12(CJS) Proposal Previous |<font color =#138D75><b>Previous</b></font>]]
| |
| − |
| |
| − | | style="vertical-align:top;width:33.3%;" | <div style="padding: 3px; line-height: wrap_content; border-bottom:1px dashed#1B2631; font-family:Century Gothic"> [[IS428 Team wiki: Group12(CJS) Proposal Revise | <font color =#1B2631>Revise</font>]]
| |
| − |
| |
| − | |}
| |
| − | <!--Sub Header-->
| |
| − |
| |
| − |
| |
| − | <div style="background: #138D75; padding: 15px; font-weight: bold; line-height: 0.3em; text-indent: 15px;letter-spacing:-0.08em;font-size:20px"><font color=#fbfcfd face="Century Gothic">PROBLEM & MOTIVATION</font></div>
| |
| − | '''Problem''' Since 2012, the United Nations Sustainable Development Solutions Network (SDSN) has been publishing a world happiness report that presents the happiness levels of 156 countries. 6 parameters that include GDP per capita, social support, healthy life expectancy, freedom to make life choices, generosity, and perception of corruption are used to come up with the happiness index for these different countries.
| |
| − |
| |
| − | Our visualization, thus, explores the different trends between these 6 parameters and the final happiness index to see exactly which parameters has a higher weightage in the final score.
| |
| − |
| |
| − | '''Motivation''' The United Nations SDSN reports the happiness ranking of the individual countries yearly. However, trends regarding these 6 parameters are not clearly presented in each of these reports. Importance of such trends can be recognized when we taking the example of Singapore. In 2018, Singapore’s was ranked 34th out of 155 countries in terms of happiness. Though this may seem somewhat high, when compared with their 26th ranking in 2017 will we realise that Singapore is becoming a less “happier” country. Hence, it is important that such trends be explored into to get a clearer understanding of what makes a happy country.
| |
| − |
| |
| − | Secondly, the reports does not accurately define which of the 6 parameters play a bigger role in deciding the final happiness index of the various countries. A country ranked first in the world happiness index might not rank first in one of the 6 factors. Thus, it could be interesting to identify the relationship between the happiness index and the 6 different factors that contribute to it and identify what make a happier country as per the standards of UN. Perhaps, consistencies or inconsistencies across the yearly reports years could be observed.
| |
| − |
| |
| − | <div style="background: #138D75; padding: 15px; font-weight: bold; line-height: 0.3em; text-indent: 15px;letter-spacing:-0.08em;font-size:20px"><font color=#fbfcfd face="Century Gothic">OBJECTIVES</font></div>
| |
| − | 1. Identify the overall trends of happiness ranking index of countries over the years between 2013 to 2017 <br>
| |
| − | 2. Identify the rankings of the each of 6 parameters that make up the happiness index of countries from the years 2008 to 2017 <br>
| |
| − | 3. Compare the 6 parameters between the selected countries and see how they fare in relation to their final happiness index ranking from the years 2008 to 2017 <br>
| |
| − | 4. Identify whether there has been a change in the weightage for the individual parameters towards the final happiness index ranking from year to year. (Tentative)
| |
| − | <div style="background: #138D75; padding: 15px; font-weight: bold; line-height: 0.3em; text-indent: 15px;letter-spacing:-0.08em;font-size:20px"><font color=#fbfcfd face="Century Gothic">DATA DESCRIPTION</font></div>
| |
| − | {| class="wikitable" style="background-color:#FFFFFF;" width="100%"
| |
| − | |-
| |
| − | ! style="font-weight: bold;background: #138D75;color:#fbfcfd;width: 50%;" | Dataset/ Source
| |
| − | ! style="font-weight: bold;background: #138D75;color:#fbfcfd;" | Data Attributes
| |
| − | ! style="font-weight: bold;background: #138D75;color:#fbfcfd;" | Rationale of Usage
| |
| − | |-
| |
| − | |
| |
| − | World Happiness Report Data 2006-2017<br>
| |
| − | https://s3.amazonaws.com/happiness-report/2018/WHR2018Chapter2OnlineData.xls<br>
| |
| − | table2.1
| |
| − | ||
| |
| − | * County
| |
| − | * Year
| |
| − | * Life Ladder
| |
| − | * Log GDP per capita
| |
| − | * Social Support
| |
| − | * Healthy life expectancy at birth
| |
| − | * Freedom to make life choices
| |
| − | * Generosity
| |
| − | * Perceptions of corruption
| |
| − | * Positive affect
| |
| − | * Negative affect
| |
| − | * Confidence in national government
| |
| − | * Democratic Quality
| |
| − | * Delivery Quality
| |
| − | * Standard deviation of ladder by country-year
| |
| − | * Stand deviation/ Mean of ladder by country-year
| |
| − | * GINI index (World Bank estimate)
| |
| − | * GINI index (World Bank estimate), average 2000-15
| |
| − | * GINI of household income reported in Gallup, by wp5-year
| |
| − | ||
| |
| − | See the overall performance of each individual country changes from year 2006 onwards
| |
| − | |-
| |
| − | | World Happiness Report Data 2017<br>
| |
| − | https://s3.amazonaws.com/happiness-report/2018/WHR2018Chapter2OnlineData.xls<br>
| |
| − | Figure2.2
| |
| − | ||
| |
| − | * Country
| |
| − | * Happiness score
| |
| − | * Whisker-high
| |
| − | * Whisker-low
| |
| − | * Dystopia + residual
| |
| − | * GDP Per capita
| |
| − | * Social support
| |
| − | * Healthy life expectancy
| |
| − | * Freedom to make life choices
| |
| − | * Generosity
| |
| − | * Corruption
| |
| − | ||
| |
| − | Show data of one particular year(2017), its overall score and thus can get how the final happiness score is calculated
| |
| − | |-
| |
| − | |}
| |
| − | <div style="background: #138D75; padding: 15px; font-weight: bold; line-height: 0.3em; text-indent: 15px;letter-spacing:-0.08em;font-size:20px"><font color=#fbfcfd face="Century Gothic">SURVEY OF RELATED WORK</font></div>
| |
| − | Our visualization are inspired by the following works:
| |
| − |
| |
| − | {| class="wikitable" style="background-color:#FFFFFF;" width="100%"
| |
| − | |-
| |
| − | ! style="font-weight: bold;background: #138D75;color:#fbfcfd;width: 50%;" | Reference Visualization Work
| |
| − | ! style="font-weight: bold;background: #138D75;color:#fbfcfd;" | Our Team's Take-away
| |
| − | |-
| |
| − | | <p><center>'''World Map''' </center></p>
| |
| − | [[File:CJSref1.jpg|400px|center]]
| |
| − | <p><center>'''Source''': http://shiny.rstudio.com/gallery/superzip-example.html </center></p>
| |
| − | ||
| |
| − | * The visualization would show the happiness index of the various countries using the world map. Users would only need to hover over the map of the country that they are interested in to observe the exact happiness score of that country.
| |
| − | *Our team aims to use a single hue of color with different intensity to show the happiness index of countries. As per the visualization, the tool-tip would be used to display values of the 6 parameters that make up the final happiness index as the user hover over the specific country. Tentatively, hexagon map with 6 axes representing 6 parameters will also displayed.
| |
| − |
| |
| − | |-
| |
| − | | <p><center>'''Interactive Ranking Bar Chart''' </center></p>
| |
| − | [[File:CJSref2.jpg|400px|center]]
| |
| − | <p><center>'''Source''': https://www.gapminder.org/tools/#$chart-type=barrank</center></p>
| |
| − | ||
| |
| − | * As per the visualization, the ranking of country defined by the selected parameter would be shown with the bar chart. In our work, the parameter will be from one of the 6 parameters.
| |
| − | * Our team aims to substitute the number beside the bar with the happiness index rating so that the user can make comparisons of the country's happiness index ranking and the parameter straight away.
| |
| − |
| |
| − | |-
| |
| − | | <p><center>''' Parallel Coordinates Plot''' </center></p>
| |
| − | [[File:CJSrefParallel.jpg|400px|center]]
| |
| − | <p><center>'''Source''': https://bl.ocks.org/jasondavies/1341281</center></p>
| |
| − | ||
| |
| − | *Thanks to prof guidance, parallel coordinates plot was introduced in the class. All the parameters, which are defined the lines are displayed concurrently in parallel coordinates.
| |
| − | * In our visualization, each of the axes would represent the 6 different parameters that make up the happiness index, and there will be different lines for different countries. So, the user can compare all the parameters instantly and identify relationships between them.
| |
| − | |-
| |
| − | |}
| |
| − | <div style="background: #138D75; padding: 15px; font-weight: bold; line-height: 0.3em; text-indent: 15px;letter-spacing:-0.08em;font-size:20px"><font color=#fbfcfd face="Century Gothic">PROPOSED STORYBOARD</font></div>
| |
| − |
| |
| − | {| class="wikitable" style="background-color:#FFFFFF;" width="100%"
| |
| − | |-
| |
| − | ! style="font-weight: bold;background: #138D75;color:#fbfcfd;width: 50%;" | Visualization
| |
| − | ! style="font-weight: bold;background: #138D75;color:#fbfcfd;" | Description
| |
| − | |-
| |
| − | | <p><center>'''Main Visualisation: Line Graph''' </center></p>
| |
| − | [[File:CJStory1.jpg|600px|center]]
| |
| − | ||
| |
| − | '''Purpose:'''
| |
| − | A general view that presents time series data of the happiness ranking between the different countries from the year 2013 to 2017.
| |
| − | <br><br>'''Features to be included:'''
| |
| − | * Filter for country selection that enables viewers to observe the change in trend over the years for specific countries.
| |
| − | |-
| |
| − | | <p><center>'''Main Visualisation: Chloropleth Map''' </center></p>
| |
| − | [[File:CJStory1_1.jpg|600px|center]]
| |
| − | ||
| |
| − | '''Purpose:'''
| |
| − | To show the geographical distribution of the happiness index and the 6 parameters for selected years using a chloropleth map. This helps the user identify trends between regions. For example, users could see if Asian countries are “happier” than African countries.
| |
| − | <br><br>'''Features to be included:'''
| |
| − | * Different colour intensity would be used to represent the varying values of each factors.
| |
| − | * Filter for user to observe data by individual years and happiness index factors.
| |
| − | |-
| |
| − | | <p><center>'''Main Visualisation: Bar chart''' </center></p>
| |
| − | [[File:CJStory2.jpg|600px|center]]
| |
| − | ||
| |
| − | '''Purpose:'''
| |
| − | To identify any correlation between the 6 sub-factors and the happiness index. Users can see, for example, what the happiness index rankings are for countries with just the highest GDP
| |
| − | <br><br>'''Features to be included:'''
| |
| − | * The bar length would be used to visualise the magnitude of the selected parameters while the number to the side of the bar chart would refer to the happiness index rank of the country.
| |
| − | * There would be a slider below the chart that would allow users to scroll through and see the bar chart visualisations for the different years.
| |
| − | * Filter for the 6 parameters.
| |
| − | |-
| |
| − | |-
| |
| − | | <p><center>'''Main Visualisation: Parallel Coordinates with Boxplot''' </center></p>
| |
| − | [[File:CJStory3.jpg|600px|cener]]
| |
| − | ||
| |
| − | '''Purpose:'''
| |
| − | To help identify trends between the 6 parameters among the different countries.
| |
| − | <br><br>'''Features to be included:'''
| |
| − | * Boxplot on each of the axis to enable the user to see the distribution for each of the sub-factors.
| |
| − | * Brushing feature for users to select a range values in the chart.
| |
| − | * Filter for people to select the year.
| |
| − | |-
| |
| − | |}
| |
| − | <div style="background: #138D75; padding: 15px; font-weight: bold; line-height: 0.3em; text-indent: 15px;letter-spacing:-0.08em;font-size:20px"><font color=#fbfcfd face="Century Gothic">KEY CHALLENGES</font></div>
| |
| − | {| class="wikitable" style="background-color:#FFFFFF;" width="100%"
| |
| − | |-
| |
| − | ! style="font-weight: bold;background: #138D75;color:#fbfcfd;width: 50%;" | Key Technical Challenges
| |
| − | ! style="font-weight: bold;background: #138D75;color:#fbfcfd;" | Proposed Solution
| |
| − | |-
| |
| − | |
| |
| − | No centralized data. Data are all divided year by year.
| |
| − | ||
| |
| − | * Gather all data and join all sets together.
| |
| − | * Clean and transform the data.
| |
| − | |-
| |
| − | | Unfamiliar with Visualization Tools
| |
| − | ||
| |
| − | * Research on how to use there tools properly.
| |
| − | * Consultation with professor to get help.
| |
| − | |-
| |
| − | | Unfamiliar with R as a new programming language
| |
| − | ||
| |
| − | * Learn R individually.
| |
| − | * Incorporate Transformed html page with Javascript & JQuery to give smooth and user-friendly interface.
| |
| − | |-
| |
| − | |}
| |
| − | <div style="background: #138D75; padding: 15px; font-weight: bold; line-height: 0.3em; text-indent: 15px;letter-spacing:-0.08em;font-size:20px"><font color=#fbfcfd face="Century Gothic">VISUALIZATION SKETCH</font></div>
| |
| − | Please check out our visualization sketch to better understand the process.
| |
| − | [[File:CJSthinkingProcess.png|center|800px]]
| |
| − | For section 1(left side of the above image), users would be greeted with a general view of the data from 2008 to 2017 through the time series data and the geographical distribution visualisation. This section aims to fulfill objective 1. Users can hover over the map and see the 6 parameters that make up the happiness index of the country in the specific year. User need to select the year for Chloropleth map.<br>
| |
| − | Visualization presented:
| |
| − | # Line Graph
| |
| − | # Chloropleth map
| |
| − | Section 2(top right of the image) presents a more drilled down view as trends specifically related to the 6 parameters that make up the final happiness index can be seen here after the user selects the parameter and year. Tentatively, user would only need to select any one of the 6 parameters and the chart will change dynamically according to the year. This section aims to fulfill objective 2.<br>
| |
| − | Visualizations presented:
| |
| − | #Bar Chart
| |
| − | For the section 3(bottom right of the image), the different y-axes represent the different parameters and lines are plotted for all the different countries.This section aims to fulfill objective 3.<br>
| |
| − | Visualizations presented:
| |
| − | # Parallel Coordinates
| |
| − | <div style="background: #138D75; padding: 15px; font-weight: bold; line-height: 0.3em; text-indent: 15px;letter-spacing:-0.08em;font-size:20px"><font color=#fbfcfd face="Century Gothic">MILESTONES AND TASK DESCRIPTIONS</font></div>
| |
| − | Milestones are indicated with the star.
| |
| − | [[File:CJSProjTimeline.png|center|1000px]]
| |
| − | <div style="background: #138D75; padding: 15px; font-weight: bold; line-height: 0.3em; text-indent: 15px;letter-spacing:-0.08em;font-size:20px"><font color=#fbfcfd face="Century Gothic">REFERENCES</font></div>
| |
| − | # https://s3.amazonaws.com/happiness-report/2018/WHR2018Chapter2OnlineData.xls
| |
| − | # https://s3.amazonaws.com/happiness-report/2018/WHR2018Chapter2OnlineData.xls
| |
| − | # http://shiny.rstudio.com/gallery/superzip-example.html
| |
| − | # https://www.gapminder.org/tools/#$chart-type=barrank
| |
| − | # https://bl.ocks.org/jasondavies/1341281
| |
| − | <div style="background: #138D75; padding: 15px; font-weight: bold; line-height: 0.3em; text-indent: 15px;letter-spacing:-0.08em;font-size:20px"><font color=#fbfcfd face="Century Gothic">COMMENTS</font></div>
| |
| − | Please provide us with any comments to improve our visualization better.
| |
