From 1934f29e0e2494d4415b69bc35019518da7102e3 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Bruno=20S=C3=A1nchez-Andrade=20Nu=C3=B1o?= Date: Fri, 4 Sep 2015 16:18:43 -0400 Subject: [PATCH 01/22] Implement loading YAML array for js --- _includes/footer.html | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/_includes/footer.html b/_includes/footer.html index ebe700e..b2d0b27 100644 --- a/_includes/footer.html +++ b/_includes/footer.html @@ -52,6 +52,9 @@

{{ site.title }}

{% if page.js %} - + {% for file in page.js %} + + {% endfor %} + {% endif %} From e5e6d6ed509e5adc0dc6b526203597d3997aaa22 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Bruno=20S=C3=A1nchez-Andrade=20Nu=C3=B1o?= Date: Fri, 4 Sep 2015 16:19:14 -0400 Subject: [PATCH 02/22] Split loading to a common file --- assets/data-loader.js | 25 +++++++++++++++++++++++++ assets/list.js | 25 ------------------------- fulllist.md | 4 +++- 3 files changed, 28 insertions(+), 26 deletions(-) create mode 100644 assets/data-loader.js diff --git a/assets/data-loader.js b/assets/data-loader.js new file mode 100644 index 0000000..192f97f --- /dev/null +++ b/assets/data-loader.js @@ -0,0 +1,25 @@ +// Base URL +var version = "v0.05" +var dataurl = "https://raw.githubusercontent.com/SDG-data/SDGs/"+version+"/" +//Read Goals, Targets and Indicators +var sdgs = []; +var stats = {}; + +files = ["goals","targets","indicators"]; +var data_loaded = 0; +function load_data(){ + //Reset and Read into memory the SDGs + sdgs = {}; + stats = {}; + files.forEach(function (f) { + console.log("Loading "+f); + d3.json(dataurl+f+".json", function (error, data) { + //for (var attrname in data) { sdgs[attrname] = data[attrname]; } + sdgs[data.meta.id]=data; + if (Object.keys(sdgs).length == 3) { + update_stats(); + load_data_state(); + data_loaded=1;} + }); +}); +} diff --git a/assets/list.js b/assets/list.js index b629683..d27aefc 100644 --- a/assets/list.js +++ b/assets/list.js @@ -1,28 +1,3 @@ -// Base URL -var version = "v0.05" -var dataurl = "https://raw.githubusercontent.com/SDG-data/SDGs/"+version+"/" -//Read Goals, Targets and Indicators -var sdgs = []; -var stats = {}; - -files = ["goals","targets","indicators"]; -var data_loaded = 0; -function load_data(){ - //Reset and Read into memory the SDGs - sdgs = {}; - stats = {}; - files.forEach(function (f) { - console.log("Loading "+f); - d3.json(dataurl+f+".json", function (error, data) { - //for (var attrname in data) { sdgs[attrname] = data[attrname]; } - sdgs[data.meta.id]=data; - if (Object.keys(sdgs).length == 3) { - update_stats(); - load_data_state(); - data_loaded=1;} - }); -}); -} //When page loadded, read data and URL state, if any $( document ).ready(load_data()); diff --git a/fulllist.md b/fulllist.md index d2a2a1e..4d0d770 100644 --- a/fulllist.md +++ b/fulllist.md @@ -2,7 +2,9 @@ layout: empty title: Full List permalink: /list/ -js: list.js +js: + - data-loader.js + - list.js redirect_from: - / --- From 781dcf6c6e5ec039109c3fe8267565fbbd93bd65 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Bruno=20S=C3=A1nchez-Andrade=20Nu=C3=B1o?= Date: Fri, 4 Sep 2015 18:17:42 -0400 Subject: [PATCH 03/22] use main_loader function --- assets/data-loader.js | 8 ++++---- assets/list.js | 5 +++++ 2 files changed, 9 insertions(+), 4 deletions(-) diff --git a/assets/data-loader.js b/assets/data-loader.js index 192f97f..8ab617e 100644 --- a/assets/data-loader.js +++ b/assets/data-loader.js @@ -1,6 +1,7 @@ +//Common fnctions for data Loading // Base URL -var version = "v0.05" -var dataurl = "https://raw.githubusercontent.com/SDG-data/SDGs/"+version+"/" +var version = "v0.05"; +var dataurl = "https://raw.githubusercontent.com/SDG-data/SDGs/"+version+"/"; //Read Goals, Targets and Indicators var sdgs = []; var stats = {}; @@ -17,8 +18,7 @@ function load_data(){ //for (var attrname in data) { sdgs[attrname] = data[attrname]; } sdgs[data.meta.id]=data; if (Object.keys(sdgs).length == 3) { - update_stats(); - load_data_state(); + page_main(); data_loaded=1;} }); }); diff --git a/assets/list.js b/assets/list.js index d27aefc..f9ffdea 100644 --- a/assets/list.js +++ b/assets/list.js @@ -2,6 +2,11 @@ //When page loadded, read data and URL state, if any $( document ).ready(load_data()); +function page_main(){ + update_stats(); + load_data_state(); +} + function load_data_state(){ var data_state= getURLParameter('data'); switch(data_state) { From 2b863a0e0a6028cd5b248e2754450a1a09964a79 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Bruno=20S=C3=A1nchez-Andrade=20Nu=C3=B1o?= Date: Fri, 4 Sep 2015 18:18:05 -0400 Subject: [PATCH 04/22] DRY-er moved functions to main loader --- assets/data-loader.js | 26 ++++++++++++++++++++++++++ assets/list.js | 23 ----------------------- 2 files changed, 26 insertions(+), 23 deletions(-) diff --git a/assets/data-loader.js b/assets/data-loader.js index 8ab617e..c241732 100644 --- a/assets/data-loader.js +++ b/assets/data-loader.js @@ -23,3 +23,29 @@ function load_data(){ }); }); } + +function append(htype,hookElement,id,classes,value,link){ + var wrapper = document.createElement("div"); + var newListItem = document.createElement(htype); + wrapper.setAttribute("id", id); + newListItem.setAttribute("class", classes); + if (typeof link !== 'undefined') { + newListItem.setAttribute("href", link); + } + var ListValue = document.createTextNode(value); + newListItem.appendChild(ListValue); + hookElement.appendChild(wrapper).appendChild(newListItem); +} + +function append_row(hookElement,row){ + var table = document.getElementById(hookElement); + var rowObject = table.insertRow(0); + for (var i in row){ + cell = rowObject.insertCell(i); + cell.innerHTML = row[i]; + } +} + +function array_num(size,num){ + return Array.apply(null, new Array(size)).map(Number.prototype.valueOf,num); +} diff --git a/assets/list.js b/assets/list.js index f9ffdea..3a98c0d 100644 --- a/assets/list.js +++ b/assets/list.js @@ -209,29 +209,6 @@ function list_targets(){ } } -function append(htype,hookElement,id,classes,value){ - var wrapper = document.createElement("div"); - var newListItem = document.createElement(htype); - wrapper.setAttribute("id", id); - newListItem.setAttribute("class", classes); - var ListValue = document.createTextNode(value); - newListItem.appendChild(ListValue); - hookElement.appendChild(wrapper).appendChild(newListItem); -} - -function append_row(hookElement,row){ - var table = document.getElementById(hookElement); - var rowObject = table.insertRow(0); - for (var i in row){ - cell = rowObject.insertCell(i); - cell.innerHTML = row[i]; - } -} - -function array_num(size,num){ - return Array.apply(null, new Array(size)).map(Number.prototype.valueOf,num); -} - function add_goals(){ $('#load-all').addClass("active"); document.getElementById("dashboard-title").innerHTML = "SDG Goals"; From 0c59b9f48e37a0fc8faf7c7de6a4660a401da38b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Bruno=20S=C3=A1nchez-Andrade=20Nu=C3=B1o?= Date: Fri, 4 Sep 2015 18:18:21 -0400 Subject: [PATCH 05/22] Scaffold for data viz --- data-overview.md | 28 ++++++++++++++++++++++++++++ 1 file changed, 28 insertions(+) create mode 100644 data-overview.md diff --git a/data-overview.md b/data-overview.md new file mode 100644 index 0000000..2db48c3 --- /dev/null +++ b/data-overview.md @@ -0,0 +1,28 @@ +--- +layout: empty +title: One Visualization per Goal +permalink: /data-101/ +js: + - data-loader.js + - viz-101.js +--- + +
+ +
+

