Difference between revisions of "1718t1is428T7"

From Visual Analytics for Business Intelligence
Jump to navigation Jump to search
 
(39 intermediate revisions by one other user not shown)
Line 1: Line 1:
[[File:g1t7_weed_logo1.jpg|350px|center]]
+
[[File:g1t7_weed_logo1.jpg|600px|center]]
  
 
<!------- Main Navigation Bar---->
 
<!------- Main Navigation Bar---->
 
<center>
 
<center>
 
{| style="background-color:#ffffff ; margin: 3px 10px 3px 10px; width="80%"|
 
{| style="background-color:#ffffff ; margin: 3px 10px 3px 10px; width="80%"|
 +
 
| style="font-family:Open Sans, Arial, sans-serif; font-size:15px; text-align: center; border-top:solid #ffffff; border-bottom:solid #0091b3" width="190px" |  
 
| style="font-family:Open Sans, Arial, sans-serif; font-size:15px; text-align: center; border-top:solid #ffffff; border-bottom:solid #0091b3" width="190px" |  
[[Forensic_Ninja|<font color="#3c3c3c"><strong>PROPOSAL</strong></font>]]
+
[[1718t1is428T7 |<font color="#3c3c3c"><strong>HOME</strong></font>]]
 +
 
 +
| style="font-family:Open Sans, Arial, sans-serif; font-size:15px; text-align: center; border-top:solid #ffffff; border-bottom:solid #f5f5f5" width="210px" |
 +
[[1718t1is428T7: Proposal 2|<font color="#3c3c3c"><strong>PROPOSAL</strong></font>]]
  
 
| style="font-family:Open Sans, Arial, sans-serif; font-size:15px; text-align: center; border-top:solid #ffffff; border-bottom:solid #f5f5f5" width="210px" |   
 
| style="font-family:Open Sans, Arial, sans-serif; font-size:15px; text-align: center; border-top:solid #ffffff; border-bottom:solid #f5f5f5" width="210px" |   
Line 14: Line 18:
  
 
| style="font-family:Open Sans, Arial, sans-serif; font-size:15px; text-align: center; border-top:solid #ffffff; border-bottom:solid #f5f5f5" width="230px" |   
 
| style="font-family:Open Sans, Arial, sans-serif; font-size:15px; text-align: center; border-top:solid #ffffff; border-bottom:solid #f5f5f5" width="230px" |   
[[Report|<font color="#3c3c3c"><strong>DOCUMENTATION</strong></font>]]
+
[[Report|<font color="#3c3c3c"><strong>RESEARCH PAPER</strong></font>]]
  
 
|}
 
|}
 
</center>
 
</center>
 
<!------- End of Main Navigation Bar---->
 
<!------- End of Main Navigation Bar---->
 
 
<!-- Body -->
 
<!-- Body -->
 +
<br><br>
 +
[[File:G1t7 MMPR Home.jpg|1300px|center]]
  
<div style="background: #094730; padding: 15px; font-weight: bold; line-height: 0.3em; text-indent: 15px;letter-spacing:-0.08em;font-size:20px"><font color=#fbfcfd face="Bebas Neue">PROBLEM & MOTIVATION</font></div>
 
 
<div style="padding: 17px">
 
[[File:Jury1718t1is428T7.png ‎ |100px|center|Jury]]
 
</div>
 
Singapore is known for its strict laws when it comes to the possession and consumption of illegal substances. In recent years, we have seen the increased liberalization and decriminalization of the possession of these substances in countries like the United States. These contrasting societies give us the opportunity to analyse the effects these substances have on their society. If the legalization has a beneficial effect or is it detrimental to economic and social growth. We are also able to analyse the trends of the substances themselves. How does decriminalization and other political or social factors affects the prices, consumption and the business of this black market trade.
 
 
[[File:L1718t1is428T7.png|100px|center|libra]]
 
These insights gained would allow us to be able to observe if there really is a justifiable reason for the forms of legislation imposed by each society and further analyze if there is a beneficial or detrimental effect on society.
 
 
[[File:Mon1718t1is428T7.png ‎|100px|center|money]]
 
