25:["$","title",null,{"children":"Artists Exhibited Together at the Smithsonian American Art Museum (SAAM) | sona | Observable"}] 49:Tae2,chart = { const svg = d3.select(DOM.svg(width, height)); svg.append("style").text(` .hover path { stroke: #ccc; } .hover text { fill: #ccc; } .hover g.primary text { fill: black; font-weight: bold; } .hover g.secondary text { fill: #333; } .hover path.primary { stroke: #333; stroke-opacity: 1; } `); const label = svg.append("g") .attr("font-family", "sans-serif") .attr("font-size", 10) .attr("text-anchor", "end") .selectAll("g") .data(graph.nodes) .join("g") .attr("transform", d => `translate(${margin.left},${d.y = y(d.id)})`) .call(g => g.append("text") .attr("x", -6) .attr("dy", "0.35em") .attr("fill", d => d3.lab(color(d.group)).darker(2)) .text(d => d.id)) .call(g => g.append("circle") .attr("r", 3) .attr("fill", d => color(d.group))); const path = svg.insert("g", "*") .attr("fill", "none") .attr("stroke-opacity", 0.6) .attr("stroke-width", 1.5) .selectAll("path") .data(graph.links) .join("path") .attr("stroke", d => d.source.group === d.target.group ? color(d.source.group) : "#8002d4") .attr("d", arc); const overlay = svg.append("g") .attr("fill", "none") .attr("pointer-events", "all") .selectAll("rect") .data(graph.nodes) .join("rect") .attr("width", margin.left + 40) .attr("height", step) .attr("y", d => y(d.id) - step / 2) .on("mouseover", d => { svg.classed("hover", true); label.classed("primary", n => n === d); label.classed("secondary", n => n.sourceLinks.some(l => l.target === d) || n.targetLinks.some(l => l.source === d)); path.classed("primary", l => l.source === d || l.target === d).filter(".primary").raise(); }) .on("mouseout", d => { svg.classed("hover", false); label.classed("primary", false); label.classed("secondary", false); path.classed("primary", false).order(); }); function update() { y.domain(graph.nodes.sort(viewof order.value).map(d => d.id)); const t = svg.transition() .duration(750); label.transition(t) .delay((d, i) => i * 20) .attrTween("transform", d => { const i = d3.interpolateNumber(d.y, y(d.id)); return t => `translate(${margin.left},${d.y = i(t)})`; }); path.transition(t) .duration(750 + graph.nodes.length * 20) .attrTween("d", d => () => arc(d)); overlay.transition(t) .delay((d, i) => i * 20) .attr("y", d => y(d.id) - step / 2); } viewof order.addEventListener("input", update); invalidation.then(() => viewof order.removeEventListener("input", update)); return svg.node(); }4a:[{"id":"5a892f391b327a85dffaf64a4c495e97ccecec594a62971bd0962b11c8b903ccd0a39502b34c093f2cefcc909bcd6b2a7d82c0934992bbd60da0c666cbd8237e","href":"https://static.observableusercontent.com/files/5a892f391b327a85dffaf64a4c495e97ccecec594a62971bd0962b11c8b903ccd0a39502b34c093f2cefcc909bcd6b2a7d82c0934992bbd60da0c666cbd8237e","name":"line_chart_coocurr@5.json","type":"application/json","lastModified":1705013856812.347,"size":367162}] 29:{"id":"43fc84ef8e28a0d5","slug":null,"title":"Artists Exhibited Together at the Smithsonian American Art Museum (SAAM)","thumbnail":"a69382500936aa5273b5517f913e0e3f7de8f18a8162877b80510af667b6e6fa","access_level":"public","create_time":"$D2024-01-05T20:03:00.484Z","update_time":"$D2024-01-23T18:58:30.047Z","view_time":null,"first_public_time":"$D2024-01-05T20:03:00.484Z","has_unpublished_edits":null,"fork":{"id":"bd4aad090710b5ab","slug":"stanford-dermatology-co-authorship","title":"Stanford Dermatology Co-authorship","owner":{"id":"9125b8eed3cf2eaf","login":"lucyz","name":"Lucy Zhang"}},"stars":2,"starred":false,"owner":{"type":"team","id":"b444bbbd6982f688","login":"sonoet","name":"sona","avatar_url":"https://avatars-next.observableusercontent.com/ff37bbf61bb234e77b7649a6fe9fa84c42b1ddd5bda5d96e9792756528f6ed15","tier":"starter_2024","bio":"","followed_by_you":false,"follows_you":false},"version":395,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"f68387689c69dd34","login":"sonoet","name":"sona","avatar_url":"https://avatars-next.observableusercontent.com/ff37bbf61bb234e77b7649a6fe9fa84c42b1ddd5bda5d96e9792756528f6ed15","tier":null,"bio":"","followed_by_you":false,"follows_you":false}],"members":[{"type":"individual","id":"f68387689c69dd34","login":"sonoet","name":"sona","avatar_url":"https://avatars-next.observableusercontent.com/ff37bbf61bb234e77b7649a6fe9fa84c42b1ddd5bda5d96e9792756528f6ed15","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":1,"collection":null,"type":"notebook","body":{"titling":"auto","title":"Artists Exhibited Together at the Smithsonian American Art Museum (SAAM)","cells":[{"id":0,"value":"md`# Artists Exhibited Together at the Smithsonian American Art Museum (SAAM)\n\nThe diagram below considers 265 artists across 87 SAAM exhibits to determine which artists were exhibited together. See below the diagram for more information about the data. You can order the diagram by \n

NUMBER OF CONNECTIONS to see who was exhibited with the most others\n

ERA to cluster artists by the time period they were born (or were active in)\\\n

NAME to see an alphabetical listing of the artists names.\n\nColors of artist names\\ >> BLUE: before 1900; ORANGE: 1900-1950; GREEN: 1950-\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":125,"value":"viewof order = {\n const options = [\n {name: \"Order by Number of Connections\", value: (a, b) => d3.sum(b.sourceLinks, l => l.value) + d3.sum(b.targetLinks, l => l.value) - d3.sum(a.sourceLinks, l => l.value) - d3.sum(a.targetLinks, l => l.value) || d3.ascending(a.id, b.id)},\n {name: \"Order by Name\", value: (a, b) => d3.ascending(a.id, b.id)}, \n {name: \"Order by Era\", value: (a, b) => a.group - b.group || d3.ascending(a.id, b.id)},\n ];\n const form = html`