Verified Account

2a:null 2b:["$","title",null,{"children":"Visualizing Twitter data 🐦 | Andrea Mignone | Observable"}] 31:T6ac,

- 👤 _User_: **${profile.name}** (*@${profile.username}*) ${ profile.verified ? svg``: '' } - 📊 _Metrics_: **${numberFormatter.format(profile.public_metrics.followers_count)}** followers | **${numberFormatter.format(profile.public_metrics.following_count)}** following | **${numberFormatter.format(profile.public_metrics.tweet_count)}** tweets | **${numberFormatter.format(profile.public_metrics.listed_count)}** listed - 🗓️ _Joined_: ${profile.created_at ? d3.timeFormat('%Y-%m-%d h %H:%M')(profile.created_at) : 'n/a'} - ℹ️ _Bio_: ${profile.description ? profile.description : 'n/a'} - 📍 _Location_: ${profile.location ? profile.location : 'n/a'} 32:T743,calendar = { const svg = d3.create("svg") .attr("viewBox", [0, 0, width, height * years.length]) .attr("font-family", "sans-serif") .attr("font-size", 10); const year = svg.selectAll("g") .data(years) .join("g") .attr("transform", (d, i) => `translate(40.5,${height * i + cellSize * 1.5})`); year.append("text") .attr("x", -5) .attr("y", -5) .attr("font-weight", "bold") .attr("text-anchor", "end") .text(([key]) => key); year.append("g") .attr("text-anchor", "end") .selectAll("text") .data(weekday === "weekday" ? d3.range(1, 6) : d3.range(7)) .join("text") .attr("x", -5) .attr("y", i => (countDay(i) + 0.5) * cellSize) .attr("dy", "0.31em") .text(formatDay); year.append("g") .selectAll("rect") .data(weekday === "weekday" ? ([, values]) => values.filter(d => ![0, 6].includes(d.date.getDay())) : ([, values]) => values) .join("rect") .attr("width", cellSize - 1) .attr("height", cellSize - 1) .attr("x", d => timeWeek.count(d3.timeYear(d.date), d.date) * cellSize + 0.5) .attr("y", d => countDay(d.date.getDay()) * cellSize + 0.5) .attr("fill", d => color(d.value)) .append("title") .text(d => `${d3.timeFormat('%Y-%m-%d')(d.date)}\n${d.value} items`) const month = year.append("g") .selectAll("g") .data(([, values]) => d3.timeMonths(d3.timeMonth(values[0].date), values[values.length - 1].date)) .join("g"); month.filter((d, i) => i).append("path") .attr("fill", "none") .attr("stroke", "#fff") .attr("stroke-width", 3) .attr("d", pathMonth); month.append("text") .attr("x", d => timeWeek.count(d3.timeYear(d), timeWeek.ceil(d)) * cellSize + 2) .attr("y", -5) .text(formatMonth); return svg.node(); }33:T60f,time = { const svg = d3.create("svg") .attr("viewBox", [0, 0, width, heightTime]) .attr("font-family", "sans-serif") .attr("font-size", 10); const week = svg .append("g") .attr("transform", `translate(40.5,${cellSizeTime * 1.5})`); // title week.append("text") .attr("x", -5) .attr("y", -5) .attr("font-weight", "bold") .attr("text-anchor", "end") .text("week"); // weekdays part 1 week.append("g") .attr("text-anchor", "end") .selectAll("text") .data(weekday === "weekday" ? d3.range(1, 6) : d3.range(7)) .join("text") .attr("x", -5) .attr("y", i => (countDay(i) + 0.5) * cellSizeTime) .attr("dy", "0.31em") .text(formatDay); // weekdays part 2 week.append("g") .selectAll("rect") .data(weekday === "weekday" ? (weekDays.filter(d => ![0, 6].includes(d[0]))) : weekDays) .join("rect") .attr("width", cellSizeTime - 1) .attr("height", cellSizeTime - 1) .attr("x", d => d[1] * cellSizeTime + 0.5) .attr("y", d => countDay(d[0]) * cellSizeTime + 0.5) .attr("rx", 3) .attr("fill", d => colorWeek(d[2])) .append("title") .text(d => `day: ${formatDay(d[0])}\nfrom ${d[1]}:00 to ${d[1]}:59\n${d[2]} items`) const hour = week.append("g") .selectAll("g") .data(d3.range(2, 25, 2)) .join("g"); hour.append("text") .attr("x", d => d * cellSizeTime) .attr("y", -5) .attr("text-anchor", "middle") .text(d => d); return svg.node(); }34:T36b5,// https://github.com/mathiasbynens/emoji-regex emojiRegex = /\u{1F3F4}\u{E0067}\u{E0062}(?:\u{E0077}\u{E006C}\u{E0073}|\u{E0073}\u{E0063}\u{E0074}|\u{E0065}\u{E006E}\u{E0067})\u{E007F}|(?:\u{1F9D1}\u{1F3FF}\u200D\u2764\uFE0F\u200D(?:\u{1F48B}\u200D)?\u{1F9D1}|\u{1F469}\u{1F3FF}\u200D\u{1F91D}\u200D[\u{1F468}\u{1F469}])[\u{1F3FB}-\u{1F3FE}]|(?:\u{1F9D1}\u{1F3FE}\u200D\u2764\uFE0F\u200D(?:\u{1F48B}\u200D)?\u{1F9D1}|\u{1F469}\u{1F3FE}\u200D\u{1F91D}\u200D[\u{1F468}\u{1F469}])[\u{1F3FB}-\u{1F3FD}\u{1F3FF}]|(?:\u{1F9D1}\u{1F3FD}\u200D\u2764\uFE0F\u200D(?:\u{1F48B}\u200D)?\u{1F9D1}|\u{1F469}\u{1F3FD}\u200D\u{1F91D}\u200D[\u{1F468}\u{1F469}])[\u{1F3FB}\u{1F3FC}\u{1F3FE}\u{1F3FF}]|(?:\u{1F9D1}\u{1F3FC}\u200D\u2764\uFE0F\u200D(?:\u{1F48B}\u200D)?\u{1F9D1}|\u{1F469}\u{1F3FC}\u200D\u{1F91D}\u200D[\u{1F468}\u{1F469}])[\u{1F3FB}\u{1F3FD}-\u{1F3FF}]|(?:\u{1F9D1}\u{1F3FB}\u200D\u2764\uFE0F\u200D(?:\u{1F48B}\u200D)?\u{1F9D1}|\u{1F469}\u{1F3FB}\u200D\u{1F91D}\u200D[\u{1F468}\u{1F469}])[\u{1F3FC}-\u{1F3FF}]|\u{1F468}(?:\u{1F3FB}(?:\u200D(?:\u2764\uFE0F\u200D(?:\u{1F48B}\u200D\u{1F468}[\u{1F3FB}-\u{1F3FF}]|\u{1F468}[\u{1F3FB}-\u{1F3FF}])|\u{1F91D}\u200D\u{1F468}[\u{1F3FC}-\u{1F3FF}]|[\u2695\u2696\u2708]\uFE0F|[\u{1F33E}\u{1F373}\u{1F37C}\u{1F393}\u{1F3A4}\u{1F3A8}\u{1F3EB}\u{1F3ED}\u{1F4BB}\u{1F4BC}\u{1F527}\u{1F52C}\u{1F680}\u{1F692}\u{1F9AF}-\u{1F9B3}\u{1F9BC}\u{1F9BD}]))?|[\u{1F3FC}-\u{1F3FF}]\u200D\u2764\uFE0F\u200D(?:\u{1F48B}\u200D\u{1F468}[\u{1F3FB}-\u{1F3FF}]|\u{1F468}[\u{1F3FB}-\u{1F3FF}])|\u200D(?:\u2764\uFE0F\u200D(?:\u{1F48B}\u200D)?\u{1F468}|[\u{1F468}\u{1F469}]\u200D(?:\u{1F466}\u200D\u{1F466}|\u{1F467}\u200D[\u{1F466}\u{1F467}])|\u{1F466}\u200D\u{1F466}|\u{1F467}\u200D[\u{1F466}\u{1F467}]|[\u{1F33E}\u{1F373}\u{1F37C}\u{1F393}\u{1F3A4}\u{1F3A8}\u{1F3EB}\u{1F3ED}\u{1F4BB}\u{1F4BC}\u{1F527}\u{1F52C}\u{1F680}\u{1F692}\u{1F9AF}-\u{1F9B3}\u{1F9BC}\u{1F9BD}])|\u{1F3FF}\u200D(?:\u{1F91D}\u200D\u{1F468}[\u{1F3FB}-\u{1F3FE}]|[\u{1F33E}\u{1F373}\u{1F37C}\u{1F393}\u{1F3A4}\u{1F3A8}\u{1F3EB}\u{1F3ED}\u{1F4BB}\u{1F4BC}\u{1F527}\u{1F52C}\u{1F680}\u{1F692}\u{1F9AF}-\u{1F9B3}\u{1F9BC}\u{1F9BD}])|\u{1F3FE}\u200D(?:\u{1F91D}\u200D\u{1F468}[\u{1F3FB}-\u{1F3FD}\u{1F3FF}]|[\u{1F33E}\u{1F373}\u{1F37C}\u{1F393}\u{1F3A4}\u{1F3A8}\u{1F3EB}\u{1F3ED}\u{1F4BB}\u{1F4BC}\u{1F527}\u{1F52C}\u{1F680}\u{1F692}\u{1F9AF}-\u{1F9B3}\u{1F9BC}\u{1F9BD}])|\u{1F3FD}\u200D(?:\u{1F91D}\u200D\u{1F468}[\u{1F3FB}\u{1F3FC}\u{1F3FE}\u{1F3FF}]|[\u{1F33E}\u{1F373}\u{1F37C}\u{1F393}\u{1F3A4}\u{1F3A8}\u{1F3EB}\u{1F3ED}\u{1F4BB}\u{1F4BC}\u{1F527}\u{1F52C}\u{1F680}\u{1F692}\u{1F9AF}-\u{1F9B3}\u{1F9BC}\u{1F9BD}])|\u{1F3FC}\u200D(?:\u{1F91D}\u200D\u{1F468}[\u{1F3FB}\u{1F3FD}-\u{1F3FF}]|[\u{1F33E}\u{1F373}\u{1F37C}\u{1F393}\u{1F3A4}\u{1F3A8}\u{1F3EB}\u{1F3ED}\u{1F4BB}\u{1F4BC}\u{1F527}\u{1F52C}\u{1F680}\u{1F692}\u{1F9AF}-\u{1F9B3}\u{1F9BC}\u{1F9BD}])|(?:\u{1F3FF}\u200D[\u2695\u2696\u2708]|\u{1F3FE}\u200D[\u2695\u2696\u2708]|\u{1F3FD}\u200D[\u2695\u2696\u2708]|\u{1F3FC}\u200D[\u2695\u2696\u2708]|\u200D[\u2695\u2696\u2708])\uFE0F|\u200D(?:[\u{1F468}\u{1F469}]\u200D[\u{1F466}\u{1F467}]|[\u{1F466}\u{1F467}])|\u{1F3FF}|\u{1F3FE}|\u{1F3FD}|\u{1F3FC})?|(?:\u{1F469}(?:\u{1F3FB}\u200D\u2764\uFE0F\u200D(?:\u{1F48B}\u200D[\u{1F468}\u{1F469}]|[\u{1F468}\u{1F469}])|[\u{1F3FC}-\u{1F3FF}]\u200D\u2764\uFE0F\u200D(?:\u{1F48B}\u200D[\u{1F468}\u{1F469}]|[\u{1F468}\u{1F469}]))|\u{1F9D1}[\u{1F3FB}-\u{1F3FF}]\u200D\u{1F91D}\u200D\u{1F9D1})[\u{1F3FB}-\u{1F3FF}]|\u{1F469}\u200D\u{1F469}\u200D(?:\u{1F466}\u200D\u{1F466}|\u{1F467}\u200D[\u{1F466}\u{1F467}])|\u{1F469}(?:\u200D(?:\u2764\uFE0F\u200D(?:\u{1F48B}\u200D[\u{1F468}\u{1F469}]|[\u{1F468}\u{1F469}])|[\u{1F33E}\u{1F373}\u{1F37C}\u{1F393}\u{1F3A4}\u{1F3A8}\u{1F3EB}\u{1F3ED}\u{1F4BB}\u{1F4BC}\u{1F527}\u{1F52C}\u{1F680}\u{1F692}\u{1F9AF}-\u{1F9B3}\u{1F9BC}\u{1F9BD}])|\u{1F3FF}\u200D[\u{1F33E}\u{1F373}\u{1F37C}\u{1F393}\u{1F3A4}\u{1F3A8}\u{1F3EB}\u{1F3ED}\u{1F4BB}\u{1F4BC}\u{1F527}\u{1F52C}\u{1F680}\u{1F692}\u{1F9AF}-\u{1F9B3}\u{1F9BC}\u{1F9BD}]|\u{1F3FE}\u200D[\u{1F33E}\u{1F373}\u{1F37C}\u{1F393}\u{1F3A4}\u{1F3A8}\u{1F3EB}\u{1F3ED}\u{1F4BB}\u{1F4BC}\u{1F527}\u{1F52C}\u{1F680}\u{1F692}\u{1F9AF}-\u{1F9B3}\u{1F9BC}\u{1F9BD}]|\u{1F3FD}\u200D[\u{1F33E}\u{1F373}\u{1F37C}\u{1F393}\u{1F3A4}\u{1F3A8}\u{1F3EB}\u{1F3ED}\u{1F4BB}\u{1F4BC}\u{1F527}\u{1F52C}\u{1F680}\u{1F692}\u{1F9AF}-\u{1F9B3}\u{1F9BC}\u{1F9BD}]|\u{1F3FC}\u200D[\u{1F33E}\u{1F373}\u{1F37C}\u{1F393}\u{1F3A4}\u{1F3A8}\u{1F3EB}\u{1F3ED}\u{1F4BB}\u{1F4BC}\u{1F527}\u{1F52C}\u{1F680}\u{1F692}\u{1F9AF}-\u{1F9B3}\u{1F9BC}\u{1F9BD}]|\u{1F3FB}\u200D[\u{1F33E}\u{1F373}\u{1F37C}\u{1F393}\u{1F3A4}\u{1F3A8}\u{1F3EB}\u{1F3ED}\u{1F4BB}\u{1F4BC}\u{1F527}\u{1F52C}\u{1F680}\u{1F692}\u{1F9AF}-\u{1F9B3}\u{1F9BC}\u{1F9BD}])|\u{1F9D1}(?:\u200D(?:\u{1F91D}\u200D\u{1F9D1}|[\u{1F33E}\u{1F373}\u{1F37C}\u{1F384}\u{1F393}\u{1F3A4}\u{1F3A8}\u{1F3EB}\u{1F3ED}\u{1F4BB}\u{1F4BC}\u{1F527}\u{1F52C}\u{1F680}\u{1F692}\u{1F9AF}-\u{1F9B3}\u{1F9BC}\u{1F9BD}])|\u{1F3FF}\u200D[\u{1F33E}\u{1F373}\u{1F37C}\u{1F384}\u{1F393}\u{1F3A4}\u{1F3A8}\u{1F3EB}\u{1F3ED}\u{1F4BB}\u{1F4BC}\u{1F527}\u{1F52C}\u{1F680}\u{1F692}\u{1F9AF}-\u{1F9B3}\u{1F9BC}\u{1F9BD}]|\u{1F3FE}\u200D[\u{1F33E}\u{1F373}\u{1F37C}\u{1F384}\u{1F393}\u{1F3A4}\u{1F3A8}\u{1F3EB}\u{1F3ED}\u{1F4BB}\u{1F4BC}\u{1F527}\u{1F52C}\u{1F680}\u{1F692}\u{1F9AF}-\u{1F9B3}\u{1F9BC}\u{1F9BD}]|\u{1F3FD}\u200D[\u{1F33E}\u{1F373}\u{1F37C}\u{1F384}\u{1F393}\u{1F3A4}\u{1F3A8}\u{1F3EB}\u{1F3ED}\u{1F4BB}\u{1F4BC}\u{1F527}\u{1F52C}\u{1F680}\u{1F692}\u{1F9AF}-\u{1F9B3}\u{1F9BC}\u{1F9BD}]|\u{1F3FC}\u200D[\u{1F33E}\u{1F373}\u{1F37C}\u{1F384}\u{1F393}\u{1F3A4}\u{1F3A8}\u{1F3EB}\u{1F3ED}\u{1F4BB}\u{1F4BC}\u{1F527}\u{1F52C}\u{1F680}\u{1F692}\u{1F9AF}-\u{1F9B3}\u{1F9BC}\u{1F9BD}]|\u{1F3FB}\u200D[\u{1F33E}\u{1F373}\u{1F37C}\u{1F384}\u{1F393}\u{1F3A4}\u{1F3A8}\u{1F3EB}\u{1F3ED}\u{1F4BB}\u{1F4BC}\u{1F527}\u{1F52C}\u{1F680}\u{1F692}\u{1F9AF}-\u{1F9B3}\u{1F9BC}\u{1F9BD}])|\u{1F469}\u200D\u{1F466}\u200D\u{1F466}|\u{1F469}\u200D\u{1F469}\u200D[\u{1F466}\u{1F467}]|\u{1F469}\u200D\u{1F467}\u200D[\u{1F466}\u{1F467}]|(?:\u{1F441}\uFE0F\u200D\u{1F5E8}|\u{1F9D1}(?:\u{1F3FF}\u200D[\u2695\u2696\u2708]|\u{1F3FE}\u200D[\u2695\u2696\u2708]|\u{1F3FD}\u200D[\u2695\u2696\u2708]|\u{1F3FC}\u200D[\u2695\u2696\u2708]|\u{1F3FB}\u200D[\u2695\u2696\u2708]|\u200D[\u2695\u2696\u2708])|\u{1F469}(?:\u{1F3FF}\u200D[\u2695\u2696\u2708]|\u{1F3FE}\u200D[\u2695\u2696\u2708]|\u{1F3FD}\u200D[\u2695\u2696\u2708]|\u{1F3FC}\u200D[\u2695\u2696\u2708]|\u{1F3FB}\u200D[\u2695\u2696\u2708]|\u200D[\u2695\u2696\u2708])|\u{1F636}\u200D\u{1F32B}|\u{1F3F3}\uFE0F\u200D\u26A7|\u{1F43B}\u200D\u2744|(?:[\u{1F3C3}\u{1F3C4}\u{1F3CA}\u{1F46E}\u{1F470}\u{1F471}\u{1F473}\u{1F477}\u{1F481}\u{1F482}\u{1F486}\u{1F487}\u{1F645}-\u{1F647}\u{1F64B}\u{1F64D}\u{1F64E}\u{1F6A3}\u{1F6B4}-\u{1F6B6}\u{1F926}\u{1F935}\u{1F937}-\u{1F939}\u{1F93D}\u{1F93E}\u{1F9B8}\u{1F9B9}\u{1F9CD}-\u{1F9CF}\u{1F9D4}\u{1F9D6}-\u{1F9DD}][\u{1F3FB}-\u{1F3FF}]|[\u{1F46F}\u{1F93C}\u{1F9DE}\u{1F9DF}])\u200D[\u2640\u2642]|[\u26F9\u{1F3CB}\u{1F3CC}\u{1F575}][\uFE0F\u{1F3FB}-\u{1F3FF}]\u200D[\u2640\u2642]|\u{1F3F4}\u200D\u2620|[\u{1F3C3}\u{1F3C4}\u{1F3CA}\u{1F46E}\u{1F470}\u{1F471}\u{1F473}\u{1F477}\u{1F481}\u{1F482}\u{1F486}\u{1F487}\u{1F645}-\u{1F647}\u{1F64B}\u{1F64D}\u{1F64E}\u{1F6A3}\u{1F6B4}-\u{1F6B6}\u{1F926}\u{1F935}\u{1F937}-\u{1F939}\u{1F93D}\u{1F93E}\u{1F9B8}\u{1F9B9}\u{1F9CD}-\u{1F9CF}\u{1F9D4}\u{1F9D6}-\u{1F9DD}]\u200D[\u2640\u2642]|[\xA9\xAE\u203C\u2049\u2122\u2139\u2194-\u2199\u21A9\u21AA\u2328\u23CF\u23ED-\u23EF\u23F1\u23F2\u23F8-\u23FA\u24C2\u25AA\u25AB\u25B6\u25C0\u25FB\u25FC\u2600-\u2604\u260E\u2611\u2618\u2620\u2622\u2623\u2626\u262A\u262E\u262F\u2638-\u263A\u2640\u2642\u265F\u2660\u2663\u2665\u2666\u2668\u267B\u267E\u2692\u2694-\u2697\u2699\u269B\u269C\u26A0\u26A7\u26B0\u26B1\u26C8\u26CF\u26D1\u26D3\u26E9\u26F0\u26F1\u26F4\u26F7\u26F8\u2702\u2708\u2709\u270F\u2712\u2714\u2716\u271D\u2721\u2733\u2734\u2744\u2747\u2763\u27A1\u2934\u2935\u2B05-\u2B07\u3030\u303D\u3297\u3299\u{1F170}\u{1F171}\u{1F17E}\u{1F17F}\u{1F202}\u{1F237}\u{1F321}\u{1F324}-\u{1F32C}\u{1F336}\u{1F37D}\u{1F396}\u{1F397}\u{1F399}-\u{1F39B}\u{1F39E}\u{1F39F}\u{1F3CD}\u{1F3CE}\u{1F3D4}-\u{1F3DF}\u{1F3F5}\u{1F3F7}\u{1F43F}\u{1F4FD}\u{1F549}\u{1F54A}\u{1F56F}\u{1F570}\u{1F573}\u{1F576}-\u{1F579}\u{1F587}\u{1F58A}-\u{1F58D}\u{1F5A5}\u{1F5A8}\u{1F5B1}\u{1F5B2}\u{1F5BC}\u{1F5C2}-\u{1F5C4}\u{1F5D1}-\u{1F5D3}\u{1F5DC}-\u{1F5DE}\u{1F5E1}\u{1F5E3}\u{1F5E8}\u{1F5EF}\u{1F5F3}\u{1F5FA}\u{1F6CB}\u{1F6CD}-\u{1F6CF}\u{1F6E0}-\u{1F6E5}\u{1F6E9}\u{1F6F0}\u{1F6F3}])\uFE0F|\u{1F3F3}\uFE0F\u200D\u{1F308}|\u{1F469}\u200D\u{1F467}|\u{1F469}\u200D\u{1F466}|\u{1F635}\u200D\u{1F4AB}|\u{1F62E}\u200D\u{1F4A8}|\u{1F415}\u200D\u{1F9BA}|\u{1F9D1}(?:\u{1F3FF}|\u{1F3FE}|\u{1F3FD}|\u{1F3FC}|\u{1F3FB})?|\u{1F469}(?:\u{1F3FF}|\u{1F3FE}|\u{1F3FD}|\u{1F3FC}|\u{1F3FB})?|\u{1F1FD}\u{1F1F0}|\u{1F1F6}\u{1F1E6}|\u{1F1F4}\u{1F1F2}|\u{1F408}\u200D\u2B1B|\u2764\uFE0F\u200D[\u{1F525}\u{1FA79}]|\u{1F441}\uFE0F|\u{1F3F3}\uFE0F|\u{1F1FF}[\u{1F1E6}\u{1F1F2}\u{1F1FC}]|\u{1F1FE}[\u{1F1EA}\u{1F1F9}]|\u{1F1FC}[\u{1F1EB}\u{1F1F8}]|\u{1F1FB}[\u{1F1E6}\u{1F1E8}\u{1F1EA}\u{1F1EC}\u{1F1EE}\u{1F1F3}\u{1F1FA}]|\u{1F1FA}[\u{1F1E6}\u{1F1EC}\u{1F1F2}\u{1F1F3}\u{1F1F8}\u{1F1FE}\u{1F1FF}]|\u{1F1F9}[\u{1F1E6}\u{1F1E8}\u{1F1E9}\u{1F1EB}-\u{1F1ED}\u{1F1EF}-\u{1F1F4}\u{1F1F7}\u{1F1F9}\u{1F1FB}\u{1F1FC}\u{1F1FF}]|\u{1F1F8}[\u{1F1E6}-\u{1F1EA}\u{1F1EC}-\u{1F1F4}\u{1F1F7}-\u{1F1F9}\u{1F1FB}\u{1F1FD}-\u{1F1FF}]|\u{1F1F7}[\u{1F1EA}\u{1F1F4}\u{1F1F8}\u{1F1FA}\u{1F1FC}]|\u{1F1F5}[\u{1F1E6}\u{1F1EA}-\u{1F1ED}\u{1F1F0}-\u{1F1F3}\u{1F1F7}-\u{1F1F9}\u{1F1FC}\u{1F1FE}]|\u{1F1F3}[\u{1F1E6}\u{1F1E8}\u{1F1EA}-\u{1F1EC}\u{1F1EE}\u{1F1F1}\u{1F1F4}\u{1F1F5}\u{1F1F7}\u{1F1FA}\u{1F1FF}]|\u{1F1F2}[\u{1F1E6}\u{1F1E8}-\u{1F1ED}\u{1F1F0}-\u{1F1FF}]|\u{1F1F1}[\u{1F1E6}-\u{1F1E8}\u{1F1EE}\u{1F1F0}\u{1F1F7}-\u{1F1FB}\u{1F1FE}]|\u{1F1F0}[\u{1F1EA}\u{1F1EC}-\u{1F1EE}\u{1F1F2}\u{1F1F3}\u{1F1F5}\u{1F1F7}\u{1F1FC}\u{1F1FE}\u{1F1FF}]|\u{1F1EF}[\u{1F1EA}\u{1F1F2}\u{1F1F4}\u{1F1F5}]|\u{1F1EE}[\u{1F1E8}-\u{1F1EA}\u{1F1F1}-\u{1F1F4}\u{1F1F6}-\u{1F1F9}]|\u{1F1ED}[\u{1F1F0}\u{1F1F2}\u{1F1F3}\u{1F1F7}\u{1F1F9}\u{1F1FA}]|\u{1F1EC}[\u{1F1E6}\u{1F1E7}\u{1F1E9}-\u{1F1EE}\u{1F1F1}-\u{1F1F3}\u{1F1F5}-\u{1F1FA}\u{1F1FC}\u{1F1FE}]|\u{1F1EB}[\u{1F1EE}-\u{1F1F0}\u{1F1F2}\u{1F1F4}\u{1F1F7}]|\u{1F1EA}[\u{1F1E6}\u{1F1E8}\u{1F1EA}\u{1F1EC}\u{1F1ED}\u{1F1F7}-\u{1F1FA}]|\u{1F1E9}[\u{1F1EA}\u{1F1EC}\u{1F1EF}\u{1F1F0}\u{1F1F2}\u{1F1F4}\u{1F1FF}]|\u{1F1E8}[\u{1F1E6}\u{1F1E8}\u{1F1E9}\u{1F1EB}-\u{1F1EE}\u{1F1F0}-\u{1F1F5}\u{1F1F7}\u{1F1FA}-\u{1F1FF}]|\u{1F1E7}[\u{1F1E6}\u{1F1E7}\u{1F1E9}-\u{1F1EF}\u{1F1F1}-\u{1F1F4}\u{1F1F6}-\u{1F1F9}\u{1F1FB}\u{1F1FC}\u{1F1FE}\u{1F1FF}]|\u{1F1E6}[\u{1F1E8}-\u{1F1EC}\u{1F1EE}\u{1F1F1}\u{1F1F2}\u{1F1F4}\u{1F1F6}-\u{1F1FA}\u{1F1FC}\u{1F1FD}\u{1F1FF}]|[#\*0-9]\uFE0F\u20E3|\u2764\uFE0F|[\u{1F3C3}\u{1F3C4}\u{1F3CA}\u{1F46E}\u{1F470}\u{1F471}\u{1F473}\u{1F477}\u{1F481}\u{1F482}\u{1F486}\u{1F487}\u{1F645}-\u{1F647}\u{1F64B}\u{1F64D}\u{1F64E}\u{1F6A3}\u{1F6B4}-\u{1F6B6}\u{1F926}\u{1F935}\u{1F937}-\u{1F939}\u{1F93D}\u{1F93E}\u{1F9B8}\u{1F9B9}\u{1F9CD}-\u{1F9CF}\u{1F9D4}\u{1F9D6}-\u{1F9DD}][\u{1F3FB}-\u{1F3FF}]|[\u26F9\u{1F3CB}\u{1F3CC}\u{1F575}][\uFE0F\u{1F3FB}-\u{1F3FF}]|\u{1F3F4}|[\u270A\u270B\u{1F385}\u{1F3C2}\u{1F3C7}\u{1F442}\u{1F443}\u{1F446}-\u{1F450}\u{1F466}\u{1F467}\u{1F46B}-\u{1F46D}\u{1F472}\u{1F474}-\u{1F476}\u{1F478}\u{1F47C}\u{1F483}\u{1F485}\u{1F48F}\u{1F491}\u{1F4AA}\u{1F57A}\u{1F595}\u{1F596}\u{1F64C}\u{1F64F}\u{1F6C0}\u{1F6CC}\u{1F90C}\u{1F90F}\u{1F918}-\u{1F91C}\u{1F91E}\u{1F91F}\u{1F930}-\u{1F934}\u{1F936}\u{1F977}\u{1F9B5}\u{1F9B6}\u{1F9BB}\u{1F9D2}\u{1F9D3}\u{1F9D5}][\u{1F3FB}-\u{1F3FF}]|[\u261D\u270C\u270D\u{1F574}\u{1F590}][\uFE0F\u{1F3FB}-\u{1F3FF}]|[\u270A\u270B\u{1F385}\u{1F3C2}\u{1F3C7}\u{1F408}\u{1F415}\u{1F43B}\u{1F442}\u{1F443}\u{1F446}-\u{1F450}\u{1F466}\u{1F467}\u{1F46B}-\u{1F46D}\u{1F472}\u{1F474}-\u{1F476}\u{1F478}\u{1F47C}\u{1F483}\u{1F485}\u{1F48F}\u{1F491}\u{1F4AA}\u{1F57A}\u{1F595}\u{1F596}\u{1F62E}\u{1F635}\u{1F636}\u{1F64C}\u{1F64F}\u{1F6C0}\u{1F6CC}\u{1F90C}\u{1F90F}\u{1F918}-\u{1F91C}\u{1F91E}\u{1F91F}\u{1F930}-\u{1F934}\u{1F936}\u{1F977}\u{1F9B5}\u{1F9B6}\u{1F9BB}\u{1F9D2}\u{1F9D3}\u{1F9D5}]|[\u{1F3C3}\u{1F3C4}\u{1F3CA}\u{1F46E}\u{1F470}\u{1F471}\u{1F473}\u{1F477}\u{1F481}\u{1F482}\u{1F486}\u{1F487}\u{1F645}-\u{1F647}\u{1F64B}\u{1F64D}\u{1F64E}\u{1F6A3}\u{1F6B4}-\u{1F6B6}\u{1F926}\u{1F935}\u{1F937}-\u{1F939}\u{1F93D}\u{1F93E}\u{1F9B8}\u{1F9B9}\u{1F9CD}-\u{1F9CF}\u{1F9D4}\u{1F9D6}-\u{1F9DD}]|[\u{1F46F}\u{1F93C}\u{1F9DE}\u{1F9DF}]|[\u231A\u231B\u23E9-\u23EC\u23F0\u23F3\u25FD\u25FE\u2614\u2615\u2648-\u2653\u267F\u2693\u26A1\u26AA\u26AB\u26BD\u26BE\u26C4\u26C5\u26CE\u26D4\u26EA\u26F2\u26F3\u26F5\u26FA\u26FD\u2705\u2728\u274C\u274E\u2753-\u2755\u2757\u2795-\u2797\u27B0\u27BF\u2B1B\u2B1C\u2B50\u2B55\u{1F004}\u{1F0CF}\u{1F18E}\u{1F191}-\u{1F19A}\u{1F201}\u{1F21A}\u{1F22F}\u{1F232}-\u{1F236}\u{1F238}-\u{1F23A}\u{1F250}\u{1F251}\u{1F300}-\u{1F320}\u{1F32D}-\u{1F335}\u{1F337}-\u{1F37C}\u{1F37E}-\u{1F384}\u{1F386}-\u{1F393}\u{1F3A0}-\u{1F3C1}\u{1F3C5}\u{1F3C6}\u{1F3C8}\u{1F3C9}\u{1F3CF}-\u{1F3D3}\u{1F3E0}-\u{1F3F0}\u{1F3F8}-\u{1F407}\u{1F409}-\u{1F414}\u{1F416}-\u{1F43A}\u{1F43C}-\u{1F43E}\u{1F440}\u{1F444}\u{1F445}\u{1F451}-\u{1F465}\u{1F46A}\u{1F479}-\u{1F47B}\u{1F47D}-\u{1F480}\u{1F484}\u{1F488}-\u{1F48E}\u{1F490}\u{1F492}-\u{1F4A9}\u{1F4AB}-\u{1F4FC}\u{1F4FF}-\u{1F53D}\u{1F54B}-\u{1F54E}\u{1F550}-\u{1F567}\u{1F5A4}\u{1F5FB}-\u{1F62D}\u{1F62F}-\u{1F634}\u{1F637}-\u{1F644}\u{1F648}-\u{1F64A}\u{1F680}-\u{1F6A2}\u{1F6A4}-\u{1F6B3}\u{1F6B7}-\u{1F6BF}\u{1F6C1}-\u{1F6C5}\u{1F6D0}-\u{1F6D2}\u{1F6D5}-\u{1F6D7}\u{1F6EB}\u{1F6EC}\u{1F6F4}-\u{1F6FC}\u{1F7E0}-\u{1F7EB}\u{1F90D}\u{1F90E}\u{1F910}-\u{1F917}\u{1F91D}\u{1F920}-\u{1F925}\u{1F927}-\u{1F92F}\u{1F93A}\u{1F93F}-\u{1F945}\u{1F947}-\u{1F976}\u{1F978}\u{1F97A}-\u{1F9B4}\u{1F9B7}\u{1F9BA}\u{1F9BC}-\u{1F9CB}\u{1F9D0}\u{1F9E0}-\u{1F9FF}\u{1FA70}-\u{1FA74}\u{1FA78}-\u{1FA7A}\u{1FA80}-\u{1FA86}\u{1FA90}-\u{1FAA8}\u{1FAB0}-\u{1FAB6}\u{1FAC0}-\u{1FAC2}\u{1FAD0}-\u{1FAD6}]/gu;35:[{"id":"f278756d42c239674ac9d2562b6ad828a969fbbf31d73130c553727107ad5a852204b0be4ba7522e2c4392f90dc611616bf2527b45b7954263dbaf25c7448313","href":"https://static.observableusercontent.com/files/f278756d42c239674ac9d2562b6ad828a969fbbf31d73130c553727107ad5a852204b0be4ba7522e2c4392f90dc611616bf2527b45b7954263dbaf25c7448313","name":"twitter.json","type":"application/json","lastModified":1631135756398.376,"size":2362658},{"id":"48c45c637873a36181c40d7cdd7fc921b412e38092f98629a23767a924dd53b335bd6b8aefa33124c64099b2cc8e8080b44a900529cc2f5eed789d6ca7ffcc52","href":"https://static.observableusercontent.com/files/48c45c637873a36181c40d7cdd7fc921b412e38092f98629a23767a924dd53b335bd6b8aefa33124c64099b2cc8e8080b44a900529cc2f5eed789d6ca7ffcc52","name":"data pane.png","type":"image/png","lastModified":1631135786584.962,"size":63583}] 2e:{"id":"1d685101bb0ce36f","slug":"visualizing-twitter-data","title":"Visualizing Twitter data 🐦","thumbnail":"0362b79c5a656bcb465e9d8eda2ac8b52cde8b7983feb0796545097fb44e131b","access_level":"public","create_time":"$D2021-09-08T21:15:00.598Z","update_time":"$D2022-06-06T15:14:59.312Z","view_time":null,"first_public_time":"$D2021-09-08T21:29:09.193Z","fork":true,"stars":23,"starred":false,"owner":{"type":"team","id":"88f99d18d1aef515","login":"floatingpurr","name":"Andrea Mignone","avatar_url":"https://avatars-next.observableusercontent.com/3a51be34742b049fe39505055151eccd7f613bd00b2547203960fe5684ed9bab","tier":"starter_2024"},"version":3238,"publish_version":3238,"role":null,"authored":false,"authors":[{"type":"individual","id":"820f3b923b10f6c4","login":"floatingpurr","name":"Andrea Mignone","avatar_url":"https://avatars-next.observableusercontent.com/3a51be34742b049fe39505055151eccd7f613bd00b2547203960fe5684ed9bab","tier":null}],"members":[{"type":"individual","id":"820f3b923b10f6c4","login":"floatingpurr","name":"Andrea Mignone","avatar_url":"https://avatars-next.observableusercontent.com/3a51be34742b049fe39505055151eccd7f613bd00b2547203960fe5684ed9bab","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":true,"trashed":false,"subscribed":null,"forks":16,"collection":{"id":"774e96aab0688128","slug":"twitter-starter-pack","title":"Twitter Starter Pack","owner":{"id":"88f99d18d1aef515","login":"floatingpurr","name":"Andrea Mignone"}},"type":"notebook","body":{"title":"Visualizing Twitter data 🐦","cells":[{"id":0,"value":"# Visualizing Twitter data 🐦\n

[Twitter Starter Pack](https://observablehq.com/@floatingpurr/twitter-starter) > Connect the visualizations

\n\nThis notebook provides a few visualization examples focusing on data about a **Twitter account** and **related tweets**.\n\n> 💾 _Do you want to load your [own Twitter data](#load)?_\n>\n> 📚 Read the [documentation](https://observablehq.com/@floatingpurr/twitter-starter).\n>\n> 👉 this notebook makes an extensive use of **dates** and **times**. Type-in here below the timezone you want to use for visualizing dates and times.\n","pinned":false,"hidden":false,"mode":"md"},{"id":476,"value":"viewof timezone = Inputs.text({\n label: \"Timezone\",\n placeholder: \"Enter a timezone\",\n datalist: timezoneList,\n value: Intl.DateTimeFormat().resolvedOptions().timeZone, // get the system's IANA timezone of the client\n validate: (d) => timezoneList.includes(d.value),\n submit: \"Set 🕰 \"\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":2371,"value":"toc({\n headers: \"h2,h3\",\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":244,"value":"## 👤 Analyzing the user profile: _${profile.name}_\n

Data retrieved from Twitter on: ${d3.timeFormat('%Y-%m-%d h %H:%M')(convertTZ(twitter.data_timestamp))} (${timezone})

","pinned":false,"hidden":false,"mode":"md"},{"id":294,"value":"$31","pinned":false,"hidden":false,"mode":"md"},{"id":404,"value":"profile.pinned_tweet_id ? md`

📌 Show pinned tweet:

${tweet(profile.pinned_tweet_id)}

`: md`No pinned Tweet`","pinned":false,"hidden":false,"mode":"ojs"},{"id":240,"value":"## 📣 The tweet list (aka the Timeline)","pinned":false,"hidden":false,"mode":"md"},{"id":895,"value":"The following cells host visualizations about the tweet collection (aka the Timeline) of _${profile.name}_.\n\nIn this dataset, there are _${tweets.length}_ items, i.e., tweets (**T**) and retweets (**RT**), following [this data format](#format). Have a look:","pinned":false,"hidden":false,"mode":"md"},{"id":1643,"value":"viewof search = Inputs.search(tweets, {placeholder: \"Search Tweets...\"})","pinned":false,"hidden":false,"mode":"ojs"},{"id":10,"value":"viewof selectedTweet = Inputs.table(search, {\n multiple: false,\n columns: [\"type\", \"created_at\", \"text\", \"retweet_count\", \"reply_count\", \"like_count\", \"quote_count\", \"hashtags\", \"mentions\", \"emojis\"]\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":41,"value":"{ \n if (selectedTweet) {\n return tweet(selectedTweet.id);\n }\n\n return md`👆_Select a tweet from the table to display it!_`\n\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":507,"value":"## 🔁 Tweet-Retweet view","pinned":false,"hidden":false,"mode":"md"},{"id":2437,"value":"Retweet (**RT**) *vs.* Tweet (**T**) proportion:","pinned":false,"hidden":false,"mode":"md"},{"id":513,"value":"Plot.plot({\n marginLeft: 40,\n x: {\n percent: true\n },\n marks: [\n Plot.barX(tweets, Plot.stackX(Plot.groupZ({x: \"proportion\"}, {fill: \"type\"}))),\n Plot.text(tweets, Plot.stackX(Plot.groupZ({x: \"proportion\", text: \"first\"}, {z: \"type\", text: \"type\"}))),\n Plot.ruleX([0, 1])\n ]\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":2446,"value":"This is the time distribution of the items (**RT** + **T**):","pinned":false,"hidden":false,"mode":"md"},{"id":670,"value":"addTooltips(\n Plot.plot({\n grid: true,\n inset: 10,\n width: width,\n facet: {\n data: tweets,\n marginLeft: 40,\n },\n marks: [\n Plot.frame(),\n Plot.dot(tweets, {\n x: \"created_at\",\n fill: \"black\",\n fillOpacity: tweets.length < 50 ? 0.8 : .05,\n title: \"text\"\n })\n ]\n})\n )","pinned":false,"hidden":false,"mode":"ojs"},{"id":2454,"value":"Same distribution but separating **RT**s from **T**s:","pinned":false,"hidden":false,"mode":"md"},{"id":680,"value":"signals = addTooltips(\n Plot.plot({\n grid: true,\n inset: 10,\n width: width,\n facet: {\n data: tweets,\n y: \"type\",\n },\n marks: [\n Plot.frame(),\n Plot.dot(tweets, {\n x: \"created_at\",\n fill: \"type\",\n fillOpacity: tweets.length < 50 ? 0.8 : .05,\n title: \"text\"\n })\n ]\n})\n)","pinned":false,"hidden":false,"mode":"ojs"},{"id":703,"value":"## 🗓 Calendar view\n

Inspired by [this amazing Calendar View](https://observablehq.com/@d3/calendar-view)

","pinned":false,"hidden":false,"mode":"md"},{"id":2483,"value":"The following calendar view shows with an heatmap the daily activity of _${profile.name}_ on Twitter.","pinned":false,"hidden":false,"mode":"md"},{"id":1018,"value":"$32","pinned":false,"hidden":false,"mode":"ojs"},{"id":1126,"value":"key = legend({color, title: \"Activity per day\"})","pinned":false,"hidden":false,"mode":"ojs"},{"id":2632,"value":"#### 🕹 Tweak the calendar view","pinned":false,"hidden":false,"mode":"md"},{"id":882,"value":"viewof filterRadio = Inputs.radio([\"Tweets (T)\", \"Retweets (RT)\", \"Both\"], {value: \"Both\", label: \"Filter activity:\"})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1768,"value":"viewof scale = Inputs.radio(scales, {\n label: \"Color scale\", \n value: d3.scaleSequential,\n format: x => x.text,\n valueof: (v) => v.value\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1028,"value":"viewof weekday = Inputs.select(calendarViews, {\n label: \"Week type\", \n value: \"monday\",\n format: x => x.text,\n valueof: (v) => v.value\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":751,"value":"## 🕤 Time view","pinned":false,"hidden":false,"mode":"md"},{"id":2689,"value":"This heatmap exhibits the hourly activity per each weekday of _${profile.name}_ on Twitter.","pinned":false,"hidden":false,"mode":"md"},{"id":1795,"value":"$33","pinned":false,"hidden":false,"mode":"ojs"},{"id":2020,"value":"keyWeek = legend({color: colorWeek, title: \"Activity per hour\"})","pinned":false,"hidden":false,"mode":"ojs"},{"id":2694,"value":"#### 🕹 Tweak the time view","pinned":false,"hidden":false,"mode":"md"},{"id":2550,"value":"Inputs.bind(Inputs.text({\n label: \"Change Timezone\",\n placeholder: \"Enter a timezone\",\n datalist: timezoneList,\n value: Intl.DateTimeFormat().resolvedOptions().timeZone, // get the system's IANA timezone of the client\n validate: (d) => timezoneList.includes(d.value),\n submit: \"Set 🕰 \"\n}), viewof timezone)","pinned":false,"hidden":false,"mode":"ojs"},{"id":2544,"value":"Inputs.bind(Inputs.radio([\"Tweets (T)\", \"Retweets (RT)\", \"Both\"], {value: \"Both\", label: \"Filter activity:\"}), viewof filterRadio)","pinned":false,"hidden":false,"mode":"ojs"},{"id":2674,"value":"viewof scale2 = Inputs.radio(scales, {\n label: \"Color scale\", \n value: d3.scaleSequential,\n format: x => x.text,\n valueof: (v) => v.value\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":2678,"value":"Inputs.bind(Inputs.select(calendarViews, {\n label: \"Week type\", \n value: \"monday\",\n format: x => x.text,\n valueof: (v) => v.value\n}), viewof weekday)","pinned":false,"hidden":false,"mode":"ojs"},{"id":2063,"value":"## ＃ Hashtag view","pinned":false,"hidden":false,"mode":"md"},{"id":3088,"value":"Hashtags are the first-class tagging system of Twitter. The following **#barChart** (just joking 😅) represents their usage by _${profile.name}_.","pinned":false,"hidden":false,"mode":"md"},{"id":2986,"value":"Plot.plot(setPlot({values: hashtags, color: \"#5ab0d1\"}, {name: \"hashtags\", rotation: -45}, hashSlider))","pinned":false,"hidden":false,"mode":"ojs"},{"id":3054,"value":"#### 🕹 Tweak the hashtag view","pinned":false,"hidden":false,"mode":"md"},{"id":3013,"value":"viewof hashSlider = rangeSlider(setSlider(hashtags, \"hashtags\"))","pinned":false,"hidden":false,"mode":"ojs"},{"id":3050,"value":"Inputs.bind(Inputs.radio([\"Tweets (T)\", \"Retweets (RT)\", \"Both\"], {value: \"Both\", label: \"Filter activity:\"}), viewof filterRadio)","pinned":false,"hidden":false,"mode":"ojs"},{"id":2972,"value":"## 😎 Emoji view","pinned":false,"hidden":false,"mode":"md"},{"id":3095,"value":"🐱 🤌 💙 🤩 ！ How does _${profile.name}_ use emojis on Twitter? Check out the 📊:","pinned":false,"hidden":false,"mode":"md"},{"id":2926,"value":"Plot.plot(setPlot({values:emojis, color: \"#afe4b8\"}, {name: \"Emojis\", rotation: 0}, emojiSlider))","pinned":false,"hidden":false,"mode":"ojs"},{"id":2944,"value":"#### 🕹 Tweak the emoji view","pinned":false,"hidden":false,"mode":"md"},{"id":2826,"value":"viewof emojiSlider = rangeSlider(setSlider(emojis, \"emojis\"))","pinned":false,"hidden":false,"mode":"ojs"},{"id":2934,"value":"Inputs.bind(Inputs.radio([\"Tweets (T)\", \"Retweets (RT)\", \"Both\"], {value: \"Both\", label: \"Filter activity:\"}), viewof filterRadio)","pinned":false,"hidden":false,"mode":"ojs"},{"id":3061,"value":"## ＠ Mention view","pinned":false,"hidden":false,"mode":"md"},{"id":3108,"value":"And what about **@mentions**? Find here below how _${profile.name}_ interacts with other people on Twitter. \n\n> 👉 _Pssssst:_ mentions are affected also by replies and retweets (i.e., a reply to a user or a retweet of user's tweet counts as a mention)","pinned":false,"hidden":false,"mode":"md"},{"id":3072,"value":"Plot.plot(setPlot({values:mentions, color: \"#eb9c52\"}, {name: \"Mentions\", rotation: -45}, mentionSlider))","pinned":false,"hidden":false,"mode":"ojs"},{"id":3079,"value":"#### 🕹 Tweak the mention view","pinned":false,"hidden":false,"mode":"md"},{"id":3074,"value":"viewof mentionSlider = rangeSlider(setSlider(mentions, \"mentions\"))","pinned":false,"hidden":false,"mode":"ojs"},{"id":3082,"value":"Inputs.bind(Inputs.radio([\"Tweets (T)\", \"Retweets (RT)\", \"Both\"], {value: \"Both\", label: \"Filter activity:\"}), viewof filterRadio)","pinned":false,"hidden":false,"mode":"ojs"},{"id":2562,"value":"load = md`## ⬆️ Load your own data`","pinned":false,"hidden":false,"mode":"ojs"},{"id":2334,"value":"Do you want to explore a different Twitter account? You can upload other data! 🎉 \n\nJust get your Twitter data file [from this notebook](https://observablehq.com/@floatingpurr/twitter-api), then upload it here below!","pinned":false,"hidden":false,"mode":"md"},{"id":2321,"value":"// Load the data (e.g., a .csv file)\nviewof rawdata = dataInput({\n initialValue: await FileAttachment(\"twitter.json\").json()\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":3191,"value":"⚠️ The button above triggers a convenient mechanism to load new data. **Such data are not preserved upon forks**. If you want to **fork this notebook with your data, replace the data file references with the data pane on the right, and then fork this notebook**.","pinned":false,"hidden":false,"mode":"md"},{"id":3205,"value":"html`

\n ${await FileAttachment(\"data pane.png\").image()}\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":2490,"value":"## Implementation and further information","pinned":false,"hidden":false,"mode":"md"},{"id":2495,"value":"Other details about this notebook.","pinned":false,"hidden":false,"mode":"md"},{"id":2526,"value":"format = md`### More about the tweet data`","pinned":false,"hidden":false,"mode":"ojs"},{"id":2377,"value":"Each tweet (or item) is an Object with the following keys:\n\n- `id`: the item identifier in Twitter\n- `type`: the inferred item type, ie. Tweet (T) or Retweet (RT)\n- `created_at`: the creation date and time of the item in a given [timezone](#timezone)\n- `text`: the tweet text\n- `retweet_count`: number of times the item has been retweeted\n- `reply_count`: number of replies of this item\n- `like_count`: number of likes of this item\n- `quote_count`: number of times this item has been Retweeted with a comment (also known as Quote).\n- `hashtags`: nullable list of #hashtags detected in the tweet\n- `mentions`: nullable list of @mentions detected in the tweet\n- `emojis`: nullable list of emojis detected in the tweet\n\nNote: Retweets do not have metrics about replies, likes or quotes. Probably, this happens because such insights are related to the original Tweet. \n\nSee also the [Twitter doc](https://developer.twitter.com/en/docs/twitter-api/tweets/timelines/api-reference/get-users-by-username-username-tweets).","pinned":false,"hidden":false,"mode":"md"},{"id":231,"value":"### Data processing","pinned":false,"hidden":false,"mode":"md"},{"id":3,"value":"twitter = rawdata","pinned":false,"hidden":false,"mode":"ojs"},{"id":12,"value":"// Parse profile date\ntwitter.profile.created_at = new Date(twitter.profile.created_at)","pinned":true,"hidden":false,"mode":"ojs"},{"id":296,"value":"profile = twitter.profile","pinned":false,"hidden":false,"mode":"ojs"},{"id":14,"value":"tweets = twitter.tweets.map((d, i) => ({\n id: d.id,\n type: classifyTweet(d),\n created_at: convertTZ(d.created_at),\n text: d.text,\n retweet_count: d.public_metrics.retweet_count,\n reply_count: d.public_metrics.reply_count,\n like_count: d.public_metrics.like_count,\n quote_count: d.public_metrics.quote_count,\n hashtags: getEntities(d, 'hashtags'),\n mentions: getEntities(d, 'mentions'),\n emojis: d.text.match(emojiRegex)\n}))","pinned":false,"hidden":false,"mode":"ojs"},{"id":880,"value":"data = tweets.filter((d) => {\n return filterRadio === 'Tweets (T)' ? d.type === 'T'\n : filterRadio === 'Retweets (RT)' ? d.type === 'RT'\n : true;\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":2568,"value":"### Calendar view","pinned":false,"hidden":false,"mode":"md"},{"id":1037,"value":"color = {\n //const max = d3.quantile(years, 0.80, ([,values]) => values[0][1].length);\n const max = d3.max(years, v => d3.max(v[1], d => d.value))\n return scale(d3.interpolateGreens).domain([0, max]);\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1428,"value":"dateReducer = (d) => {\n // group tweets by date\n const groups = d3.groups(d, v => new Date(d3.timeFormat('%Y-%m-%d')(v.created_at.getTime()))).reverse();\n \n // count tweets per date\n return groups.map(([date,tweets]) => ({date: date, value: tweets.length}));\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":927,"value":"years = d3.rollups(data, dateReducer, d => d.created_at.getFullYear()).reverse()","pinned":false,"hidden":false,"mode":"ojs"},{"id":1073,"value":"years_details = d3.groups(data, d => d.created_at.getFullYear(), d => new Date(d3.timeFormat('%Y-%m-%d')(d.created_at.getTime()))).reverse()","pinned":false,"hidden":false,"mode":"ojs"},{"id":1766,"value":"scales = [{value: d3.scaleSequential, text:\"Linear\"}, {value:d3.scaleSequentialSqrt, text:\"Sqrt\"}]","pinned":false,"hidden":false,"mode":"ojs"},{"id":1024,"value":"height = cellSize * (weekday === \"weekday\" ? 7 : 9)","pinned":false,"hidden":false,"mode":"ojs"},{"id":1031,"value":"countDay = weekday === \"sunday\" ? i => i : i => (i + 6) % 7","pinned":false,"hidden":false,"mode":"ojs"},{"id":1033,"value":"formatDay = i => \"SMTWTFS\"[i]","pinned":false,"hidden":false,"mode":"ojs"},{"id":1035,"value":"timeWeek = weekday === \"sunday\" ? d3.timeSunday : d3.timeMonday","pinned":false,"hidden":false,"mode":"ojs"},{"id":1050,"value":"function pathMonth(t) {\n const n = weekday === \"weekday\" ? 5 : 7;\n const d = Math.max(0, Math.min(n, countDay(t.getDay())));\n const w = timeWeek.count(d3.timeYear(t), t);\n return `${d === 0 ? `M${w * cellSize},0`\n : d === n ? `M${(w + 1) * cellSize},0`\n : `M${(w + 1) * cellSize},0V${d * cellSize}H${w * cellSize}`}V${n * cellSize}`;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1053,"value":"formatMonth = d3.timeFormat(\"%b\")","pinned":false,"hidden":false,"mode":"ojs"},{"id":1716,"value":"calendarViews = [\n {value: \"weekday\", text: \"Weekdays only\"},\n {value: \"sunday\", text: \"Sunday-based weeks\"},\n {value: \"monday\", text: \"Monday-based weeks\"}\n]","pinned":false,"hidden":false,"mode":"ojs"},{"id":2599,"value":"#### Cosmetic cell(s)","pinned":false,"hidden":false,"mode":"md"},{"id":1021,"value":"cellSize = 15","pinned":false,"hidden":false,"mode":"ojs"},{"id":2595,"value":"### Time view","pinned":false,"hidden":false,"mode":"md"},{"id":2672,"value":"heightTime = cellSizeTime * (weekday === \"weekday\" ? 7 : 9)","pinned":false,"hidden":false,"mode":"ojs"},{"id":1798,"value":"weekDaysTweets = d3.rollups(\n data, \n d => d3.groups(d, v => v.created_at.getHours()),\n d => countDay(d.created_at.getDay())\n)","pinned":false,"hidden":false,"mode":"ojs"},{"id":1903,"value":"weekDays = d3.flatRollup(data, v => v.length, d => d.created_at.getDay(), d => d.created_at.getHours())","pinned":false,"hidden":false,"mode":"ojs"},{"id":2022,"value":"colorWeek = {\n //const max = d3.quantile(years, 0.80, ([,values]) => values[0][1].length);\n const max = d3.max(weekDays, d => d[2])\n return scale2(d3.interpolateBlues).domain([0, max]);\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":2664,"value":"#### Cosmetic cell(s)","pinned":false,"hidden":false,"mode":"md"},{"id":2666,"value":"cellSizeTime = 20","pinned":false,"hidden":false,"mode":"ojs"},{"id":2791,"value":"### Bar charts","pinned":false,"hidden":false,"mode":"md"},{"id":2207,"value":"getBars = (items) => {\n const bars = data.reduce(function (acc, d) {\n\n if (d[items]) {\n d[items].forEach(v => {\n const item = acc.find(t => t.item === v);\n item ? (++item.value && item.tweets.push(d)) : acc.push({item: v, value: 1, tweets:[d]});\n }\n );\n }\n\n return acc\n }, []);\n\n return bars.sort((a,b) => b.value - a.value)\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":2939,"value":"setPlot = (data, label, controller) => ({\n width: width,\n marginBottom: 100,\n x: {\n domain: d3.sort(data.values, d => -d.value).map(d => d.item).slice(controller[0] - 1, controller[1]),\n label: `${label.name} of ${profile.name}`,\n tickRotate: label.rotation\n },\n y: {\n grid: true\n },\n marks: [\n Plot.barY(data.values, {x: \"item\", y: \"value\", fill: data.color, title: d => `${d.item}: ${d.value}`}),\n Plot.ruleY([0]),\n ]\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":2954,"value":"setSlider = (data, label) => ({\n min: 1,\n max: data.length,\n step: 1,\n // Note that values must be specified as array of length 2.\n value: [1, data.length > 20 ? 20 : data.length],\n title: `Explore ${label}`,\n //description: `${label} horizontal scrolling`,\n display: d => md`${label} from **${ordinal(d[0])}** to **${ordinal(d[1])}**`\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":2937,"value":"emojis = getBars(\"emojis\")","pinned":false,"hidden":false,"mode":"ojs"},{"id":2955,"value":"mentions = getBars(\"mentions\")","pinned":false,"hidden":false,"mode":"ojs"},{"id":2961,"value":"hashtags = getBars(\"hashtags\")","pinned":false,"hidden":false,"mode":"ojs"},{"id":16,"value":"### Helpers and other stuff","pinned":false,"hidden":false,"mode":"md"},{"id":20,"value":"$34","pinned":false,"hidden":false,"mode":"ojs"},{"id":23,"value":"'🔥 🔥 hello! fffℹ️ test👨‍👩‍👦'.match(emojiRegex) // test","pinned":true,"hidden":false,"mode":"ojs"},{"id":72,"value":"classifyTweet = (tweet) => {\n return tweet.text.startsWith(\"RT @\") ? 'RT' : 'T';\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":100,"value":"getEntities = (tweet, entityType) => {\n // get #hashtags and @mentions from a tweet\n \n const entityName = (entityType === 'mentions') ? 'username'\n : (entityType === 'hashtags') ? 'tag'\n : null; // we should never get here\n\n const entities = _.get(tweet, `entities.${entityType}`)\n \n return entities ? entities.map((d) => d[entityName]) : null;\n\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":432,"value":"numberFormatter = Intl.NumberFormat('en-EN', { maximumFractionDigits: 1,notation: \"compact\" , compactDisplay: \"short\"});","pinned":false,"hidden":false,"mode":"ojs"},{"id":465,"value":"timezoneList = mtz.tz.names()","pinned":false,"hidden":false,"mode":"ojs"},{"id":950,"value":"convertTZ = (date) => {\n return new Date((typeof date === \"string\" ? new Date(date) : date).toLocaleString(\"en-US\", {timeZone: timezone})); \n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":2967,"value":"ordinal = (n) => `${n}${[\"st\",\"nd\",\"rd\"][((n+90)%100-10)%10-1]||\"th\"}`","pinned":true,"hidden":false,"mode":"ojs"},{"id":96,"value":"## Appendix","pinned":false,"hidden":false,"mode":"md"},{"id":37,"value":"import {tweet} from \"@mbostock/tweet\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":463,"value":"mtz = require('https://bundle.run/moment-timezone@0.5.33')","pinned":false,"hidden":false,"mode":"ojs"},{"id":154,"value":"require('lodash@4.17.21/lodash.js')","pinned":false,"hidden":false,"mode":"ojs"},{"id":673,"value":"import {addTooltips} from \"@mkfreeman/plot-tooltip\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":2323,"value":"import {dataInput} from \"@john-guerra/data-input\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":2373,"value":"import {toc} from \"@nebrius/indented-toc\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":1129,"value":"import {legend} from \"@d3/color-legend\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":2823,"value":"import {rangeSlider} from '@mootari/range-slider'","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W35","stdlib":"1","titling":"auto"}} 2f:"$2e:body"