Finally we could be able to observe if there is a reason to propose for certain societies to either tighten or liberalize legislation tied to these substances for the ultimate goal of benefiting their society.
 
 
==<div style="background: #ffffff; padding: 17px; line-height: 0.1em;  text-indent: 10px; font-size:17px; font-family: Helvetica;  border-left:8px solid #0091b3"><font color= #000000><strong>Objectives</strong></font></div>==
 
<i>
 
 
With this project we aim to create visualizations that will allow the easy visual analysis of the following:
 
[[File:M1718t1is428g1.png|100px|leaf|left||]]
 
<div style="padding:20px; padding-top:30px">
 
1. The effects of the imposed political measures has on the trends of the prices and consumption of some of these "drugs". Further analysis into the effects this has on society in terms of economic performance, social performance(crime) and also on the effects on the illegal trade of these substances on the black market.
 
</div><br/>
 
 
[[File:Gg1718t1is428g1.png|100px|leaf|left||]]
 
<div style="padding:20px; padding-top:25px">
 
2. These analysis will allow us to analyze if there truly is a hypothesized beneficial or detrimental effect on society as a whole. From these we can analyse if there is a real justification to decriminalizing these substances. We can also get a clearer understanding of how certain political and legislative measures have an effect on this illegal trade.
 
</div><br/>
 
 
[[File:Js1718t1is428g1.png|100px|leaf|left||]]
 
<div style="padding:20px; padding-top:20px">
 
3. Our final goal is to analyze if it is justifiable to legalize certain currently banned substances and possibly propose specific ways certain societies based on our analysis could adapt legislation or strengthen current legislation for the clamp down on the illicit trade so as to benefit their society.
 
</div><br/>
 
</i>
 
 
==<div style="background: #ffffff; padding: 17px; line-height: 0.1em;  text-indent: 10px; font-size:17px; font-family: Helvetica;  border-left:8px solid #0091b3"><font color= #000000><strong>Data Source</strong></font></div>==
 
<div style="margin:0px; padding: 10px; background: #f2f4f4; font-family: Open Sans, Arial, sans-serif; border-radius: 7px; text-align:left">
 
Datasets are retrieved from https://data.unodc.org/ and http://www.emcdda.europa.eu/data/stats2017_en.<br>
 
These two sites provides comprehensive and diverse data regarding drugs.<br>
 
<b>Data Snippet</b><br>
 
[[File:G1t7_proposal_sampledata.PNG|1000px]]
 
</div>
 
 
==<div style="background: #ffffff; padding: 17px; line-height: 0.1em;  text-indent: 10px; font-size:17px; font-family: Helvetica;  border-left:8px solid #0091b3"><font color= #000000><strong>References to Related Work</strong></font></div>==
 
<div style="margin:0px; padding: 10px; background: #f2f4f4; font-family: Open Sans, Arial, sans-serif; border-radius: 7px; text-align:left">
 
<center>
 
