2d:null 2e:["$","title",null,{"children":"Average Nodes and Edges Per Year | Maeve Kane | Observable"}] 33:T471,scatter = { const svg = d3.create("svg").attr("viewBox", [0, 0, width, height]); svg.append("g").call(scatterxAxis).attr("class", "x-axis"); svg.append("g").call(scatteryAxis).attr("class", "y-axis"); const circles = svg .append("g") .selectAll("circle") .data(data) .join("circle") .style("fill", "rgba(0, 0, 0, 0)") .style("stroke", denomcolor) .style("stroke-width", 2) .attr("cx", (d) => scatterx(d["av_edges"])) .attr("cy", (d) => scattery(d["av_nodes"])) .attr("r", 4) .on("mouseover", (event, d) => tooltip_in(event, d)) .on("mouseout", tooltip_out); // const tooltip = svg.append("div").call(createScatterTooltip); // circles // .on("mouseover", function (d) { // d3.select(this).select("circle").attr("fill", denomcolor); // // tooltip.style("opacity", 1).html(getScatterTooltipContent(d)); // }) // .on("mouseleave", function (d) { // d3.select(this).select("circle").attr("fill", "rgba(0, 0, 0, 0)"); // // tooltip.style("opacity", 0); // }); svg.call(scatteryTitle); svg.call(scatterxTitle); return svg.node(); }34:[] 31:{"id":"b1c7622d392fbce1","slug":"average-nodes-and-edges-per-year","title":"Average Nodes and Edges Per Year","thumbnail":"58dc47bf2709f5b3c184a6e2165c76f775002e8205487a71e4de95243e9782ad","access_level":"public","create_time":"$D2023-02-22T16:00:34.539Z","update_time":"$D2023-02-26T18:29:24.916Z","view_time":null,"first_public_time":"$D2023-02-22T16:00:34.539Z","has_unpublished_edits":null,"fork":false,"stars":0,"starred":false,"owner":{"type":"team","id":"aa9e7a8a29012c93","login":"mkane2","name":"Maeve Kane","avatar_url":"https://avatars-next.observableusercontent.com/10f27e44a96d5e36afe9f72cf1af8b5efa3b0f668929d6850e6e7d05867b630c","tier":"starter_2024"},"version":72,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"c33c0c6945323f32","login":"mkane2","name":"Maeve Kane","avatar_url":"https://avatars-next.observableusercontent.com/10f27e44a96d5e36afe9f72cf1af8b5efa3b0f668929d6850e6e7d05867b630c","tier":null}],"members":[{"type":"individual","id":"c33c0c6945323f32","login":"mkane2","name":"Maeve Kane","avatar_url":"https://avatars-next.observableusercontent.com/10f27e44a96d5e36afe9f72cf1af8b5efa3b0f668929d6850e6e7d05867b630c","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"title":"Average Nodes and Edges Per Year","cells":[{"id":0,"value":"# Average Nodes and Edges Per Year","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":5,"value":"$33","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":65,"value":"scatterlegend = Swatches(\n d3.scaleOrdinal(\n alldenom,\n d3.quantize(d3.interpolateRainbow, alldenom.length + 1)\n )\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":7,"value":"scatterx = d3.scaleLinear()\n .domain(d3.extent(data, d => d[\"av_edges\"])).nice()\n .range([margin.left, width - margin.right])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":9,"value":"scatterxAxis = g => g\n .attr(\"transform\", `translate(0,${height - margin.bottom})`)\n .call(d3.axisBottom(scatterx))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":11,"value":"scattery = d3\n .scaleLinear()\n .domain(d3.extent(data, (d) => d[\"av_nodes\"]))\n .nice()\n .range([height - margin.bottom, margin.top])","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":13,"value":"scatteryAxis = (g) =>\n g.attr(\"transform\", `translate(${margin.left},0)`).call(d3.axisLeft(scattery))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":15,"value":"scatteryTitle = (g) =>\n g\n .append(\"text\")\n .attr(\"font-family\", \"sans-serif\")\n .attr(\"font-size\", 10)\n .attr(\"y\", 10)\n .text(\"↑ Nodes\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":17,"value":"scatterxTitle = (g) =>\n g\n .append(\"text\")\n .attr(\"font-family\", \"sans-serif\")\n .attr(\"font-size\", 10)\n .attr(\"y\", height)\n .attr(\"x\", width - margin.right - 20)\n .text(\"→ Edges\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":19,"value":"// getScatterTooltipContent = function (d) {\n// return `${(d) => d.congregation}\n//
\n// ${(d) => d.denomination}\n//
\n// ${formatDate(d.start)} - ${formatDate(d.end)}\n// `;\n// }","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":21,"value":"// createScatterTooltip = function (el) {\n// el.style(\"position\", \"absolute\")\n// .style(\"pointer-events\", \"none\")\n// .style(\"top\", 0)\n// .style(\"opacity\", 0)\n// .style(\"background\", \"white\")\n// .style(\"border-radius\", \"5px\")\n// .style(\"box-shadow\", \"0 0 10px rgba(0,0,0,.25)\")\n// .style(\"padding\", \"10px\")\n// .style(\"line-height\", \"1.3\")\n// .style(\"font\", \"11px sans-serif\");\n// }","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":25,"value":"denomcolor = {\n const scale = d3.scaleOrdinal(\n d3.quantize(d3.interpolateRainbow, alldenom.length + 1)\n );\n return (d) => scale(d.denomination + 1);\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":49,"value":"### Data","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":27,"value":"alldenom = {\n return [...new Set(data.map((d) => titleCase(d.denomination)))];\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":29,"value":"data = json.sort((a, b) => d3.ascending(a.denomination, b.denomination))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":31,"value":"json = d3.json(\n \"https://raw.githubusercontent.com/mkane2/baptisms/main/remote_files.json\"\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":47,"value":"### Formatting","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":23,"value":"formatDate = (d) => (d < 0 ? `${-d}BC` : `${d}`)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":33,"value":"function titleCase(s) {\n return s.replace(/\\w\\S*/g, function (t) {\n return t.charAt(0).toUpperCase() + t.substr(1).toLowerCase();\n });\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":35,"value":"height = 330","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":37,"value":"margin = ({ top: 20, right: 30, bottom: 60, left: 40 })","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":51,"value":"### Tooltip","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":53,"value":"tooltip = d3\n .select(\"body\")\n .append(\"div\")\n .style(\"position\", \"absolute\")\n .style(\"visibility\", \"hidden\")\n .style(\"background-color\", \"white\")\n .style(\"border-radius\", \"5px\")\n .style(\"box-shadow\", \"0 0 10px rgba(0,0,0,.25)\")\n .style(\"padding\", \"10px\")\n .style(\"line-height\", \"1.3\")\n .style(\"font\", \"0.75rem sans-serif\")\n .attr(\"class\", \"tooltip\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":55,"value":"tooltip_in = function (event, d) {\n return tooltip\n .html(\n \"

\" +\n d.name +\n \"

\" +\n d.start +\n \"-\" +\n d.end +\n \"

\" +\n d.duration +\n \" years

\" +\n d.nodes +\n \" nodes, \" +\n d.av_nodes +\n \" per year

\"\n )\n .style(\"visibility\", \"visible\")\n .style(\"top\", event.pageY + \"px\")\n .style(\"left\", event.pageX + \"px\");\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":57,"value":"tooltip_out = function () {\n return tooltip.transition().duration(50).style(\"visibility\", \"hidden\");\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":59,"value":"html`\n\n`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":68,"value":"import { Legend, Swatches } from \"@d3/color-legend\"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W34","stdlib":"1","titling":"auto"}} 32:"$31:body"