{{page.title}}

+
+

+
+
+
+ + + + + From 1ea93295b7b375fb80330a6eddb479659959fdd6 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Bruno=20S=C3=A1nchez-Andrade=20Nu=C3=B1o?= Date: Fri, 4 Sep 2015 18:18:48 -0400 Subject: [PATCH 06/22] v0 son of visualizations --- assets/viz-101.json | 17 +++++++++++++++++ 1 file changed, 17 insertions(+) create mode 100644 assets/viz-101.json diff --git a/assets/viz-101.json b/assets/viz-101.json new file mode 100644 index 0000000..6f108f7 --- /dev/null +++ b/assets/viz-101.json @@ -0,0 +1,17 @@ +{ + "visualizations": [ + { + "goal": 1, + "target": 1.1, + "viz-title": "Extreme poverty IS decreasing", + "description":"The % of world population that live with less that 1.25$/day ppp is has decreased since 200 from X% to Y%. If we extrapolate, we will get to Z% by 2030.", + "source-name":"Source name", + "source-link":"#source-link", + "embed": "No Poverty" + } + ], + "meta": { + "id": "Visualization", + "description": "One Visualization per goal" + } +} From ac0cad614f404cc8daf98eab2ce01b46821a769a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Bruno=20S=C3=A1nchez-Andrade=20Nu=C3=B1o?= Date: Fri, 4 Sep 2015 18:19:13 -0400 Subject: [PATCH 07/22] Load sidebar and goals list --- assets/viz-101.js | 27 +++++++++++++++++++++++++++ 1 file changed, 27 insertions(+) create mode 100644 assets/viz-101.js diff --git a/assets/viz-101.js b/assets/viz-101.js new file mode 100644 index 0000000..25287b7 --- /dev/null +++ b/assets/viz-101.js @@ -0,0 +1,27 @@ + +//When page loadded, read data and URL state, if any +$( document ).ready(load_data()); + +function page_main(){ + add_goals_sidebar(); + add_goals(); +} + +function add_goals_sidebar(){ + $('#sidebar').addClass("active"); + var sdgList = document.getElementById("sidebar"); + var goals=sdgs.goals.goals; + for (var i in goals){ + var goal= goals[i]; + append('a',sdgList,"",""," "+goal.goal+": "+goal.short+".","#goal-"+goal.goal,""); + } +} + +function add_goals(){ + var sdgList = document.getElementById("dashboard-content"); + var goals=sdgs.goals.goals; + for (var i in goals){ + var goal= goals[i]; + append('div',sdgList,"goal-"+goal.goal,"h3"," "+goal.goal+": "+goal.title+"."); + } +} From 4bafb8c5cb5198dbcee80c868df26bd370e3d0de Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Bruno=20S=C3=A1nchez-Andrade=20Nu=C3=B1o?= Date: Fri, 4 Sep 2015 18:19:26 -0400 Subject: [PATCH 08/22] Load viz and place on goal --- assets/viz-101.js | 16 ++++++++++++++++ 1 file changed, 16 insertions(+) diff --git a/assets/viz-101.js b/assets/viz-101.js index 25287b7..b265d57 100644 --- a/assets/viz-101.js +++ b/assets/viz-101.js @@ -5,6 +5,7 @@ $( document ).ready(load_data()); function page_main(){ add_goals_sidebar(); add_goals(); + load_vizrefs(); } function add_goals_sidebar(){ @@ -25,3 +26,18 @@ function add_goals(){ append('div',sdgList,"goal-"+goal.goal,"h3"," "+goal.goal+": "+goal.title+"."); } } + +var visualizations={}; +function load_vizrefs(){ + // Load Visualizations references from the json file + d3.json("/web/assets/viz-101.json", function (error, data) { + var viz=data.visualizations[0]; + var vizHook = document.getElementById("goal-"+viz.goal); + console.log(viz,vizHook); + if (vizHook === null){ + throw new Error("Something went badly wrong!"); + } + //append(htype,hookElement,id,classes,value,link) + append('div',vizHook,"viz-"+viz.goal,"",viz["viz-title"]); + }); +} From 4253eed14e8c87f70940be8f18f6550bd3825bd2 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Bruno=20S=C3=A1nchez-Andrade=20Nu=C3=B1o?= Date: Fri, 4 Sep 2015 18:56:12 -0400 Subject: [PATCH 09/22] Adding an example --- assets/viz-101.json | 11 ++++++++++- 1 file changed, 10 insertions(+), 1 deletion(-) diff --git a/assets/viz-101.json b/assets/viz-101.json index 6f108f7..1d6f608 100644 --- a/assets/viz-101.json +++ b/assets/viz-101.json @@ -7,7 +7,16 @@ "description":"The % of world population that live with less that 1.25$/day ppp is has decreased since 200 from X% to Y%. If we extrapolate, we will get to Z% by 2030.", "source-name":"Source name", "source-link":"#source-link", - "embed": "No Poverty" + "embed": "" }, { "goal": 2, "target": 2.2, - "viz-title": "Women in parlaments", - "description":"Lorem Ipsum", - "source-name":"Source name", - "source-link":"#source-link", - "embed": "" + "viz-title": "World maps of food supply (kcal per capita per day), 1961-2009", + "description":"", + "source-name":"Max Rosner", + "source-link":"http://ourworldindata.org/wp-content/uploads/datamaps/kcalPerCapita_since1961_FAO/kcalPerCapita_since1961_FAO.html", + "embed": "" + }, + { + "goal": 2, + "target": 2.3, + "viz-title": "Crop yield gap (actual yield as % of attainable yield)", + "description":"", + "source-name":"Global Yield Gap Atlas", + "source-link":"http://www.yieldgap.org/", + "embed": "" + }, + { + "goal": 5, + "target": 5.5, + "viz-title": "Labor force participation", + "description":"", + "source-name":"No Ceilings", + "source-link":"http://noceilings.org/map/#LFSFFE15&2012", + "embed": "" } ], "meta": { From 1601354764d8de4b0df8d2b19b8bae9ba8e756c3 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Bruno=20S=C3=A1nchez-Andrade=20Nu=C3=B1o?= Date: Fri, 4 Sep 2015 19:41:34 -0400 Subject: [PATCH 15/22] Complete example drafted --- assets/viz-101.json | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/assets/viz-101.json b/assets/viz-101.json index 29f49e5..cc71674 100644 --- a/assets/viz-101.json +++ b/assets/viz-101.json @@ -5,9 +5,9 @@ "target": 1.1, "viz-title": "Extreme poverty IS decreasing", "description":"The % of world population that live with less that 1.25$/day ppp is has decreased since 200 from X% to Y%. If we extrapolate, we will get to Z% by 2030.", - "source-name":"Source name", - "source-link":"#source-link", - "embed": "" }, { "goal": 2, "target": 2.3, - "viz-title": "Crop yield gap (actual yield as % of attainable yield)", + "viz-title": "Yield Gap for Major Crops", "description":"", - "source-name":"Global Yield Gap Atlas", - "source-link":"http://www.yieldgap.org/", - "embed": "" + "source-name":"Food and Agriculture Organization of the United Nations (FAO)", + "source-link":"http://www.fao.org/nr/gaez/about-data-portal/yield-and-production-gaps/en/", + "embed": "" }, { "goal": 5, - "target": 5.5, - "viz-title": "Labor force participation", + "target": "5.1, 5.5, 5.c", + "viz-title": "Female Representation in National Parliaments", "description":"", "source-name":"No Ceilings", - "source-link":"http://noceilings.org/map/#LFSFFE15&2012", - "embed": "" + "source-link":"http://noceilings.org/map/#FEREPNTP&2013", + "embed": "No Ceilings embedded map" }, { "goal": 6, "target": 6.1, - "viz-title": "Labor force participation", + "viz-title": "Overall Water Risk - Current Conditions", "description":"", - "source-name":"No Ceilings", - "source-link":"http://noceilings.org/map/#LFSFFE15&2012", - "embed": "" + "source-name":"World Resources Institute", + "source-link":"http://tinyurl.com/obhrvx3", + "embed": "Overall water risk - Current conditions" + + }, + { + "goal": 14, + "target": 14.1, + "viz-title": "Marine Pollution - Clean Waters Index", + "description":"", + "source-name":"Ocean Health Index", + "source-link":"http://www.oceanhealthindex.org/Goals/Clean_Waters", + "embed": "Clean waters index" + }, + { + "goal": 16, + "target": 6.1, + "viz-title": "World Map of Homicide Rates Today", + "description":"", + "source-name":"Max Rosner", + "source-link":"http://ourworldindata.org/data/violence-rights/homicides/#world-map-of-homicide-rates-today-max-roserref", + "embed": "Clean waters index" } - ], "meta": { "id": "Visualization", From 42e47c7e7d4378902e45305f77fd46f2821ae3ed Mon Sep 17 00:00:00 2001 From: pythagoraswitch Date: Fri, 4 Sep 2015 22:44:11 -0400 Subject: [PATCH 20/22] minor appearance change MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Titles of visualizations (viz["viz-title”]) are now h4. --- assets/viz-101.js | 2 +- assets/viz-101.json | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/assets/viz-101.js b/assets/viz-101.js index 7970b3e..6e416ca 100644 --- a/assets/viz-101.js +++ b/assets/viz-101.js @@ -28,7 +28,7 @@ function add_goals(){ } function append_viz(vizHook,viz){ - append('div',vizHook,"viz-"+viz.goal,"",viz["viz-title"]); + append('div',vizHook,"viz-"+viz.goal,"h4",viz["viz-title"]); append('a',vizHook,"viz-"+viz.goal,"","Relevant target: "+viz.target,"/web/list/?data=list_targets#"); append('p',vizHook,"viz-"+viz.goal,"",viz.description); append_raw(vizHook,viz.embed); diff --git a/assets/viz-101.json b/assets/viz-101.json index a2ccb1a..dc648e6 100644 --- a/assets/viz-101.json +++ b/assets/viz-101.json @@ -58,7 +58,7 @@ { "goal": 16, "target": 6.1, - "viz-title": "World Map of Homicide Rates Today", + "viz-title": "Homicides per 100,000 per year", "description":"", "source-name":"Max Rosner", "source-link":"http://ourworldindata.org/data/violence-rights/homicides/#world-map-of-homicide-rates-today-max-roserref", From 6357f64a433067e50b10cebf4135b204cc8d10fe Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Bruno=20S=C3=A1nchez-Andrade=20Nu=C3=B1o?= Date: Sat, 5 Sep 2015 12:56:43 -0400 Subject: [PATCH 21/22] tweak style --- assets/viz-101.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/assets/viz-101.js b/assets/viz-101.js index 6e416ca..b8a1ecf 100644 --- a/assets/viz-101.js +++ b/assets/viz-101.js @@ -28,7 +28,7 @@ function add_goals(){ } function append_viz(vizHook,viz){ - append('div',vizHook,"viz-"+viz.goal,"h4",viz["viz-title"]); + append('div',vizHook,"viz-"+viz.goal,"h4 lead",viz["viz-title"]); append('a',vizHook,"viz-"+viz.goal,"","Relevant target: "+viz.target,"/web/list/?data=list_targets#"); append('p',vizHook,"viz-"+viz.goal,"",viz.description); append_raw(vizHook,viz.embed); From 7578ee97f0146f3190ab3765c98edbaf0fba497e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Bruno=20S=C3=A1nchez-Andrade=20Nu=C3=B1o?= Date: Sat, 5 Sep 2015 13:45:53 -0400 Subject: [PATCH 22/22] update first viz. --- assets/viz-101.json | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/assets/viz-101.json b/assets/viz-101.json index dc648e6..0a6fd06 100644 --- a/assets/viz-101.json +++ b/assets/viz-101.json @@ -4,10 +4,10 @@ "goal": 1, "target": 1.1, "viz-title": "Extreme poverty IS decreasing", - "description":"The % of world population that live with less that 1.25$/day ppp is has decreased since 200 from X% to Y%. If we extrapolate, we will get to Z% by 2030.", + "description":"If developing countries were to grow at the rates they achieved during the 2000’s the global poverty headcount could decline from 14.5% in 2011 to 4.9% in 2030 – short of ‘ending poverty’.", "source-name":"World Bank", - "source-link":"http://databank.worldbank.org/data/reports.aspx?source=poverty-and-equity-database", - "embed": "" + "source-link":"http://blogs.worldbank.org/futuredevelopment/poverty-will-only-end-2030-if-growth-shared", + "embed": "" }, { "goal": 2, @@ -44,7 +44,7 @@ "source-name":"World Resources Institute", "source-link":"http://tinyurl.com/obhrvx3", "embed": "Overall water risk - Current conditions" - + }, { "goal": 14,