{| style="background-color:#ffffff ; margin: 3px 10px 3px 10px; font-size:15px" width="85%"
 
|- style="background:#f2f4f4; font-size:17px"
 
 
|-
 
| style="font-family:Open Sans, Arial, sans-serif; font-size:16px; text-align: center; padding:5px; border-bottom:solid #0091b3" | <font color="#3c3c3c"><strong>Screenshots</strong></font>
 
| style="font-family:Open Sans, Arial, sans-serif; font-size:16px; text-align: center; padding:5px; border-bottom:solid #0091b3" | <font color="#3c3c3c"><strong>What we can learn</strong></font>
 
 
|-
 
| style="font-family:Open Sans, Arial, sans-serif; text-align: center; padding:3px 10px; border-bottom:solid 1px #d8d8d8" | <strong>
 
Interactive Filled World Map<br> [[File:G1t7_proposal_map.png|300px]]<br />Source: [http://www.unodc.org/wdr2016/interactive-map.html link] </strong>
 
| style="font-family:Open Sans, Arial, sans-serif; text-align: left; padding:3px 10px; border-bottom:solid 1px #d8d8d8" |
 
Example shows the different intensity of percentage of the population affected by drug abuse and the total number of drug abusers as shape circle.<br>
 
<b>Pros:</b>
 
*Able to see an general picture of the drug landscape.
 
*Visually appealing and straightforward.
 
 
<b>Cons:</b>
 
*Unable to drill-down for more detailed information.
 
*Some parts of the world are not properly represented.
 
 
|-
 
| style="font-family:Open Sans, Arial, sans-serif; text-align: center; padding:3px 10px; border-bottom:solid 1px #d8d8d8" | <strong>
 
Stacked Distribution Pipeline<br> [[File:G1t7_proposal_distribution.png|300px]]<br />Source: [http://www.informationisbeautiful.net/visualizations/drug-deal-potential-tax-revenue-from-legalized-narcotics/ link] </strong>
 
| style="font-family:Open Sans, Arial, sans-serif; text-align: left; padding:3px 10px; border-bottom:solid 1px #d8d8d8" |
 
Example showcase a beautifully designed stacked bar, showing the ratio of revenue brought in by each type of drug that fuels the different types of activities at the right end of the chart.<br>
 
<b>Pros:</b>
 
*Gives the viewer a clear idea of what this chart is about.
 
*Easy to understand and highly customisable.
 
 
<b>Cons:</b>
 
*Too high level.
 
*Viewers might miss the fine details because of the colour.
 
 
|-
 
| style="font-family:Open Sans, Arial, sans-serif; text-align: center; padding:3px 10px; border-bottom:solid 1px #d8d8d8" | <strong>
 
Price OHLC<br> [[File:G1t7_proposal_price.png|300px]]<br />Source: [http://www.emcdda.europa.eu/data/stats2017_en link] </strong>
 
| style="font-family:Open Sans, Arial, sans-serif; text-align: left; padding:3px 10px; border-bottom:solid 1px #d8d8d8" |
 
Example shows the price level, high and low for a type of drug along the years.<br>
 
<b>Pros:</b>
 
*A detailed view of the price level along the years.
 
*Easy to understand.
 
 
<b>Cons:</b>
 
*Viewers who do not know how to read this chart might misinterpret the values.
 
*Not highly customisable.
 
 
|-
 
| style="font-family:Open Sans, Arial, sans-serif; text-align: center; padding:3px 10px; border-bottom:solid 1px #d8d8d8" | <strong>
 
Drug Prevalence Boxplot<br> [[File:G1t7_proposal_boxplot.png|300px]]<br />Source: [http://www.unodc.org/doc/wdr2016/WORLD_DRUG_REPORT_2016_web.pdf link] </strong>
 
| style="font-family:Open Sans, Arial, sans-serif; text-align: left; padding:3px 10px; border-bottom:solid 1px #d8d8d8" |
 
Example shows the prevalence of a drug abuse in each country<br>
 
<b>Pros:</b>
 
*Many information on one chart.
 
*High level and low level view of information.
 
 
<b>Cons:</b>
 
*Not straightforward, need time to digest the information.
 
*Chart might need filters to help summarise the data.
 
 
|}
 
</center>
 
</div>
 
 
==<div style="background: #ffffff; padding: 17px; line-height: 0.1em;  text-indent: 10px; font-size:17px; font-family: Helvetica;  border-left:8px solid #0091b3"><font color= #000000><strong>Storyboard</strong></font></div>==
 
<div style="margin:0px; padding: 10px; background: #f2f4f4; font-family: Open Sans, Arial, sans-serif; border-radius: 7px; text-align:left">
 
[[File:G1t7_proposal_storyboard.PNG|600px|center]]
 
Main dashboard should show the overview information of the drugs e.g. the screenshot above.<br>
 
<br>
 
First chart on the top left will be a parallel set, showing the relationship between countries and the different drug use. Sets should be customisable to enable different views.<br>
 
<br>
 
The next chart on the right will be a scatter plot. It will show the various statistics of a drug and be able to provide insights of the relationship between different groups of drugs. Chart will also show the trace line of each bubble. By selecting the individual bubble, the user can see another dashboard will more drill down information of that specific drug.<br>
 
<br>
 
The bottom chart will double as a adjustable timeline as well as a line graph showing the ups and downs over the years. Special milestone that affects the line will also be labelled. Adjusting this graph will filter the data that will be shown on the two charts above.
 
 
</div>
 
 
==<div style="background: #ffffff; padding: 17px; line-height: 0.1em;  text-indent: 10px; font-size:17px; font-family: Helvetica;  border-left:8px solid #0091b3"><font color= #000000><strong>Key Technical Challenges</strong></font></div>==
 
<div style="margin:0px; padding: 10px; background: #f2f4f4; font-family: Open Sans, Arial, sans-serif; border-radius: 7px; text-align:left">
 
<b>Inexperienced with data visualisation tools</b><br>
 
*Self learning through youtube and practices.
 
*Peer learning
 
 
<b>New to D3.js and Javascript</b><br>
 
*Attend D3.js workshop.
 
*Self explore the various D3.js examples.
 
 
<b>Data cleaning and transformation</b><br>
 
*Team effort
 
*Documentation to keep track of changes.
 
</div>
 
 
==<div style="background: #ffffff; padding: 17px; line-height: 0.1em;  text-indent: 10px; font-size:17px; font-family: Helvetica;  border-left:8px solid #0091b3"><font color= #000000><strong>Project Schedule</strong></font></div>==
 
<div style="margin:0px; padding: 10px; background: #f2f4f4; font-family: Open Sans, Arial, sans-serif; border-radius: 7px; text-align:left">
 
<center>[[File:Forensic Ninja Timeline.PNG|500px]]</center>
 
</div>
 
 
==<div style="background: #ffffff; padding: 17px; line-height: 0.1em;  text-indent: 10px; font-size:17px; font-family: Helvetica;  border-left:8px solid #0091b3"><font color= #000000><strong>Tools/Technologies</strong></font></div>==
 
<div style="margin:0px; padding: 10px; background: #f2f4f4; font-family: Open Sans, Arial, sans-serif; border-radius: 7px; text-align:left">
 
These are the tools and technologies that we will be learning and implementing for this project:
 
*Tableau
 
*Microsoft Excel
 
*D3.js
 
*Chart.js
 
*Angular 4
 
*Adobe Illustrator
 
</div>
 
 
==<div style="background: #ffffff; padding: 17px; line-height: 0.1em;  text-indent: 10px; font-size:17px; font-family: Helvetica;  border-left:8px solid #0091b3"><font color= #000000><strong>References</strong></font></div>==
 
<div style="margin:0px; padding: 10px; background: #f2f4f4; font-family: Open Sans, Arial, sans-serif; border-radius: 7px; text-align:left">
 
*https://data.unodc.org/
 
*https://golearn-archive.unodc.org/olat/raw/static/unodc/cube/attempts.html#
 
*http://www.emcdda.europa.eu/data/stats2017_en
 
*https://d3js.org/
 
*http://www.chartjs.org/
 
</div>
 
 
==<div style="background: #ffffff; padding: 17px; line-height: 0.1em;  text-indent: 10px; font-size:17px; font-family: Helvetica;  border-left:8px solid #0091b3"><font color= #000000><strong>Our Team</strong></font></div>==
 
<div style="margin:0px; padding: 10px; background: #f2f4f4; font-family: Open Sans, Arial, sans-serif; border-radius: 7px; text-align:left">
 
<b>Group 7</b><br>
 
Fan Kaiyang<br>
 
Mark Ng Wei Jie<br>
 
Gary Quek Jian Zhang
 
</div>
 
 
==<div style="background: #ffffff; padding: 17px; line-height: 0.1em;  text-indent: 10px; font-size:17px; font-family: Helvetica;  border-left:8px solid #0091b3"><font color= #000000><strong>Comments</strong></font></div>==
 
<div style="margin:0px; padding: 10px; background: #f2f4f4; font-family: Open Sans, Arial, sans-serif; border-radius: 7px; text-align:left">
 
 
<!--Please leave your comments here :) --->
 
</div>
 
 
<!-- End Body --->
 
<!-- End Body --->

Latest revision as of 15:17, 25 November 2017