Software developer and power user
Published
Edited
Jan 3, 2021
1 star
firstRespondent = {
const firstRespondent = mostRecentSurvey[0];
const creationDateStrings = mostRecentSurvey.map(d => d.createdAt["$date"]);
if (firstRespondent.createdAt["$date"] !== d3.min(creationDateStrings)) {
throw "Not the first respondent chronologically";
}
return firstRespondent;
}
firstRespondent.user_info.how_did_user_find_out_about_the_survey
mostRecentSurvey = rawData.filter(d => d.year === 2020)
rawData = {
const utf8Decoder = new TextDecoder();
const decodedText = utf8Decoder.decode(decompressedFileBuffer);
return JSON.parse(decodedText);
}
decompressedFileBuffer = {
const decompressedFileBuffer = await archive.file("state_of_css_2019-2020.json").async("arraybuffer") // utf-8 encoded
mutable sizeLiteral = `${formatMegabytes(compressedFileBuffer.byteLength)} in size, ${formatMegabytes(decompressedFileBuffer.byteLength)} unzipped`;
return decompressedFileBuffer;
}
archive = {
const jszip = await require("jszip@3/dist/jszip.min.js"); // see: https://observablehq.com/@mbostock/hello-jszip
return jszip.loadAsync(compressedFileBuffer);
}
compressedFileBuffer = FileAttachment("state_of_css_2019-2020.json.zip").arrayBuffer()
participationByCountry
difference = {
const a = participationByCountry.completion.count;
const b = d3.sum(participationByCountry.buckets, d => d.count);
return Math.abs(a - b);
}
participantCountByCountry = d3.rollup(countrySpecificRespondents, v => v.length, d => d.country_alpha3)
countrySpecificRespondents = mostRecentSurvey.map(d => d.user_info)
.filter(d => d.country_alpha3 !== undefined)
missingCountryNames = [...missingCountryCodes].map(code => {
return countrySpecificRespondents.find(d => d.country_alpha3 === code).country_name;
})
missingCountryCodes = {
const a = [...participantCountByCountry.keys()].sort();
const b = participationByCountry.buckets.map(d => d.id);
return d3.difference(a, b);
}
missingRespondents = countrySpecificRespondents.filter(d => missingCountryCodes.has(d.country_alpha3))
// see: https://observablehq.com/@observablehq/introduction-to-mutable-state
mutable sizeLiteral = "I’ve added some ~~elevator music~~ metalcore [below](#metalcore) to cover downloading and decompression"
formatMegabytes = (bytes) => `${Math.round(bytes / (1024 * 1024))} MB`
d3 = require("d3-array@2")
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.
