2b:null 2c:["$","title",null,{"children":"NeurIPS Tweet network | John Alexis Guerra Gómez | Observable"}] 31:Tea6,force = { const context = DOM.context2d(width, height); const drawNode = (n) => { // context.fillStyle = c(n.cluster); context.moveTo(n.x+n.r, n.y+n.r); context.arc(n.x, n.y, n.r, 0, 2 * Math.PI); if (n.favorite_count>40) context.fillText(n.user.screen_name, n.x + 7, n.y + 2); }; simulationNodes .forEach(t => t.show = false); const filteredNodes = simulationNodes .filter(t => t.user.followers_count>=minFollowers) .filter(t => t.retweet_count>=minRts); filteredNodes .forEach(t => { t.show = true; t.r = rS(t.favorite_count); }); const nestedNodes = nest.entries(filteredNodes) .sort( (a,b) => d3.descending(a.value.total,b.value.total)); const c = d3.scaleOrdinal(d3.schemeCategory10); const filteredLinks = simulationLinks .filter( l => l.source.show && l.target.show) // .filter(l => l.source.user.followers_count>=minFollowers || l.target.user.followers_count>=minFollowers) // .filter(l => l.target.retweet_count> minRts); // filteredLinks.forEach( l => { // l.source.show=true; // l.target.show=true; // }); const simulation = d3.forceSimulation(filteredNodes) .force("collide", d3.forceCollide(n => n.r+1).iterations(4)) .force("x", xAsTime ? d3.forceX(d => x(d.date)).strength(xStrength) : d3.forceX(width/2).strength(centerStrength)) .force("y", yAsFaves ? d3.forceY(d => y(d.favorite_count)).strength(yStrength) : d3.forceY(height/2).strength(centerStrength)) .force("charge", d3.forceManyBody().strength(-1*charge)) .force("links", d3.forceLink(filteredLinks).id(d=> d.id) .distance(linkDistance) .strength(linkStrength)) .on("tick", ticked); function ticked() { context.clearRect(0, 0, width, height); // draw links if (simulation.alpha() < 0.5) { context.beginPath(); context.lineWidth= 1.5; context.strokeStyle = "#ddd"; for (const link of filteredLinks) { context.moveTo(link.source.x, link.source.y); context.lineTo(link.target.x, link.target.y); } context.stroke(); } for (const [i,user] of nestedNodes.entries()) { context.beginPath(); context.fillStyle = i { // // mutable selectedTweet = simulation.find(d3.event.x, d3.event.y) // const coords = d3.mouse(context.canvas); // console.log(coords, d3.event.y); // }) .on("click", t => { const coords = d3.mouse(context.canvas); mutable selectedTweet = simulation.find(coords[0], coords[1]) console.log(d3.event.x); }) } try { yield context.canvas; yield invalidation; } finally { simulation.stop(); } }32:T92e,intro = md` ### Params values: * Charge = 1 * linkDistance = 2 * linkStrength = 0.1 * centerStrength = 0.1 * xStrength = 0.3 * yStrength = 0.1 * x Axis as time * y Axis as favorite count ### Filters * minRts = 10 * minFollowers = 10 * numDays = 4 `33:[] 2f:{"id":"dd044fe6cd98aaa0","slug":"neurips-tweet-network","title":"NeurIPS Tweet network","thumbnail":"73074fcbc59097285457bdf4e5decd478b764dd1751c8d5992ff894888ad15a3","access_level":"public","create_time":"$D2018-12-05T22:41:21.658Z","update_time":"$D2018-12-05T22:48:02.466Z","view_time":null,"first_public_time":"$D2018-12-05T22:48:26.321Z","fork":{"id":"64bd551d568c7a19","slug":"ieeevis-tweets/2","title":"IEEEVIS Tweets network","owner":{"id":"cd3c1e49fc84d010","login":"john-guerra","name":"John Alexis Guerra Gómez"}},"stars":0,"starred":false,"owner":{"type":"team","id":"cd3c1e49fc84d010","login":"john-guerra","name":"John Alexis Guerra Gómez","avatar_url":"https://avatars-next.observableusercontent.com/21638cee44bb0ea70798da725b57111a5d3e2acebcd14524565992f7d1594aed","tier":"starter_2024"},"version":1501,"publish_version":1501,"role":null,"authored":false,"authors":[{"type":"individual","id":"be0076fec73aa550","login":"john-guerra","name":"John Alexis Guerra Gómez","avatar_url":"https://avatars-next.observableusercontent.com/21638cee44bb0ea70798da725b57111a5d3e2acebcd14524565992f7d1594aed","tier":null}],"members":[{"type":"individual","id":"be0076fec73aa550","login":"john-guerra","name":"John Alexis Guerra Gómez","avatar_url":"https://avatars-next.observableusercontent.com/21638cee44bb0ea70798da725b57111a5d3e2acebcd14524565992f7d1594aed","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"title":"NeurIPS Tweet network","cells":[{"id":1416,"value":"md`# NeurIPS Tweet network`\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1387,"value":"introText = md`\n\n**This observable uses a smaller version of the dataset that loads faster, if you want to play with all the tweets check the [original version](https://beta.observablehq.com/@john-guerra/ieeevis-tweets/)**\n\nHere are ${nodes.length} tweets collected from ${x.domain()[0]} until ${x.domain()[1]}\n\nEach dot is a tweet, there are links for reweets, quotes and replies (haven't figured out favorites yet). Circle area is the favorite count. Color shows the users with most favorites overall. Check the controls below to manipulate parameters.\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1016,"value":"timeAxis = {\n const svg = d3.select(DOM.svg(width,50));\n svg.append(\"g\")\n .call(d3.axisTop(x))\n .attr(\"transform\", \"translate(0,30)\");\n return svg.node();\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":2,"value":"$31","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":0,"value":"$32","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1130,"value":"mutable selectedTweet = null","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1146,"value":"showTweet = tweet(selectedTweet ? selectedTweet.id_str : nodes[0].id_str)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":841,"value":"// viewof xAsTime = html``\nxAsTime = Generators.input(intro.querySelector(\"#chxAsTime\"))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1255,"value":"// viewof yAsFaves = html``\nyAsFaves = Generators.input(intro.querySelector(\"#chyAsFaves\"))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":751,"value":"// viewof minRts = html``\nminRts = Generators.input(intro.querySelector(\"#slminRts\"))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1102,"value":"// viewof minFollowers = html``\nminFollowers = Generators.input(intro.querySelector(\"#slminFollowers\"))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":302,"value":"charge = Generators.input(intro.querySelector(\"#slCharge\"))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":305,"value":"// viewof linkDistance = html``\nlinkDistance = Generators.input(intro.querySelector(\"#sllinkDistance\"))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":321,"value":"// viewof linkStrength = html``\nlinkStrength = Generators.input(intro.querySelector(\"#sllinkStrength\"))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":330,"value":"// viewof centerStrength = html``\ncenterStrength = Generators.input(intro.querySelector(\"#slcenterStrength\"))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":805,"value":"// viewof xStrength = html``\nxStrength = Generators.input(intro.querySelector(\"#slxStrength\"))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1396,"value":"yStrength = Generators.input(intro.querySelector(\"#slyStrength\"))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":810,"value":"// viewof numDays = html``\nnumDays = Generators.input(intro.querySelector(\"#slnumDays\"))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":757,"value":"x = d3.scaleTime()\n .domain([d3.max(nodes, d=> d.date)-1000*3600*24*numDays , d3.max(nodes, d=> d.date)])\n .range([0, width])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1247,"value":"// y = d3.scaleBand()\n// .domain(nestedNodes.map(d=>d.user.screen_name))\n// .range([0, height])\ny = d3.scaleSqrt()\n .domain(d3.extent(simulationNodes, d => d.favorite_count))\n .range([height-100, -100])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1271,"value":"y.domain()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1251,"value":"maxTop = 8","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":793,"value":"rS = d3.scalePow().exponent(0.5)\n .domain([\n d3.min(nodes, d=> d.favorite_count || 0) , \n d3.max(nodes, d=> d.favorite_count || 0) ])\n .range([1, 7])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":282,"value":"// For computing from the tweets\n// nodes = tweets.map(n => {\n// n.date = new Date(n.created_at);\n// return n;\n// })\nnodes = tweets.nodes.map(n => {\n n.date = new Date(n.created_at);\n return n;\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":279,"value":"// links = d3.range(500).map(() => ({\n// source:Math.floor(Math.random()*nodes.length), \n// target:Math.floor(Math.random()*nodes.length)\n// }))\n// links = graph.links.map( l => { return {source:+l.source, target:+l.target}})\n// links = {\n// let links=[];\n \n// links = nodes.filter( t=> t.retweeted_status).map(t => ({\n// target:t.retweeted_status.id,\n// target_id:t.retweeted_status.id,\n// source:t.id,\n// type: \"retweet\"\n// }));\n \n// links = links.concat(nodes.filter(t=> t.in_reply_to_status_id).map(t=> ( {\n// source:t.id,\n// target:t.in_reply_to_status_id,\n// target_id:t.in_reply_to_status_id,\n// type: \"reply\"\n// }))); \n \n// links = links.concat(nodes.filter(t=> t. quoted_status).map(t=> ( {\n// source:t.id,\n// target:t.quoted_status.id,\n// target_id: t.quoted_status.id,\n// type: \"quote\"\n// }))); \n\n// return links;\n// }\nlinks = tweets.links","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":653,"value":"simulationLinks = links.map( l=> { return {\n source:dNodes[l.source], \n target:dNodes[l.target],\n type:l.type\n} }).filter(l=> l.source && l.target) ","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":658,"value":"// simulationNodes= nodes.map(clone)\nsimulationNodes= nodes","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":769,"value":"dNodes = {\n const dNodes = {};\n simulationNodes.forEach( n => {\n n.retweeted_status && (dNodes[n.retweeted_status.id]=n.retweeted_status);\n n.quoted_status && (dNodes[n.quoted_status.id]=n.quoted_status);\n });\n \n simulationNodes.forEach( n => {\n dNodes[n.id]=n;\n }); \n \n return dNodes;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":266,"value":"d3 = require(\"d3\", \"https://rawgit.com/john-guerra/b484776070920239d6acea09682de0f8/raw/192a59258a8dae54798b8b832dce63db8f15e3a5/forceInABox.js\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":269,"value":"height=800","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1492,"value":"width=900","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1168,"value":"import {tweet} from \"@mbostock/tweet\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1213,"value":"nest = d3.nest()\n .key(t=> t.user.screen_name)\n .rollup(function(v) { return {\n count: v.length,\n total: d3.sum(v, function(d) { return d.favorite_count; }),\n avg: d3.mean(v, function(d) { return d.favorite_count; }),\n values: v\n }; })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":294,"value":"// These are the full tweets:\n// tweets = d3.json(\"https://gist.githubusercontent.com/john-guerra/cfa5e6df8fa5edcbccdc9d2ff7594641/raw/514aa9de9725f5eb52a7ea95a35547c665100569/ieeevis2018Tweets.json\")\ntweets = d3.json(\"https://gist.githubusercontent.com/john-guerra/e2b5d1af9eb06ca33dd1f393d98b7dc1/raw/34ea7a574c45e41456710489dd923e7d7a14304c/NeurIPS_rt_network.json\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1430,"value":"x.domain()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"}],"files":"$W33","stdlib":"1","titling":"auto"}} 30:"$2f:body"