// Your code here
d3 = require("d3")
z = require('https://bundle.run/zebras@0.0.11')
dataSet1 = d3.csv(ds1) // importing the first dataset
z.head(30, dataSet1)
dataSet2 = d3.csv(ds2) // importing the second dataset (Metadata)
metaData1 = Object.keys(dataSet1[0]) // exploring the data
metaData2 = Object.keys(dataSet2[0]) // exploring the data
countryGroup = z.groupBy(x=>x.CO2, dataSet1) // grouping by country
migration_join = { // merging the two datasets together
var mergeData=[]
for(var i=0;i<dataSet1.length;i++)
{
var merge1=dataSet2.filter(obj=>obj["Country Code"]==dataSet1[i]["CO2"]) // merging by country
var merge2=dataSet1[i]
mergeData[i]=Object.assign(merge2,merge1[0])
delete mergeData[i]["Country Code"]
}
return mergeData
}
migration_joinX = z.merge(dataSet2, dataSet1, "Country Code", "CO2", "_df1", "_df2")
z.head(30, migration_join) // showing the data
incomeGroup = z.groupBy(x=>x.IncomeGroup, migration_join) // grouping by income group
variableGroup = z.groupBy(x=>x.Variable, migration_join) // returns a new data frame grouped by categories in "Variable"
inflowSum = z.gbSum("Value", z.groupBy(d=>d['CO2'],variableGroup['Inflows of foreign population by nationality'])) // sum of inflows by country
outflowSum = z.gbSum("Value", z.groupBy(d=>d['CO2'],variableGroup['Outflows of foreign population by nationality'])) // sum of outflows by country
stockSum = z.gbSum("Value", z.groupBy(d=>d['CO2'],variableGroup['Stock of foreign-born population by country of birth'])) // sum of Stock of foreign-born population by country of birth
inflowAsylum = z.gbSum("Value", z.groupBy(d=>d['CO2'],variableGroup['Inflows of asylum seekers by nationality'])) // Sum of Inflows of asylum seekers by nationality
stockForeign = z.gbSum("Value", z.groupBy(d=>d['CO2'],variableGroup['Stock of foreign population by nationality'])) // sum of Stock of foreign population by nationality
acquisition = z.gbSum("Value", z.groupBy(d=>d['CO2'],variableGroup['Acquisition of nationality by country of former nationality'])) // sum of Acquisition of nationality by country of former nationality
stockForeignBornLabour = z.gbSum("Value", z.groupBy(d=>d['CO2'],variableGroup['Stock of foreign-born labour by country of birth'])) // sum of Stock of foreign-born labour by country of birth
stockForeignLabour = z.gbSum("Value", z.groupBy(d=>d['CO2'],variableGroup['Stock of foreign labour by nationality'])) // sum of Stock of foreign labour by nationality
mergeIncome = z.merge(dataSet1b, dataSet2b, "CO2", "Country Code", "_df1", "_df2") // merging original datasets
df_summed = { // adding all the previous sums into a new df
let grouping = []
for (let i=0; i<210; i++)
{
let row = {};
row['Country code'] = inflowSum[i].group;
row['Income_Group'] = mergeIncome[i].IncomeGroup; // selecting income from the previous merge
row['Sum_Inflow'] = inflowSum[i].sum;
row['Sum_Outflow'] = outflowSum[i].sum;
row['Total_Stock'] = stockSum[i].sum;
row['Inflow_Asylum'] = inflowAsylum[i].sum;
row['Stock_Foreign'] = stockForeign[i].sum;
row['Acquisition_Nationality'] = acquisition[i].sum;
row['Stock_Foreign_Born_Labour'] = stockForeignBornLabour[i].sum;
row['Stock_Foreign_Labour'] = stockForeignLabour[i].sum; // adding every sum
grouping.push(row)
}
return grouping;
}
vegaEmbed = require("vega-embed@3")
viewof multiple_histograms = vegaEmbed({
vconcat: [
{
title : "Low Income Countries",
repeat: {
column: ["Sum_Inflow", "Sum_Outflow", "Total_Stock", "Inflow_Asylum", "Stock_Foreign", "Acquisition_Nationality", "Stock_Foreign_Born_Labour", "Stock_Foreign_Labour"]
},
spec: {
data: {values: z.filter(x=>x.Income_Group=="Low income", df_summed)}, // Low Income
mark: "bar",
encoding: {
x: {field: {"repeat": "column"}, bin: {"maxbins": 12}}, // specifying 12 bins
y: {aggregate: "count",type: "quantitative"},
},
value: "grey"
}
},
{
title : "Upper middle income countries",
repeat: {
column: ["Sum_Inflow", "Sum_Outflow", "Total_Stock", "Inflow_Asylum", "Stock_Foreign", "Acquisition_Nationality", "Stock_Foreign_Born_Labour", "Stock_Foreign_Labour"]
},
spec: {
data: {values: z.filter(x=>x.Income_Group=="Upper middle income", df_summed)},
mark: "bar",
encoding: {
x: {field: {"repeat": "column"}, bin: {"maxbins": 12}},
y: {aggregate: "count",type: "quantitative"},
},
value: "grey"
}
},
{
title : "High Income Countries",
repeat: {
column: ["Sum_Inflow", "Sum_Outflow", "Total_Stock", "Inflow_Asylum", "Stock_Foreign", "Acquisition_Nationality", "Stock_Foreign_Born_Labour", "Stock_Foreign_Labour"]
},
spec: {
data: {values: z.filter(x=>x.Income_Group=="High income", df_summed)},
mark: "bar",
encoding: {
x: {field: {"repeat": "column"}, bin: {"maxbins": 12}},
y: {aggregate: "count",type: "quantitative"},
},
value: "grey"
}
},
{
title : "Lower middle income countries",
repeat: {
column: ["Sum_Inflow", "Sum_Outflow", "Total_Stock", "Inflow_Asylum", "Stock_Foreign", "Acquisition_Nationality", "Stock_Foreign_Born_Labour", "Stock_Foreign_Labour"]
},
spec: {
data: {values: z.filter(x=>x.Income_Group=="Lower middle income", df_summed)},
mark: "bar",
encoding: {
x: {field: {"repeat": "column"}, bin: {"maxbins": 12}},
y: {aggregate: "count",type: "quantitative"},
},
value: "grey"
}
},
{
title : "undefined", // adding undefined
repeat: {
column: ["Sum_Inflow", "Sum_Outflow", "Total_Stock", "Inflow_Asylum", "Stock_Foreign", "Acquisition_Nationality", "Stock_Foreign_Born_Labour", "Stock_Foreign_Labour"]
},
spec: {
data: {values: z.filter(x=>x.Income_Group=="undefined", df_summed)},
mark: "bar",
encoding: {
x: {field: {"repeat": "column"}, bin: {"maxbins": 12}},
y: {aggregate: "count",type: "quantitative"},
},
value: "grey"
}
},
]})
// Your code here
viewof stacked = vegaEmbed({
repeat: {
column: ["Sum_Inflow", "Sum_Outflow", "Total_Stock", "Inflow_Asylum", "Stock_Foreign", "Acquisition_Nationality", "Stock_Foreign_Born_Labour", "Stock_Foreign_Labour"] // each one will be a different graph
},
data: {values: z.filter(x=>x["Country Code"]!="TOT", df_summed)}, // Excluding TOT because the number is too high
spec: {
mark: "bar",
encoding: {
y: {
aggregate: "count", type: "quantitative", // agreggating by countries
stack: "normalize"
},
x: {
field: {"repeat": "column"}, type: "quantitative", bin: {"maxbins": 12}
},
color: {
field: "Income_Group", type: "nominal",
scale: {"range": ["#5B00E5","#002BDD","#006CD9","#00AAD5","#00CE7C","#00C600","#71BF00"]}
}
}
}
})
GDP2017data = "https://gist.githubusercontent.com/dchonglu/65f219187994d15ac5fd2092ea8dc6dd/raw/bc2f0b99abeaf00279cf237df7c2ebd2a4084df8/GDP2"
dataGDP = d3.csv(GDP2017data) // importing 2017 GDP
gdp2017 = z.pickCols(['Country Code', '2017'], dataGDP.slice()) // selecting just two columns: country code and year 2017
mergeGDP = z.merge(dataGDP, df_summed, "Country Code", "Country code", "_df1", "_df2") // merging the two datasets
groupYear = z.groupBy(x=>x.Year, migration_join) // group by year
inflow2017 = z.gbSum("Value", z.groupBy(d=>d['CO2'],variableGroup['Inflows of foreign population by nationality'], groupYear['2017'])) // sum of the value of inflows by country, considering only year 2017
mergeGDP2017noregion = z.merge(gdp2017, inflow2017, "Country Code", "group", "_df1", "_df2") // merge of GDP and inflow2017 -- does not contain region by country
mergeGDP2017 = z.merge(mergeGDP2017noregion, dataSet2b, "Country Code", "Country Code", "_df1", "_df2") // merging previous one with Medadata that contains regions
viewof scatterplot = vegaEmbed({ // scatterplot of inflows vs. GDP 2017
width:600,
height:600,
title:"GDP 2017",
data:{values: mergeGDP2017},
mark: {type:"point",tooltip:{"content":"data"}, filled: true, size:40},
encoding: {
x: {field: "sum", type: "quantitative", title:"Total Inflows of foreign population"}, // field "sum" = total inflows
y: {field: "2017", type: "quantitative", title:"GDP 2017"}, // field "2017" = GDP in 2017
color: {
"field": "Region", "type": "nominal",
}
}
})
// Your code here
yearGroup = z.groupBy(x=>x.Year, migration_join) // Grouping by year
yearCountry = { // Creating a new df that contains all countries, all inflows per year
let grouping = [];
for (let i=0;i<Object.keys(yearGroup).length;i++){
let tempo1 = z.gbSum("Value", z.groupBy(d=>d.CO2, yearGroup[Object.keys(yearGroup)[i]]));
for (let y=0;y<Object.keys(tempo1).length;y++){
let currRow = {};
currRow.year = Object.keys(yearGroup)[i];
currRow.country = tempo1[y].group;
currRow.value = tempo1[y].sum;
grouping.push(currRow);
}
}
return grouping;
}
viewof scatterplot2 = vegaEmbed({
width:900,
height:900,
title:"Total Inflows of Foreign Population by Country by Year",
data: {values: z.filter(r=>r.country!="TOT", yearCountry)},
"layer":[{
mark: {type: "point", "tooltip": {"content": "data"}, "filled": true}, // points per country
encoding: {
x: {field: "year", type: "temporal", title:"Year"},
y: {field: "value", type: "quantitative", title: "Inflows from Country"}
}
},{
mark: "line", // line showing the mean value
encoding: {
x: {field: "year", type:"temporal"},
y: {field: "value", type: "quantitative", aggregate: "mean"},
size: {"value": 2},
color: {"value":"pink"}
}
}
]})
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
