Published
Edited
May 25, 2021
2 forks
Importers
37 stars
Also listed in…
shorts
dummyWidth = 1000 // this number is not meaningful in any way
fittedProjection = rawprojection.fitWidth(dummyWidth, {type: "Sphere"}).rotate([LonRot, LatRot, -RollRot])
dummyHeight = {
const sphere = {type: "Sphere"};
const [[x0, y0], [x1, y1]] = d3.geoPath(rawprojection.fitWidth(dummyWidth, sphere)).bounds(sphere);
const dy = (y1 - y0);
return dy;
}
emojiAspectRatio = (17.2) / (-0.05 + 16.9*lineHeight)
cellHeight = cellWidth/emojiAspectRatio
lonlatMatrix = rasterizeMap(upSampler*Math.ceil(dummyHeight/cellHeight),
upSampler*numEmojiWide,
[0, dummyHeight, 0, dummyWidth],
fittedProjection)
countryCodeMatrix = lonlatMatrix.map(r => r.map(c => lonLat2country([c.lon, c.lat])))
countryCodeMatrix_Down = downSampleByWeightedFreq(countryCodeMatrix, upSampler,
new Map([[waterCode, waterCodeWeight],
[missingCode, missingCodeWeight]]))
countryEmoji = FileAttachment("countryInfo.csv").csv()
countryEmojiLookup = {
var m = new Map(countryEmoji.map(key => [Number(key.numeric), key.flag]));
// I'm missing a few
m.set(10, "🇦🇶");
m.set(304, "🇬🇱");
m.set(732, "🇪🇭");
m.set(254, "🇬🇫");
m.set(238, "🇫🇰");
m.set(158, "🇹🇼");
m.set(540, "🇳🇨");
m.set(239, "🇬🇸");
m.set(258, "🇵🇫");
m.set(796, "🇹🇨");
m.set(92 , "🇻🇬");
m.set(850, "🇻🇮");
m.set(660, "🇦🇮");
m.set(52, "🇧🇧");
m.set(670, "🇻🇨");
m.set(780, "🇹🇹");
m.set(662, "🇱🇨");
m.set(474, "🇲🇶");
m.set(212, "🇩🇲");
m.set(312, "🇬🇵");
m.set(630, "🇵🇷");
m.set(744, "🇸🇯");
// that was #realdatascience
return m;
}
emojiMatrix = {
return countryCodeMatrix_Down.map(r => r.map(c => {
if(c == waterCode){
if(waterEmoji=='custom'){
return customWater
}else{
return waterEmoji
}
}else if(c == missingCode){
return offmapEmoji
}else if(c == 10){ //antarctica
if(antarcticaEmoji == "Land"){
if (landEmoji== "Country Flag"){
return countryEmojiLookup.get(c);
}else if(landEmoji=='custom'){
return customLand;
}else{
return landEmoji
}
}else if(antarcticaEmoji == "Water"){
if(waterEmoji=='custom'){
return customWater
}else{
return waterEmoji
}
}else{
return customAntarctica;
}
}else{
if (landEmoji== "Country Flag"){
var out = countryEmojiLookup.get(c);
return (out==undefined) ? (landFallbackEmoji) : out;
}else if(landEmoji=='custom'){
return customLand;
}else{
return landEmoji
}
}
}))
}
textOutput = {
var str = '';
for(var emojiRow of emojiMatrix){
for(var emoji of emojiRow){
str = str+emoji;
}
str = str+'<br>'
}
str = str + '<br><a href="http://twitter.com/mattdzugan" target="_blank">@mattdzugan</a>' // ❤
const p = `<div style="line-height: ${lineHeight}; font-size: ${fontSize}px; font-family:monospace">${str}</div>`;
return p;
}
ii = {
let i = 0;
while (true) {
await Promises.delay(100);
if(rotate){
i++;
}
yield i;
}
}
{
function set(input, value) {
input.value = value;
input.dispatchEvent(new Event("input"));
}
if(rotate){
set(viewof LonRot, (ii%360)-180)
}
}
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.
