2b:null 2c:["$","title",null,{"children":"How Diverse is Museum Mile? | Celia Arsen | Observable"}] 31:Tc2a,chart1 = { const root = partition(data_guggenheim); root.each(d => d.current = d); const svg = d3.create("svg") .attr("viewBox", [0, 0, width, width]) .style("font", "10px sans-serif"); const g = svg.append("g") .attr("transform", `translate(${width / 2},${width / 2})`); const path = g.append("g") .selectAll("path") .data(root.descendants().slice(1)) .join("path") .attr("fill", d => { while (d.depth > 1) d = d.parent; return color(d.data.name); }) .attr("fill-opacity", d => arcVisible(d.current) ? (d.children ? 0.6 : 0.4) : 0) .attr("d", d => arc(d.current)); path.filter(d => d.children) .style("cursor", "pointer") .on("click", clicked); path.append("title") .text(d => `${d.ancestors().map(d => d.data.name).reverse().join("/")}\n${format(d.value)}`); const label = g.append("g") .attr("pointer-events", "none") .attr("text-anchor", "middle") .style("user-select", "none") .selectAll("text") .data(root.descendants().slice(1)) .join("text") .attr("dy", "0.35em") .attr("fill-opacity", d => +labelVisible(d.current)) .attr("transform", d => labelTransform(d.current)) .text(d => d.data.name); const parent = g.append("circle") .datum(root) .attr("r", radius) .attr("fill", "none") .attr("pointer-events", "all") .on("click", clicked); function clicked(p) { parent.datum(p.parent || root); root.each(d => d.target = { x0: Math.max(0, Math.min(1, (d.x0 - p.x0) / (p.x1 - p.x0))) * 2 * Math.PI, x1: Math.max(0, Math.min(1, (d.x1 - p.x0) / (p.x1 - p.x0))) * 2 * Math.PI, y0: Math.max(0, d.y0 - p.depth), y1: Math.max(0, d.y1 - p.depth) }); const t = g.transition().duration(750); // Transition the data on all arcs, even the ones that aren’t visible, // so that if this transition is interrupted, entering arcs will start // the next transition from the desired position. path.transition(t) .tween("data", d => { const i = d3.interpolate(d.current, d.target); return t => d.current = i(t); }) .filter(function(d) { return +this.getAttribute("fill-opacity") || arcVisible(d.target); }) .attr("fill-opacity", d => arcVisible(d.target) ? (d.children ? 0.6 : 0.4) : 0) .attrTween("d", d => () => arc(d.current)); label.filter(function(d) { return +this.getAttribute("fill-opacity") || labelVisible(d.target); }).transition(t) .attr("fill-opacity", d => +labelVisible(d.target)) .attrTween("transform", d => () => labelTransform(d.current)); } function arcVisible(d) { return d.y1 <= 3 && d.y0 >= 1 && d.x1 > d.x0; } function labelVisible(d) { return d.y1 <= 3 && d.y0 >= 1 && (d.y1 - d.y0) * (d.x1 - d.x0) > 0.03; } function labelTransform(d) { const x = (d.x0 + d.x1) / 2 * 180 / Math.PI; const y = (d.y0 + d.y1) / 2 * radius; return `rotate(${x - 90}) translate(${y},0) rotate(${x < 180 ? 0 : 180})`; } return svg.node(); }32:Tc28,chart_moma = { const root = partition(data_moma); root.each(d => d.current = d); const svg = d3.create("svg") .attr("viewBox", [0, 0, width, width]) .style("font", "10px sans-serif"); const g = svg.append("g") .attr("transform", `translate(${width / 2},${width / 2})`); const path = g.append("g") .selectAll("path") .data(root.descendants().slice(1)) .join("path") .attr("fill", d => { while (d.depth > 1) d = d.parent; return color(d.data.name); }) .attr("fill-opacity", d => arcVisible(d.current) ? (d.children ? 0.6 : 0.4) : 0) .attr("d", d => arc(d.current)); path.filter(d => d.children) .style("cursor", "pointer") .on("click", clicked); path.append("title") .text(d => `${d.ancestors().map(d => d.data.name).reverse().join("/")}\n${format(d.value)}`); const label = g.append("g") .attr("pointer-events", "none") .attr("text-anchor", "middle") .style("user-select", "none") .selectAll("text") .data(root.descendants().slice(1)) .join("text") .attr("dy", "0.35em") .attr("fill-opacity", d => +labelVisible(d.current)) .attr("transform", d => labelTransform(d.current)) .text(d => d.data.name); const parent = g.append("circle") .datum(root) .attr("r", radius) .attr("fill", "none") .attr("pointer-events", "all") .on("click", clicked); function clicked(p) { parent.datum(p.parent || root); root.each(d => d.target = { x0: Math.max(0, Math.min(1, (d.x0 - p.x0) / (p.x1 - p.x0))) * 2 * Math.PI, x1: Math.max(0, Math.min(1, (d.x1 - p.x0) / (p.x1 - p.x0))) * 2 * Math.PI, y0: Math.max(0, d.y0 - p.depth), y1: Math.max(0, d.y1 - p.depth) }); const t = g.transition().duration(750); // Transition the data on all arcs, even the ones that aren’t visible, // so that if this transition is interrupted, entering arcs will start // the next transition from the desired position. path.transition(t) .tween("data", d => { const i = d3.interpolate(d.current, d.target); return t => d.current = i(t); }) .filter(function(d) { return +this.getAttribute("fill-opacity") || arcVisible(d.target); }) .attr("fill-opacity", d => arcVisible(d.target) ? (d.children ? 0.6 : 0.4) : 0) .attrTween("d", d => () => arc(d.current)); label.filter(function(d) { return +this.getAttribute("fill-opacity") || labelVisible(d.target); }).transition(t) .attr("fill-opacity", d => +labelVisible(d.target)) .attrTween("transform", d => () => labelTransform(d.current)); } function arcVisible(d) { return d.y1 <= 3 && d.y0 >= 1 && d.x1 > d.x0; } function labelVisible(d) { return d.y1 <= 3 && d.y0 >= 1 && (d.y1 - d.y0) * (d.x1 - d.x0) > 0.03; } function labelTransform(d) { const x = (d.x0 + d.x1) / 2 * 180 / Math.PI; const y = (d.y0 + d.y1) / 2 * radius; return `rotate(${x - 90}) translate(${y},0) rotate(${x < 180 ? 0 : 180})`; } return svg.node(); }33:Tc2a,chart_frick = { const root = partition(data_frick); root.each(d => d.current = d); const svg = d3.create("svg") .attr("viewBox", [0, 0, width, width]) .style("font", "10px sans-serif"); const g = svg.append("g") .attr("transform", `translate(${width / 2},${width / 2})`); const path = g.append("g") .selectAll("path") .data(root.descendants().slice(1)) .join("path") .attr("fill", d => { while (d.depth > 1) d = d.parent; return color(d.data.name); }) .attr("fill-opacity", d => arcVisible(d.current) ? (d.children ? 0.6 : 0.4) : 0) .attr("d", d => arc(d.current)); path.filter(d => d.children) .style("cursor", "pointer") .on("click", clicked); path.append("title") .text(d => `${d.ancestors().map(d => d.data.name).reverse().join("/")}\n${format(d.value)}`); const label = g.append("g") .attr("pointer-events", "none") .attr("text-anchor", "middle") .style("user-select", "none") .selectAll("text") .data(root.descendants().slice(1)) .join("text") .attr("dy", "0.35em") .attr("fill-opacity", d => +labelVisible(d.current)) .attr("transform", d => labelTransform(d.current)) .text(d => d.data.name); const parent = g.append("circle") .datum(root) .attr("r", radius) .attr("fill", "none") .attr("pointer-events", "all") .on("click", clicked); function clicked(p) { parent.datum(p.parent || root); root.each(d => d.target = { x0: Math.max(0, Math.min(1, (d.x0 - p.x0) / (p.x1 - p.x0))) * 2 * Math.PI, x1: Math.max(0, Math.min(1, (d.x1 - p.x0) / (p.x1 - p.x0))) * 2 * Math.PI, y0: Math.max(0, d.y0 - p.depth), y1: Math.max(0, d.y1 - p.depth) }); const t = g.transition().duration(750); // Transition the data on all arcs, even the ones that aren’t visible, // so that if this transition is interrupted, entering arcs will start // the next transition from the desired position. path.transition(t) .tween("data", d => { const i = d3.interpolate(d.current, d.target); return t => d.current = i(t); }) .filter(function(d) { return +this.getAttribute("fill-opacity") || arcVisible(d.target); }) .attr("fill-opacity", d => arcVisible(d.target) ? (d.children ? 0.6 : 0.4) : 0) .attrTween("d", d => () => arc(d.current)); label.filter(function(d) { return +this.getAttribute("fill-opacity") || labelVisible(d.target); }).transition(t) .attr("fill-opacity", d => +labelVisible(d.target)) .attrTween("transform", d => () => labelTransform(d.current)); } function arcVisible(d) { return d.y1 <= 3 && d.y0 >= 1 && d.x1 > d.x0; } function labelVisible(d) { return d.y1 <= 3 && d.y0 >= 1 && (d.y1 - d.y0) * (d.x1 - d.x0) > 0.03; } function labelTransform(d) { const x = (d.x0 + d.x1) / 2 * 180 / Math.PI; const y = (d.y0 + d.y1) / 2 * radius; return `rotate(${x - 90}) translate(${y},0) rotate(${x < 180 ? 0 : 180})`; } return svg.node(); }34:Tc26,chart_met = { const root = partition(data_met); root.each(d => d.current = d); const svg = d3.create("svg") .attr("viewBox", [0, 0, width, width]) .style("font", "10px sans-serif"); const g = svg.append("g") .attr("transform", `translate(${width / 2},${width / 2})`); const path = g.append("g") .selectAll("path") .data(root.descendants().slice(1)) .join("path") .attr("fill", d => { while (d.depth > 1) d = d.parent; return color(d.data.name); }) .attr("fill-opacity", d => arcVisible(d.current) ? (d.children ? 0.6 : 0.4) : 0) .attr("d", d => arc(d.current)); path.filter(d => d.children) .style("cursor", "pointer") .on("click", clicked); path.append("title") .text(d => `${d.ancestors().map(d => d.data.name).reverse().join("/")}\n${format(d.value)}`); const label = g.append("g") .attr("pointer-events", "none") .attr("text-anchor", "middle") .style("user-select", "none") .selectAll("text") .data(root.descendants().slice(1)) .join("text") .attr("dy", "0.35em") .attr("fill-opacity", d => +labelVisible(d.current)) .attr("transform", d => labelTransform(d.current)) .text(d => d.data.name); const parent = g.append("circle") .datum(root) .attr("r", radius) .attr("fill", "none") .attr("pointer-events", "all") .on("click", clicked); function clicked(p) { parent.datum(p.parent || root); root.each(d => d.target = { x0: Math.max(0, Math.min(1, (d.x0 - p.x0) / (p.x1 - p.x0))) * 2 * Math.PI, x1: Math.max(0, Math.min(1, (d.x1 - p.x0) / (p.x1 - p.x0))) * 2 * Math.PI, y0: Math.max(0, d.y0 - p.depth), y1: Math.max(0, d.y1 - p.depth) }); const t = g.transition().duration(750); // Transition the data on all arcs, even the ones that aren’t visible, // so that if this transition is interrupted, entering arcs will start // the next transition from the desired position. path.transition(t) .tween("data", d => { const i = d3.interpolate(d.current, d.target); return t => d.current = i(t); }) .filter(function(d) { return +this.getAttribute("fill-opacity") || arcVisible(d.target); }) .attr("fill-opacity", d => arcVisible(d.target) ? (d.children ? 0.6 : 0.4) : 0) .attrTween("d", d => () => arc(d.current)); label.filter(function(d) { return +this.getAttribute("fill-opacity") || labelVisible(d.target); }).transition(t) .attr("fill-opacity", d => +labelVisible(d.target)) .attrTween("transform", d => () => labelTransform(d.current)); } function arcVisible(d) { return d.y1 <= 3 && d.y0 >= 1 && d.x1 > d.x0; } function labelVisible(d) { return d.y1 <= 3 && d.y0 >= 1 && (d.y1 - d.y0) * (d.x1 - d.x0) > 0.03; } function labelTransform(d) { const x = (d.x0 + d.x1) / 2 * 180 / Math.PI; const y = (d.y0 + d.y1) / 2 * radius; return `rotate(${x - 90}) translate(${y},0) rotate(${x < 180 ? 0 : 180})`; } return svg.node(); }35:T446,carchart = { const svg = d3.create("svg") .attr("viewBox", [0, 0, width, height]) .style("overflow", "visible"); svg.append("g") .selectAll("g") .data(series) .enter().append("g") .attr("fill", d => barColor(d.key)) .selectAll("rect") .data(d => d) .join("rect") .attr("x", d => x(d[0])) .attr("y", (d, i) => y(d.data.name)) .attr("width", d => x(d[1]) - x(d[0])) .attr("height", y.bandwidth()) .attr( 'fill', '#7ED26D' ) .on('mouseover', function(){ d3.select(this) .transition() .attr('fill', '#BDBDBD'); }) .on('mouseout', function(){ d3.select(this) .transition() .attr('fill', d => barColor(d.key)); }) .attr("fill", d => barColor(d.key)) .append("title") .text(d => `${d.data.name} ${d.key} ${formatPercent(d[1] - d[0])} (${formatValue(d.data[d.key])})`); svg.append("g") .call(xAxis); svg.append("g") .call(yAxis) return svg.node(); }36:T659,md`In this study we investigated the geographic and artistic diversity of four prominent museums in New York City. Overall, there was a strong presence of art from Western Europe and North America. The Met and the MoMA appear to have more geographically diverse collections than the Guggenheim and the Frick. The Met and the MoMA have more diverse art types represented in their collections as well. To some extent, these differences in diversity reflect large differences in museum collection sizes. The Met and MoMA have much larger collections than the Guggenheim and the Frick, and therefore have the ability to represent more cultures and art types. In addition, these differences in diversity reflect the divergent histories of these museums. The Frick, which was originally a private collection remains mostly European art pieces to this day. At the Met, the Egyptian Wing stands out as a prominent share of their current collection, in large part because the museum had agreements with the Egyptian government to conduct excavations there in the early 1900s. However, in some cases, the supposed missions of these musuems do not align with the contents of their collections. The Guggenheim, whose mission is to "engage both local and global audiences" does not have a global representation of art in their New York collection. Ultimately, museums serve as a unique window to the world. Patrons to these four New York City museums have an incredible opportunity to see some amazing art, but their collections are not necessarily representative of the art of the world, but rather the histories of those museums.`37:[{"id":"e7485ccd049b780c0110817bbe045c2d1cd2d92a4e7fefed8a76dacaa1c50bad640316da628bb95b20cb1b83649c88733ec2ab569baca36f11dbb328f344d5a9","href":"https://static.observableusercontent.com/files/e7485ccd049b780c0110817bbe045c2d1cd2d92a4e7fefed8a76dacaa1c50bad640316da628bb95b20cb1b83649c88733ec2ab569baca36f11dbb328f344d5a9","name":"guggenheim@1.json","type":"application/json","lastModified":1588714043189.525,"size":2595},{"id":"8ed8108127cfd0c04eb9aa8599416edec1928fb661775a5465c2497bc2d9600796e685054192b240663626677cadd9215da6b033453eb85a6ff6a67a71e03596","href":"https://static.observableusercontent.com/files/8ed8108127cfd0c04eb9aa8599416edec1928fb661775a5465c2497bc2d9600796e685054192b240663626677cadd9215da6b033453eb85a6ff6a67a71e03596","name":"moma@3.json","type":"application/json","lastModified":1588714043189.525,"size":19002},{"id":"3cdf861687fa8c9ad66c9dc53b202feb837b260cc9146def81eb01d698377fffcdcd7004ecf9cd66c765b569c39b177371ae21e644bf73bd5d21ef7a4fa92580","href":"https://static.observableusercontent.com/files/3cdf861687fa8c9ad66c9dc53b202feb837b260cc9146def81eb01d698377fffcdcd7004ecf9cd66c765b569c39b177371ae21e644bf73bd5d21ef7a4fa92580","name":"frick@2.json","type":"application/json","lastModified":1588714043189.525,"size":1711},{"id":"05dbe4ebbc82d39d10497fad09e9872da24fdf50cd985fb5e8c6ff76f3821f3847947fad84131c5af6f4aa356dc26878e5e3b419dd8f51d3b11636350c65c907","href":"https://static.observableusercontent.com/files/05dbe4ebbc82d39d10497fad09e9872da24fdf50cd985fb5e8c6ff76f3821f3847947fad84131c5af6f4aa356dc26878e5e3b419dd8f51d3b11636350c65c907","name":"met.json","type":"application/json","lastModified":1588714043189.525,"size":19513},{"id":"b805a709c597f9094756a8511fd0781a719fe0672dbe550f7bcaadcbc4affabf6455606fd99d707dbdfebbb0f1ca4bb612e6eeada9944be8127f4aa2b7dd9717","href":"https://static.observableusercontent.com/files/b805a709c597f9094756a8511fd0781a719fe0672dbe550f7bcaadcbc4affabf6455606fd99d707dbdfebbb0f1ca4bb612e6eeada9944be8127f4aa2b7dd9717","name":"MET_FRICK_MOMA_GUGG.json","type":"application/json","lastModified":1588714043189.525,"size":319459},{"id":"0fd459d446a4335158037fc98d3a5a2247bb92a583ec82716607a88b7bffee8da7ac0929f21d513f0972c1389f26da59ba96a24f2ef828ecc7f420703a558608","href":"https://static.observableusercontent.com/files/0fd459d446a4335158037fc98d3a5a2247bb92a583ec82716607a88b7bffee8da7ac0929f21d513f0972c1389f26da59ba96a24f2ef828ecc7f420703a558608","name":"MuseumMissions.JPG","type":"image/jpeg","lastModified":1588714043189.525,"size":211168},{"id":"d8a8d866a9c1eda1b1c56820d12f16aa55d1c329513b6f82bf9d29636ac26fb6c384ada9b440b832248ea50168e227b59a329467f04780b2cc3477873d98dcb3","href":"https://static.observableusercontent.com/files/d8a8d866a9c1eda1b1c56820d12f16aa55d1c329513b6f82bf9d29636ac26fb6c384ada9b440b832248ea50168e227b59a329467f04780b2cc3477873d98dcb3","name":"NYCMuseumsSmall.png","type":"image/png","lastModified":1588714043189.525,"size":1323537},{"id":"c4c989c3359da1825f8b9e53b0d95730d49edaa1f4ffc1862099b329782fadbd2a24c82ba7956e43c7eba9c76a633df285ddb517a3c6a0c25ef6fbf293e38dd6","href":"https://static.observableusercontent.com/files/c4c989c3359da1825f8b9e53b0d95730d49edaa1f4ffc1862099b329782fadbd2a24c82ba7956e43c7eba9c76a633df285ddb517a3c6a0c25ef6fbf293e38dd6","name":"mediums.csv","type":"text/csv","lastModified":1589239033178.619,"size":351},{"id":"af2979b1feb3e31c97a5dc8b2ce6f1a4adf5ab2a5e4ce9ab271fed65fa60eb76eeb7fa9e207bcbc6216f6a21b4f406f35bd1b844f8dafd12bf0fb9816666368c","href":"https://static.observableusercontent.com/files/af2979b1feb3e31c97a5dc8b2ce6f1a4adf5ab2a5e4ce9ab271fed65fa60eb76eeb7fa9e207bcbc6216f6a21b4f406f35bd1b844f8dafd12bf0fb9816666368c","name":"mediums_condensed.csv","type":"text/csv","lastModified":1589252269873.207,"size":441}] 2f:{"id":"0593191a2150a1e8","slug":"how-diverse-is-museum-mile","title":"How Diverse is Museum Mile?","thumbnail":"a4d1196da658b9609d960ae345f3a19f3520025318bafcc83fa56b6c29fc7484","access_level":"public","create_time":"$D2020-05-05T21:27:23.189Z","update_time":"$D2020-05-12T03:51:39.222Z","view_time":null,"first_public_time":"$D2020-05-12T03:52:09.888Z","fork":true,"stars":1,"starred":false,"owner":{"type":"team","id":"ebe6576eb3451360","login":"celiaarsen","name":"Celia Arsen","avatar_url":"https://avatars-next.observableusercontent.com/b8ebb524c2ab0afd9b6b4e819a84fd27198320a51e4abe6d049f877752eb1fa9","tier":"starter_2024"},"version":635,"publish_version":635,"role":null,"authored":false,"authors":[{"type":"individual","id":"f16d5c0dac028279","login":"celiaarsen","name":"Celia Arsen","avatar_url":"https://avatars-next.observableusercontent.com/b8ebb524c2ab0afd9b6b4e819a84fd27198320a51e4abe6d049f877752eb1fa9","tier":null}],"members":[{"type":"individual","id":"f16d5c0dac028279","login":"celiaarsen","name":"Celia Arsen","avatar_url":"https://avatars-next.observableusercontent.com/b8ebb524c2ab0afd9b6b4e819a84fd27198320a51e4abe6d049f877752eb1fa9","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":3,"collection":null,"type":"notebook","body":{"title":"How Diverse is Museum Mile?","cells":[{"id":415,"value":"md`# How Diverse is Museum Mile?`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":630,"value":"md`by [Celia Arsen](https://observablehq.com/@celiaarsen), [Olinah Hassan](https://observablehq.com/@oh), and [Teresa Tseng](https://observablehq.com/@teresatseng/)`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":421,"value":"md`New York City is home to several of the most renowned art museums in the world. People look towards museums to gain access to other parts of the world they may not be able to witness personally. They are an opportunity for people to understand cultures, histories, and different perspectives all in one space. With such power to influence people’s perceptions on the world, it is important that museum collections can be as diverse as the world they seek to represent. How diverse are the collections of four prominent art institutions on Museum Mile in New York City: The Guggenheim Museum, The Metropolitan Museum of Art, The Frick Collection, and The Museum of Modern Art?\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":425,"value":"//image of where the museums are\nhtml`

\n ${await FileAttachment(\"NYCMuseumsSmall.png\").image()}\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":428,"value":"md`[Previous studies](https://journals.plos.org/plosone/article?id=10.1371/journal.pone.0212852) have shown that American museums overwhelmingly house art from white, male artists. In this project, we investigate a slightly different interpretation of diversity, focused on art objects, as opposed to artists. We look at the region of origin and medium of each object in a museum's collection, with the idea that appropriate representation not only means geographic diversity, but artistic diversity.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":432,"value":"md`### What ideals were these museums founded upon?`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":430,"value":"md`The Met, MoMa, Frick, and Guggenheim all have different histories that have impacted what their collections look like today. These are the mission statements of these institutions.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":437,"value":"//Museum histories and missions\nimage = await FileAttachment(\"MuseumMissions.JPG\").image()\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":439,"value":"md`# Geographic diversity`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":441,"value":"md`First, we investigate the geographic diversity of these NYC museum collections. The following figures show that across the four museums, art from North America and Europe are overrepresented. At the Met, Africa stands out as a large portion of the collection. If we look closer at the countries of origin, however, we see that of the 33,452 objects from North Africa, 31,113 are from Egypt.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":0,"value":"md`## CLICK a * node * to *ZOOM IN*, or the * CENTER* to *ZOOM OUT*. `","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":388,"value":"md`# Guggenheim Museum`\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":7,"value":"$31","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":394,"value":"md`# Museum of Modern Art`\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":370,"value":"$32","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":398,"value":"md`# Frick Museum`\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":376,"value":"$33","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":510,"value":"md`# Metropolitan Museum of Art`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":512,"value":"$34","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":448,"value":"md`Explore this geographic information on the map below`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":455,"value":"viewof museum = select({options:museumNames})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":457,"value":"chart = {\n const width=900, height=600;\n const svg = d3.select(DOM.svg(width, height))\n \n // Use Mercator projection\n var projection = d3.geoMercator()\n \t.fitExtent([[100, 100], [width, height]],map);\n\n var path = d3.geoPath()\n .projection(projection);\n \n svg.append(\"g\")\n .attr(\"transform\", \"translate(610,20)\")\n .append(() => legend({color: d3.scaleQuantize()\n .domain([0,50])\n .range(d3.schemePurples[5]), title: \"Percent of Collection\", width: 300}));\n \n // Draw each region as a path\n svg.append('g').selectAll('path')\n \t.data(map.features)\n \t.enter().append('path')\n \t.attr('d', path)\n .attr(\"fill\", d => selectMuseum(d))\n \t.style('stroke', '#ccc')\n \n return svg.node()\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":532,"value":"md`# Art type diversity`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":600,"value":"md`The following figure shows the four museums by the share of their collection of each type. `","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":591,"value":"key = legend({title: \"Type\", \n color: d3.scaleOrdinal()\n .domain(series.map(d => d.key)) .range([\"#1f78b4\",\"#aec6e8\",\"#fe7f0e\",\"#ffbc78\",\"#2ba02d\",\"#97df89\",\"#d52728\",\"#ff9897\",\"#9467bc\",\"#c4b0d5\",\n \"#8c564a\",\"#c49c94\",\"#e377c2\",\"#7f7f7f\",\"#c7c7c7\",\"#bcbd23\",\"#dadb8d\",\"#17bed0\",\"#9ddae6\"])\n .unknown(\"#ccc\"), \n tickSize: 0, width: 980})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":585,"value":"$35","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":603,"value":"md`Note: The category \"raw materials\" includes wood, bone/ivory, and metal`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":616,"value":"md`The Met and the MoMA have a wider variety of art types represented than the Guggenheim and the Frick. Nearly 80 percent of the Guggenheim's collection is paintings, and a large share of the Frick's collection is devoted to these more classic art types.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":606,"value":"md`# Conclusions`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":604,"value":"$36","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":452,"value":"md`# Appendix`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":486,"value":"map = (await FileAttachment(\"MET_FRICK_MOMA_GUGG.json\")).json()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":460,"value":"//if else for attribute switch\nfunction selectMuseum(d) {\n console.log(\"hello\",d)\n if (museum=='The Met') {\n return purples(d.properties.met_p)\n } \n else if (museum=='The Guggenheim'){\n return purples(d.properties.gug_p)}\n else if (museum=='The MoMa'){\n return purples(d.properties.moma_p)}\n else {\n return purples(d.properties.frick_p)}\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":465,"value":"museumNames = [\"The Met\", \"The Guggenheim\", \"The MoMa\", \"The Frick\"]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":462,"value":"color = d3.scaleOrdinal(d3.schemeTableau10)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":588,"value":"barColor = d3.scaleOrdinal()\n .domain(series.map(d => d.key))\n .range([\"#1f78b4\",\"#aec6e8\",\"#fe7f0e\",\"#ffbc78\",\"#2ba02d\",\"#97df89\",\"#d52728\",\"#ff9897\",\"#8c564a\",\"#c49c94\",\n \"#9467bc\",\"#c4b0d5\",\"#e377c2\",\"#7f7f7f\",\"#c7c7c7\",\"#bcbd23\",\"#dadb8d\",\"#17bed0\",\"#9ddae6\"])\n .unknown(\"#ccc\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":513,"value":"data_met = FileAttachment(\"met.json\").json()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":373,"value":"data_frick =FileAttachment(\"frick@2.json\").json()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":365,"value":"data_moma =FileAttachment(\"moma@3.json\").json()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3,"value":"data_guggenheim = FileAttachment(\"guggenheim@1.json\").json()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":23,"value":"partition = data => {\n const root = d3.hierarchy(data)\n .sum(d => d.value)\n .sort((a, b) => b.value - a.value);\n return d3.partition()\n .size([2 * Math.PI, root.height + 1])\n (root);\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":121,"value":"purples = d3.scaleQuantize()\n .domain([0,50])\n .range(d3.schemePurples[5]);\n//color = d3.scaleOrdinal(d3.quantize(d3.interpolateRainbow, data.children.length + 1))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":39,"value":"format = d3.format(\",d\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":16,"value":"width = 932","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":21,"value":"radius = width / 6","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":9,"value":"arc = d3.arc()\n .startAngle(d => d.x0)\n .endAngle(d => d.x1)\n .padAngle(d => Math.min((d.x1 - d.x0) / 2, 0.005))\n .padRadius(radius * 1.5)\n .innerRadius(d => d.y0 * radius)\n .outerRadius(d => Math.max(d.y0 * radius, d.y1 * radius - 1))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":559,"value":"x = d3.scaleLinear()\n .range([margin.left, width - margin.right])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":571,"value":"y = d3.scaleBand()\n .domain(data.map(d => d.name))\n .range([margin.top, height - margin.bottom])\n .padding(0.08)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":578,"value":"xAxis = g => g\n .attr(\"transform\", `translate(0,${margin.top})`)\n .call(d3.axisTop(x).ticks(width / 100, \"%\"))\n .call(g => g.selectAll(\".domain\").remove())","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":568,"value":"yAxis = g => g\n .attr(\"transform\", `translate(${margin.left},0)`)\n .call(d3.axisLeft(y).tickSizeOuter(0))\n .call(g => g.selectAll(\".domain\").remove())","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":576,"value":"formatPercent = d3.format(\".1%\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":583,"value":"formatValue = x => isNaN(x) ? \"N/A\" : x.toLocaleString(\"en\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":562,"value":"height = data.length * 30 + margin.top + margin.bottom","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":561,"value":"margin = ({top: 30, right: 10, bottom: 0, left: 30})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":552,"value":"series = d3.stack()\n .keys(data.columns.slice(1))\n .offset(d3.stackOffsetExpand)\n (data)\n .map(d => (d.forEach(v => v.key = d.key), d))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":550,"value":"data = d3.csvParse(await FileAttachment(\"mediums_condensed.csv\").text(), (d, i, columns) => (d3.autoType(d), d.total = d3.sum(columns, c => d[c]), d)).sort((a, b) => b[\"<10\"] / b.total - a[\"<10\"] / a.total)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":6,"value":"d3 = require(\"d3@5\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":473,"value":"import {legend} from \"@d3/color-legend\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":475,"value":"import {slider,button,select,text,radio,checkbox,number} from \"@jashkenas/inputs\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W37","stdlib":"1","titling":"auto"}} 30:"$2f:body"