Merge branch 'dev'

README.md

@@ -37,20 +37,20 @@ To afford comparison and trend discovery between event happenings in two or more
 
 _3. Hover:_
 
-Hovering over a country in the World Map reveals the total number of killings in that country over the period. Hovering over a data point in  the country wise view reveals more information about the event w.r.t. to the data point. 
+Details on demand - Hovering over a country in the World Map reveals the total number of killings in that country over the period. Also, hovering over a data point in  the country wise view reveals more information about the event w.r.t. to the data point. 
 
 ####Dataset
 The visualization heavily depends upon dataset acquired from [Global Terrorism Database](http://www.start.umd.edu/gtd) (GTD, University of Maryland). 
 >It is currently the most comprehensive unclassified data base on over 113,000 terrorist events, occurred between 1970 and 2012 in the world.
 
 Each event consists information on the date, location, number of people killed and injured, weapons used, intention, group or individual involved, target, summary, cites, etc.
 
-The dataset was cleaned before being directly used. Many required values were `null` or inconsistent. For example, some of the country codes were not matching to that in the [Datamap](http://datamaps.github.io/) object.
+The dataset was cleaned before being directly used. Many required values were `null` or inconsistent. For example, some of the 3 Letter country codes from the database were not matching to that in the [Datamap](http://datamaps.github.io/) object.
 
 
 ## Running Instructions
 
-Access our visualization [here](http://cse512-14w.github.io/a3-chaoyu-aniket/).
+Access our visualization [here](http://cse512-14w.github.io/a3-chaoyu-aniket/). View it in full screen for better experience.
 
 ####OR 
 
@@ -80,21 +80,27 @@ We started off with data search and found many datasets which called our attenti
 
 While exploring these charts using Tableau we also simulated them using pages year wise to evaluate various interactions possible.
 
-####Sketching (TODO)
+####Sketching
 
+* During Brainstorm  
+![S1](images/sketch/s1.jpg)
+
+* Final sketch before we started coding
+![S2](images/sketch/s2.jpg)
+
+The top portion is a timeline wherein one can select the months from 2000 to 2010. It is used to brush below two visualizations. It affords all the interactions mentioned above.   
 
 #### Changes between Storyboard and the Final Implementation
 
-There are not any significant changes between the final sketch and the final implementation. Though we kept on fidgeting with the placement of various elements, the colors, the scale used. But, the overall interaction, views and underlining objective remained the same.
+There are not any significant changes between the final sketch and the final implementation. Though there were some stubble changes in placement of various elements, the colors, the scale used. But, the overall interaction, views and underlining objective remained the same.
 
-* Its hard to sketch colors and exactly understand how they will be perceived without an actual running prototype.
-* We didn't consider the use of log scale for color encoding, until we saw the running visualization.
-* 
+* Its hard to sketch colors and exactly understand how they will be perceived without an actual running prototype. We didn't consider the use of log scale for color encoding, until we saw the running visualization.
+* We first envisioned the country wise visualization to be similar to time stream from Tableau (above), but we ended up plotting translucent circles with size dependent upon killings to represent each event.
 
 ## Development Process
 
 ####Work Breakdown
-The two member team divided the work as equally as possible and also helped each other out. Roughly we allocated the tasks as follows:
+The two member team divided the work as equally as possible and also helped each other out on. Roughly we allocated the tasks as follows:
 
 **_Chaoyu Yang_**
 
@@ -153,5 +159,6 @@ So, in total we individually spend approximately 60 hours on the assignment.
 - Data exploration and then cleaning
 - Dirty hack to select countries on the Datamap
 
-####Conclusion
-
+####Future Work
+- Optimize algorithm and queries
+- Details on demand about the event, upon hovering on circles

include/css/main.css → css/main.css

@@ -26,6 +26,10 @@ a{
   width: 100%;
 }
 
+.slider-bg {
+  background: #f1f1f1;
+}
+
 #map {
   position: relative; 
   width: 100%; 
@@ -55,8 +59,7 @@ div#country_list{
   fill: #ddd;
 }
 
-.grid line,
-.grid path {
+.grid line, .grid path {
   fill: none;
   stroke: #fff;
   shape-rendering: crispEdges;
@@ -67,8 +70,9 @@ div#country_list{
 }
 
 .brush .extent {
-  stroke: #000;
-  fill-opacity: .25;
+  stroke: none;
+  fill: #000;
+  fill-opacity: .1;
   shape-rendering: crispEdges;
 }
 

data/country_name_mapping.js

@@ -0,0 +1,121 @@
+var country_name_mapping = {
+    AFG:"Afghanistan",
+    DZA:"Algeria",
+    AGO:"Angola",
+    ARM:"Armenia",
+    AUS:"Australia",
+    AUT:"Austria",
+    AZE:"Azerbaijan",
+    BHR:"Bahrain",
+    BGD:"Bangladesh",
+    BTN:"Bhutan",
+    BIH:"Bosnia-Herzegov\"ina",
+    BRA:"Brazil",
+    BGR:"Bulgaria",
+    BDI:"Burundi",
+    KHM:"Cambodia",
+    CMR:"Cameroon",
+    CAN:"Canada",
+    CAF:"Central African Republic",
+    TCD:"Chad",
+    CHN:"China",
+    COL:"Colombia",
+    COG:"Congo (Brazzavi\"lle)",
+    COD:"Congo (Kinshasa)",
+    CRI:"Costa Rica",
+    HRV:"Croatia",
+    CUB:"Cuba",
+    EGY:"Egypt",
+    GNQ:"Equatorial Guin\"ea",
+    ERI:"Eritrea",
+    EST:"Estonia",
+    ETH:"Ethiopia",
+    FJI:"Fiji",
+    FIN:"Finland",
+    FRA:"France",
+    GEO:"Georgia",
+    GBR:"Great Britain",
+    GRC:"Greece",
+    GTM:"Guatemala",
+    GIN:"Guinea",
+    GNB:"Guinea-Bissau",
+    GUY:"Guyana",
+    HTI:"Haiti",
+    HND:"Honduras",
+    HUN:"Hungary",
+    IND:"India",
+    IDN:"Indonesia",
+    IRN:"Iran",
+    IRQ:"Iraq",
+    IRL:"Ireland",
+    ISR:"Israel",
+    ITA:"Italy",
+    CIV:"Ivory Coast",
+    JOR:"Jordan",
+    KAZ:"Kazakhstan",
+    KEN:"Kenya",
+    UNK:"Kosovo",
+    KWT:"Kuwait",
+    KGZ:"Kyrgyzstan",
+    LAO:"Laos",
+    LVA:"Latvia",
+    LBN:"Lebanon",
+    LBR:"Liberia",
+    MKD:"Macedonia",
+    MDG:"Madagascar",
+    MWI:"Malawi",
+    MYS:"Malaysia",
+    MLI:"Mali",
+    MRT:"Mauritania",
+    MEX:"Mexico",
+    MDA:"Moldova",
+    MNE:"Montenegro",
+    MAR:"Morocco",
+    MOZ:"Mozambique",
+    MMR:"Myanmar",
+    NAM:"Namibia",
+    NPL:"Nepal",
+    NLD:"Netherlands",
+    NIC:"Nicaragua",
+    NER:"Niger",
+    NGA:"Nigeria",
+    MNP:"Northern Ireland",
+    NOR:"Norway",
+    PAK:"Pakistan",
+    PRY:"Paraguay",
+    PER:"Peru",
+    PHL:"Philippines",
+    QAT:"Qatar",
+    RUS:"Russia",
+    RWA:"Rwanda",
+    SAU:"Saudi Arabia",
+    SEN:"Senegal",
+    SRB:"Serbia",
+    SLE:"Sierra Leone",
+    SLB:"Solomon Islands",
+    SOM:"Somalia",
+    ZAF:"South Africa",
+    ESP:"Spain",
+    LKA:"Sri Lanka",
+    LCA:"St. Lucia",
+    SDN:"Sudan",
+    SWE:"Sweden",
+    CHE:"Switzerland",
+    SYR:"Syria",
+    TWN:"Taiwan",
+    TJK:"Tajikistan",
+    TZA:"Tanzania",
+    THA:"Thailand",
+    TLS:"Timor-Leste",
+    TUN:"Tunisia",
+    TUR:"Turkey",
+    UGA:"Uganda",
+    UKR:"Ukraine",
+    USA:"United States",
+    UZB:"Uzbekistan",
+    VEN:"Venezuela",
+    PSE:"West Bank and Gaza Strip",
+    YEM:"Yemen",
+    YUG:"Yugoslavia",
+    ZWE:"Zimbabwe"
+}