36:["$","title",null,{"children":"data analysis of messages | Melanie Sawyer | Observable"}] 3e:T46b,chart = { const svg = d3.create("svg") .style("font", "10px sans-serif") .attr("height", 900) .attr("width", 1000); svg.append("g") .attr("transform", `translate(75, -21)`) .call(d3.axisLeft(y).tickSize(0)) .call(g => g.select(".domain").remove()); svg.append("g") .attr("transform", "translate(80,780)") .append(() => legend({ color: customScale, title: "Frequency of love", })) const row = svg.append("g") svg.call(myTip); var rect = row.selectAll("rect") .data(myData) .join("rect") .attr("x", (d, i) => 80 + (i%34)*20) .attr("y", (d, i) => 80 + 20*Math.floor(i/34)) .attr("width", 17) .attr("height", 17) .attr("fill", function(d, i) { // laziness pt 2 and weird math to make tooltip text readable d.color = d3.interpolateYlGnBu(0.8*(d.count/11.0)) return d3.interpolateYlGnBu(d.count/11.0 + 0.4);} ) .attr("class", "rect") .on('mouseover', myTip.show) .on('mouseout', myTip.hide); return svg.node(); }3f:[{"id":"4184c9288f5d412f987bb672f64f5a07286d4665e75f6eb4108e96403e432eae041454d005c3f3fa03aa69a75a1ca8eee2bb6de73a622499db28b2a2a1d296c8","href":"https://static.observableusercontent.com/files/4184c9288f5d412f987bb672f64f5a07286d4665e75f6eb4108e96403e432eae041454d005c3f3fa03aa69a75a1ca8eee2bb6de73a622499db28b2a2a1d296c8","name":"data.csv","type":"text/csv","lastModified":1586570137512.338,"size":1595386}] 3a:{"id":"ad1c3a18296abf43","slug":"untitled/2","title":"data analysis of messages","thumbnail":"99e00cabbe765b8708a314838d46357729610b990ea74ed984aab7d3b18103b5","access_level":"public","create_time":"$D2020-04-10T21:48:27.676Z","update_time":"$D2020-04-11T04:17:18.282Z","view_time":null,"first_public_time":"$D2020-04-10T22:04:04.989Z","has_unpublished_edits":null,"fork":false,"stars":0,"starred":false,"owner":{"type":"team","id":"bc4b58d197c6bbb8","login":"soybean","name":"Melanie Sawyer","avatar_url":"https://avatars-next.observableusercontent.com/9cbb56a4e267b39600d9f0f0d8fb031248c3587433f3e3faab74b228fb5c912f","tier":"starter_2024","bio":"Columbia '20 // hackNY '17","followed_by_you":false,"follows_you":false},"version":509,"publish_version":509,"role":null,"authored":false,"authors":[{"type":"individual","id":"8f1fc3cb698f8688","login":"soybean","name":"Melanie Sawyer","avatar_url":"https://avatars-next.observableusercontent.com/9cbb56a4e267b39600d9f0f0d8fb031248c3587433f3e3faab74b228fb5c912f","tier":null,"bio":"Columbia '20 // hackNY '17","followed_by_you":false,"follows_you":false}],"members":[{"type":"individual","id":"8f1fc3cb698f8688","login":"soybean","name":"Melanie Sawyer","avatar_url":"https://avatars-next.observableusercontent.com/9cbb56a4e267b39600d9f0f0d8fb031248c3587433f3e3faab74b228fb5c912f","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":1,"collection":null,"type":"notebook","body":{"titling":"auto","title":"data analysis of messages","cells":[{"id":0,"value":"md`# data analysis of messages\n###### used pandas to scrape and clean messages`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":104,"value":"md`brainstorming & experimentation`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":100,"value":"md`## Word frequency, normal squares`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":19,"value":"$3e","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":323,"value":"// Adapted from \"@mbostock/color-ramp\"\nfunction ramp(color, numscale, n = 512) {\n const canvas = DOM.canvas(n, 1);\n const context = canvas.getContext(\"2d\"),\n w = width + 28;\n canvas.style.margin = \"0 -14px\";\n canvas.style.width = `${w}px`;\n canvas.style.height = \"40px\";\n canvas.style.imageRendering = \"pixelated\";\n\n // companion numerical scale, to define the axis.\n if (numscale === undefined) numscale = d3.scaleLinear();\n if (color.domain) numscale.domain(color.domain());\n numscale.range([0, n]);\n const t = color.ticks ? color.ticks(n) : d3.range(n).map(i => i / (n - 1));\n\n for (let i = 0; i < t.length; ++i) {\n context.fillStyle = color(t[i]);\n context.fillRect((i * n) / t.length, 0, 100, 1);\n }\n\n d3.select(canvas).on(\"mousemove click\", function() {\n const t = numscale.invert((d3.mouse(this)[0] / w) * n);\n canvas.value = t;\n canvas.dispatchEvent(new CustomEvent(\"input\"));\n });\n canvas.value = 0;\n\n return canvas;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":321,"value":"viewof t0 = ramp(customScale)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":317,"value":"customScale = d3.scaleSequential(t => d3.interpolateYlGnBu(t+ 0.4).toString()).domain([0, 12])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":193,"value":"y = d3.scaleBand()\n .domain([2017, 2018, 2019, 2020])\n .range([0, 880])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":9,"value":"myData = {\n const data = d3.csvParse(await FileAttachment(\"data.csv\").text(), d3.autoType);\n // i'm sooo lazy\n const data2 = data.slice(21,1211)\n return data2;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":228,"value":"myTip = d3tip().attr('class', 'd3-tip').style('font-size', '10px').offset([-10, 0]).html(function(d) { return d.date + \"
\" + '

' + d.count+'

'; });\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":243,"value":"html`\n