2d:["$","title",null,{"children":"Trend of Exhibitions in Tokyo | Taiki Sekiguchi | Observable"}] 32:T2f81,{ const margin = { top: 90, right: 90, bottom: 45, left: (width * 19) / 64 }; const svg = d3 .create("svg") .attr("viewBox", [0, 0, width, height]) .attr("width", 900) .attr("height", 600); //スケールと軸関数 const xScale = d3 .scaleLinear() .domain([0, decendentedDatabyAve[0].visiterAverage]) .range([margin.left, width - margin.right]); const yScale = d3 .scaleBand() .domain(exhibitionNames) .range([margin.top, height - margin.bottom]) .padding(0.15); const yAxis = d3.axisLeft().scale(yScale); const xAxis = d3 .axisTop() .tickSize(-(height - margin.top - margin.bottom)) .scale(xScale) .tickValues([0, 1000, 2000, 3000, 4000, 5000, 6000, 7000, 8000]); // //色分け用のオブジェクト const eraColor = [ { name: "現代", color: "hsl(0, 75%, 65%)" }, { name: "近代", color: "hsl(45, 75%, 65%)" }, { name: "中世", color: "hsl(90,75%, 65%)" }, { name: "複数", color: "hsl(0, 60%, 100%)" } ]; const hostingStyle = [ { name: "美術館＋マスメディア＋共催企業", color: "hsl(6, 78%, 57%)" }, { name: "美術館＋マスメディア", color: "hsl(28, 80%, 52%)" }, { name: "美術館＋主催企業＋共催企業", color: "hsl(48, 89%, 50%)" }, { name: "美術館＋主催企業", color: "hsl(168, 76%, 42%)" }, { name: "美術館＋共催企業", color: "hsl(145, 63%, 49%)" }, { name: "美術館＋行政", color: "hsl(204, 70%, 53%)" }, { name: "美術館", color: "hsl(283, 39%, 53%)" }, { name: "行政", color: "hsl(210, 29%, 29%)" } ]; // //背景 svg .append("g") .append("rect") .attr("width", width) .attr("height", height) .attr("stroke", "black") .attr("fill", "white"); // //縦軸 svg .append("g") .attr("class", "xAxis") .attr("transform", `translate(0,${margin.top})`) .attr("font-family", "sans-serif") .attr("font-weight", "normal") .call(xAxis); // //グラフ本体 const rects = svg .append("g") .selectAll("rect") .data(decendentedDatabyAve) .join("rect"); rects .attr("x", xScale(0)) .attr("y", d => yScale(d.exhibitionNameJa)) .attr("width", d => xScale(d.visiterAverage) - xScale(0)) .attr("height", yScale.bandwidth()) .attr("fill", d => { if (graphFilter.includes("host")) { if (d.hostingStyle == hostingStyle[0].name) { return hostingStyle[0].color; } else if (d.hostingStyle == hostingStyle[1].name) { return hostingStyle[1].color; } else if (d.hostingStyle == hostingStyle[2].name) { return hostingStyle[2].color; } else if (d.hostingStyle == hostingStyle[3].name) { return hostingStyle[3].color; } else if (d.hostingStyle == hostingStyle[4].name) { return hostingStyle[4].color; } else if (d.hostingStyle == hostingStyle[5].name) { return hostingStyle[5].color; } else if (d.hostingStyle == hostingStyle[6].name) { return hostingStyle[6].color; } else if (d.hostingStyle == hostingStyle[7].name) { return hostingStyle[7].color; } else { return "gray"; } } else { return "gray"; } }); // //数値ラベル or ジャンルラベル svg .append("g") .attr("class", "number&mediaLabel") .selectAll("text") .data(decendentedDatabyAve) .join("text") .attr("text-anchor", d => { if (graphFilter.includes("genre")) { if (d.visiterAverage > 4000) { return "end"; } else { return "start"; } } else { return "middle"; } }) .attr("x", d => { if (graphFilter.includes("genre")) { if (d.visiterAverage > 4000) { return xScale(d.visiterAverage) - 10; } else { return xScale(d.visiterAverage) + 10; } } else { if (d.visiterAverage > 1400) { return xScale(d.visiterAverage) - 20; } else { return xScale(d.visiterAverage) + 20; } } }) .attr("y", d => yScale(d.exhibitionNameJa) + yScale.bandwidth() / 2 + 4.5) .attr("font-family", "sans-serif") .attr("font-weight", "bold") .attr("font-size", 12) .attr("fill", d => { if (graphFilter.includes("genre")) { if (d.visiterAverage > 4000) { return "white"; } else { return "black"; } } else { if (d.visiterAverage > 1400) { return "white"; } else { return "black"; } } }) .text(d => { if (graphFilter.includes("genre")) { return d.media; } else { return d.visiterAverage; } }); // //背景色 svg .append("g") .attr("class", "EraLabelColor") .selectAll("rect") .data(decendentedDatabyAve) .join("rect") .attr("x", 15) .attr("y", d => yScale(d.exhibitionNameJa)) .attr("width", margin.left - 15) .attr("height", yScale.bandwidth()) .attr("opacity", d => { if (graphFilter.includes("era")) { return "0.75"; } else { return "0.35"; } }) .attr("fill", (d, i) => { if (graphFilter.includes("era")) { if (d.era == eraColor[0].name) { return eraColor[0].color; } else if (d.era == eraColor[1].name) { return eraColor[1].color; } else if (d.era == eraColor[2].name) { return eraColor[2].color; } else { return eraColor[3].color; } } else { if (i % 2 == 0) { return "gray"; } else if (i % 2 == 1) { return "white"; } } }); // //美術館ラベル svg .append("g") .attr("class", "museumLabel") .selectAll("text") .data(decendentedDatabyAve) .join("text") .attr("text-anchor", "start") .attr("x", 50) .attr("y", d => yScale(d.exhibitionNameJa) + yScale.bandwidth() / 2 + 3) .attr("font-family", "sans-serif") .attr("font-weight", "normal") .attr("font-size", 10) .attr("fill", "black") .text(d => museumLabel(d.museumNameJa)); // //総入場者数 svg .append("g") .attr("class", "visiterLabel") .selectAll("text") .data(decendentedDatabyAve) .join("text") .attr("text-anchor", "end") .attr("x", width - 10) .attr("y", d => yScale(d.exhibitionNameJa) + yScale.bandwidth() / 2 + 3) .attr("font-family", "sans-serif") .attr("font-weight", "normal") .attr("font-size", 10) .attr("fill", "black") .text(d => d.visiterCount); // //ランキング svg .append("g") .attr("class", "rankLabel") .selectAll("text") .data(decendentedDatabyAve) .join("text") .attr("text-anchor", "start") .attr("x", 20) .attr("y", d => yScale(d.exhibitionNameJa) + yScale.bandwidth() / 2 + 3.5) .attr("font-family", "sans-serif") .attr("font-weight", "normal") .attr("font-size", 10) .attr("fill", "black") .text((d, i) => i + 1); // //展覧会名 svg .append("g") .attr("class", "yAxis") .attr("transform", `translate(${margin.left}, 0)`) .attr("font-family", "sans-serif") .attr("font-weight", "normal") .attr("color", "black") .call(yAxis); // //グラフのタイトル /* svg .append("g") .attr("class", "title") .append("text") .attr("x", width / 2) .attr("y", margin.top / 3) .attr("text-anchor", "middle") .attr("font-family", "sans-serif") .attr("font-size", 20) .text("1日の平均入場者数による展覧会のランキング（人/日）"); */ // //軸の調整 svg .selectAll("g.xAxis") .selectAll("line, path") .attr("stroke", "silver") .attr("opacity", 0.75); // //美術館の名前 svg .append("g") .attr("class", "museumName") .append("text") .attr("x", 50) .attr("y", height - margin.bottom / 2) .attr("text-anchor", "start") .attr("font-family", "sans-serif") .attr("font-size", 10) .attr("color", "gray") .text( "新国：新国立美術館　西美：国立西洋美術館　都美：東京都美術館　庭美：東京都庭園美術館　写美：東京都写真美術館　現美：東京都現代美術館" ); // //縦軸の説明 svg .append("g") .attr("class", "discription") .append("text") .attr("x", 20) .attr("y", margin.top - 10) .attr("text-anchor", "start") .attr("font-family", "sans-serif") .attr("font-size", 10) .attr("color", "gray") .text("順位"); svg .append("g") .attr("class", "discription") .append("text") .attr("x", 50) .attr("y", margin.top - 10) .attr("text-anchor", "start") .attr("font-family", "sans-serif") .attr("font-size", 10) .attr("color", "gray") .text("美術館"); svg .append("g") .attr("class", "discription") .append("text") .attr("x", margin.left / 2) .attr("y", margin.top - 10) .attr("text-anchor", "start") .attr("font-family", "sans-serif") .attr("font-size", 10) .attr("color", "gray") .text("展覧会名"); svg .append("g") .attr("class", "discription") .append("text") .attr("x", width - 10) .attr("y", margin.top - 10) .attr("text-anchor", "end") .attr("font-family", "sans-serif") .attr("font-size", 10) .attr("color", "gray") .text("総入場者数"); // //時代の凡例 const w = 15; const legendRectsEra = svg .append("g") .selectAll("rect") .data(eraColor) .join("rect"); legendRectsEra .attr("y", margin.top / 3 - w / 2) .attr("x", (d, i) => (margin.left * (i + 1)) / 6 - w / 2) .attr("width", w) .attr("height", w) .attr("fill", d => d.color) .attr("stroke", "black") .attr("stroke-width", "1") .attr("visibility", d => { if (graphFilter.includes("era")) { return "visible"; } else { return "hidden"; } }); const legendTextsEra = svg .append("g") .selectAll("text") .data(eraColor) .join("text"); legendTextsEra .attr("y", margin.top / 3 + 4) .attr("x", (d, i) => (margin.left * (i + 1)) / 6 + w / 2 + 5) .attr("text-anchor", "start") .attr("font-family", "sans-serif") .attr("font-size", 12) .text(d => d.name) .attr("visibility", d => { if (graphFilter.includes("era")) { return "visible"; } else { return "hidden"; } }); // //主催者の凡例 const legendRects = svg .append("g") .selectAll("rect") .data(hostingStyle) .join("rect"); legendRects .attr("y", (d, i) => { if (i < 4) { return margin.top / 3 - w / 2 - 5; } else { return margin.top / 3 - w / 2 + 15; } }) .attr( "x", (d, i) => ((width - margin.left) * ((i % 4) + 1)) / 4.1 + margin.left - w / 2 - 120 ) .attr("width", w) .attr("height", w) .attr("fill", d => d.color) .attr("stroke", "black") .attr("stroke-width", "1") .attr("visibility", d => { if (graphFilter.includes("host")) { return "visible"; } else { return "hidden"; } }); const legendTexts = svg .append("g") .selectAll("text") .data(hostingStyle) .join("text"); legendTexts .attr("y", (d, i) => { if (i < 4) { return margin.top / 3 - w / 2 + 7; } else { return margin.top / 3 - w / 2 + 27; } }) .attr( "x", (d, i) => ((width - margin.left) * ((i % 4) + 1)) / 4.1 + margin.left + w / 2 + 5 - 120 ) .attr("text-anchor", "start") .attr("font-family", "sans-serif") .attr("font-size", 12) .text(d => d.name) .attr("visibility", d => { if (graphFilter.includes("host")) { return "visible"; } else { return "hidden"; } }); // return svg.node(); }33:T296b,{ const margin = { top: 135, right: 90, bottom: 30, left: (width * 19) / 64 }; const svg = d3 .create('svg') .attr('viewBox', [0, 0, width2, height2]) .attr('width', 900) .attr('height', 600); const xScale = d3 .scaleLinear() .domain([0, decendentedDatabyAve2[0].visiterAverage]) .range([margin.left, width2 - margin.right]); const yScale = d3 .scaleBand() .domain(exhibitionNames2) .range([margin.top, height2 - margin.bottom]) .padding(0.15); const yAxis = d3.axisLeft().scale(yScale); const xAxis = d3 .axisTop() .tickSize(-(height2 - margin.top - margin.bottom)) .scale(xScale) .tickValues([0, 1000, 2000, 3000, 4000, 5000, 6000, 7000, 8000, 9000]); const eraColor = [ { name: '現代', color: 'hsl(0, 75%, 65%)' }, { name: '近代', color: 'hsl(45, 75%, 65%)' }, { name: '中世', color: 'hsl(90,75%, 65%)' }, { name: '複数', color: 'hsl(0, 60%, 100%)' } ]; const hostingStyle = [ { name: '美術館＋マスメディア＋共催企業', color: 'hsl(6, 78%, 57%)' }, { name: '美術館＋マスメディア', color: 'hsl(28, 80%, 52%)' }, { name: '美術館＋主催企業＋共催企業', color: 'hsl(48, 89%, 50%)' }, { name: '美術館＋主催企業', color: 'hsl(168, 76%, 42%)' }, { name: '美術館＋共催企業', color: 'hsl(145, 63%, 49%)' }, { name: '美術館＋行政', color: 'hsl(204, 70%, 53%)' }, { name: '美術館', color: 'hsl(283, 39%, 53%)' }, { name: '行政', color: 'hsl(210, 29%, 29%)' } ]; //背景 svg .append('g') .append('rect') .attr('width', width2) .attr('height', height2) .attr('stroke', 'black') .attr('fill', 'white'); svg .append('g') .attr('class', 'xAxis') .attr('transform', `translate(0,${margin.top})`) .attr('font-family', 'sans-serif') .attr('font-weight', 'normal') .call(xAxis); //グラフ本体 const rects = svg .append('g') .selectAll('rect') .data(decendentedDatabyAve2) .join('rect'); rects .attr('x', xScale(0)) .attr('y', d => yScale(d.exhibitionNameJa)) .attr('width', d => xScale(d.visiterAverage) - xScale(0)) .attr('height', yScale.bandwidth()) .attr('fill', d => { if (graphFilter2.includes("host")) { if (d.hostingStyle == hostingStyle[0].name) { return hostingStyle[0].color; } else if (d.hostingStyle == hostingStyle[1].name) { return hostingStyle[1].color; } else if (d.hostingStyle == hostingStyle[2].name) { return hostingStyle[2].color; } else if (d.hostingStyle == hostingStyle[3].name) { return hostingStyle[3].color; } else if (d.hostingStyle == hostingStyle[4].name) { return hostingStyle[4].color; } else if (d.hostingStyle == hostingStyle[5].name) { return hostingStyle[5].color; } else if (d.hostingStyle == hostingStyle[6].name) { return hostingStyle[6].color; } else if (d.hostingStyle == hostingStyle[7].name) { return hostingStyle[7].color; } else { return 'gray'; } } else { return 'gray'; } }); //数値ラベル or ジャンルラベル svg .append('g') .attr('class', 'number&mediaLabel') .selectAll('text') .data(decendentedDatabyAve2) .join('text') .attr('text-anchor', 'end') .attr('x', d => xScale(d.visiterAverage) - 10) .attr('y', d => yScale(d.exhibitionNameJa) + yScale.bandwidth() / 2 + 4.5) .attr('font-family', 'sans-serif') .attr('font-weight', 'bold') .attr('font-size', 12) .attr('fill', 'white') .text(d => { if (graphFilter2.includes("genre")) { return d.media; } else { return d.visiterAverage; } }); //多分もっと簡単になるはず //背景色 svg .append('g') .attr('class', 'EraLabelColor') .selectAll('rect') .data(decendentedDatabyAve2) .join('rect') .attr('x', 15) .attr('y', d => yScale(d.exhibitionNameJa)) .attr('width', margin.left - 15) .attr('height', yScale.bandwidth()) .attr('opacity', d => { if (graphFilter2.includes("era")) { return '0.75'; } else { return '0.35'; } }) .attr('fill', (d, i) => { if (graphFilter2.includes("era")) { if (d.era == eraColor[0].name) { return eraColor[0].color; } else if (d.era == eraColor[1].name) { return eraColor[1].color; } else if (d.era == eraColor[2].name) { return eraColor[2].color; } else { return eraColor[3].color; } } else { if (i % 2 == 0) { return 'gray'; } else if (i % 2 == 1) { return 'white'; } } }); //美術館ラベル svg .append('g') .attr('class', 'museumLabel') .selectAll('text') .data(decendentedDatabyAve2) .join('text') .attr('text-anchor', 'start') .attr('x', 50) .attr('y', d => yScale(d.exhibitionNameJa) + yScale.bandwidth() / 2 + 3) .attr('font-family', 'sans-serif') .attr('font-weight', 'normal') .attr('font-size', 10) .attr('fill', 'black') .text(d => d.museumNameJa); //総入場者数 svg .append('g') .attr('class', 'visiterLabel') .selectAll('text') .data(decendentedDatabyAve2) .join('text') .attr('text-anchor', 'end') .attr('x', width - 10) .attr('y', d => yScale(d.exhibitionNameJa) + yScale.bandwidth() / 2 + 3) .attr('font-family', 'sans-serif') .attr('font-weight', 'normal') .attr('font-size', 10) .attr('fill', 'black') .text(d => d.visiterCount); //ランキング svg .append('g') .attr('class', 'rankLabel') .selectAll('text') .data(decendentedDatabyAve2) .join('text') .attr('text-anchor', 'start') .attr('x', 20) .attr('y', d => yScale(d.exhibitionNameJa) + yScale.bandwidth() / 2 + 3.5) .attr('font-family', 'sans-serif') .attr('font-weight', 'normal') .attr('font-size', 10) .attr('fill', 'black') .text((d, i) => i + 1); //展覧会名 svg .append("g") .attr('class', 'yAxis') .attr('transform', `translate(${margin.left}, 0)`) .attr('font-family', 'sans-serif') .attr('font-weight', 'normal') .attr('color', 'black') .call(yAxis); svg .append('g') .attr('class', 'title') .append('text') .attr('x', width / 2) .attr('y', margin.top / 3) .attr('text-anchor', 'middle') .attr('font-family', 'sans-serif') .attr('font-size', 20) .text('1日の平均入場者数によるランキング（人/日）'); svg .selectAll('g.xAxis') .selectAll('line, path') .attr('stroke', 'silver') .attr('opacity', 0.75); //縦軸の説明 svg .append('g') .attr('class', 'discription') .append('text') .attr('x', 20) .attr('y', margin.top - 10) .attr('text-anchor', 'start') .attr('font-family', 'sans-serif') .attr('font-size', 10) .attr('color', 'gray') .text('順位'); svg .append('g') .attr('class', 'discription') .append('text') .attr('x', 50) .attr('y', margin.top - 10) .attr('text-anchor', 'start') .attr('font-family', 'sans-serif') .attr('font-size', 10) .attr('color', 'gray') .text('美術館'); svg .append('g') .attr('class', 'discription') .append('text') .attr('x', margin.left / 2) .attr('y', margin.top - 10) .attr('text-anchor', 'start') .attr('font-family', 'sans-serif') .attr('font-size', 10) .attr('color', 'gray') .text('展覧会名'); svg .append('g') .attr('class', 'discription') .append('text') .attr('x', width - 10) .attr('y', margin.top - 10) .attr('text-anchor', 'end') .attr('font-family', 'sans-serif') .attr('font-size', 10) .attr('color', 'gray') .text('総入場者数'); //凡例 const w = 15; const legendRectsEra = svg .append('g') .selectAll('rect') .data(eraColor) .join('rect'); legendRectsEra .attr('y', (margin.top * 2) / 3 - w / 2) .attr('x', (d, i) => (margin.left * (i + 1)) / 6 - w / 2) .attr('width', w) .attr('height', w) .attr('fill', d => d.color) .attr('stroke', 'black') .attr('stroke-width', '1') .attr("visibility", d => { if (graphFilter2.includes("era")) { return "visible"; } else { return "hidden"; } }); const legendTextsEra = svg .append('g') .selectAll('text') .data(eraColor) .join('text'); legendTextsEra .attr('y', (margin.top * 2) / 3 + 4) .attr('x', (d, i) => (margin.left * (i + 1)) / 6 + w / 2 + 5) .attr('text-anchor', 'start') .attr('font-family', 'sans-serif') .attr('font-size', 12) .text(d => d.name) .attr("visibility", d => { if (graphFilter2.includes("era")) { return "visible"; } else { return "hidden"; } }); //主催者 const legendRects = svg .append('g') .selectAll('rect') .data(hostingStyle) .join('rect'); legendRects .attr('y', (d, i) => { if (i < 4) { return (margin.top * 2) / 3 - w / 2 - 5; } else { return (margin.top * 2) / 3 - w / 2 + 15; } }) .attr( 'x', (d, i) => ((width - margin.left) * ((i % 4) + 1)) / 4.1 + margin.left - w / 2 - 120 ) .attr('width', w) .attr('height', w) .attr('fill', d => d.color) .attr('stroke', 'black') .attr('stroke-width', '1') .attr("visibility", d => { if (graphFilter2.includes("host")) { return "visible"; } else { return "hidden"; } }); const legendTexts = svg .append('g') .selectAll('text') .data(hostingStyle) .join('text'); legendTexts .attr('y', (d, i) => { if (i < 4) { return (margin.top * 2) / 3 - w / 2 + 7; } else { return (margin.top * 2) / 3 - w / 2 + 27; } }) .attr( 'x', (d, i) => ((width - margin.left) * ((i % 4) + 1)) / 4.1 + margin.left + w / 2 + 5 - 120 ) .attr('text-anchor', 'start') .attr('font-family', 'sans-serif') .attr('font-size', 12) .text(d => d.name) .attr("visibility", d => { if (graphFilter2.includes("host")) { return "visible"; } else { return "hidden"; } }); return svg.node(); }34:Td90,text = () => { if ( graphFilter.includes("genre") && graphFilter.includes("era") && graphFilter.includes("host") ) { return '　作品のジャンルのラベルと、時代区分のラベル、そして展覧会の開催者のラベルを掛け合わせると、このようになる。
　3つのフィルターを掛け合わせると、展覧会の傾向として多いのは「美術館＋マスメディア＋共催企業」によって開催される、「近代」の「絵画」作品の展覧会である、と言えるだろう。'; } else if (graphFilter.includes("genre") && graphFilter.includes("era")) { return '　作品のジャンルのラベルと、時代区分のラベルを掛け合わせると、このようになる。
　時代区分が「近代」や「中世」の展覧会では「絵画」と「彫刻」が展示されているのが多い。「現代」の展覧会では、ジャンルは複合的になっているものや、空間を作品とみなす「インスタレーション」であることが多い。
　上位の展覧会は「近代」の「絵画」であることが多いと言えるだろう。'; } else if (graphFilter.includes("genre") && graphFilter.includes("host")) { return '　作品のジャンルのラベルと、展覧会の開催者のラベルとを掛け合わせると、このようになる。
　上位を占めているのは「美術館＋マスメディア＋共催企業」によって開催されている、「絵画」の展覧会である。'; } else if (graphFilter.includes("era") && graphFilter.includes("host")) { return '　作品の時代区分のラベルと、展覧会の開催者のラベルとを掛け合わせると、このようになる。
　上位を占めているのは「美術館＋マスメディア＋共催企業」によって開催されている、「近代」と「中世」の展覧会である。'; } else if (graphFilter.includes("genre")) { return '　ランキングを作品の時代性でラベル付けすると、このようになる。
　　「絵画」の展覧会は数が多く、順位も高い。上位13位は、8位を除くと「絵画」の展覧会が続いている。'; } else if (graphFilter.includes("era")) { return '　ランキングを作品の時代性でラベル付けすると、このようになる。
　「近代」は全体的に分布しているが、上位7位は、5位を除くとほとんどが近代の作品である。
　「中世」の作品は9位から18位の間に、「現代」の作品は主に19位から27位の間に集中している。'; } else if (graphFilter.includes("host")) { return '　ランキングを展覧会の開催者でラベル付けすると、このようになる。「美術館＋マスメディア（新聞社、放送局）＋共催企業」の形式によって開催されている展覧会が全体的に多く、上位を占めている。'; } else { return '上のグラフは2018年から2019年における展覧会をランキングにしたものである。一般的に会期が長いほど入場者数も増えるので、比較のために入場者の総数ではなく会期中の平均入場者数を用いている。
　1位は東京都立美術館で開催された『ムンク展』で2位の『東山魁夷展』に3000（人/日）以上差をつけている。'; } }35:[{"id":"fcc47a88997ceb37ab67f2f84f1a6512c164062108f57a2c79ca343270081beb13292a30c556a8f6ea024242eae124cfa165647ff7024d168e828ed6bc179325","href":"https://static.observableusercontent.com/files/fcc47a88997ceb37ab67f2f84f1a6512c164062108f57a2c79ca343270081beb13292a30c556a8f6ea024242eae124cfa165647ff7024d168e828ed6bc179325","name":"isaw-company-Oqv_bQbZgS8-unsplash.jpg","type":"image/jpeg","lastModified":1611630735259.558,"size":37059},{"id":"477cb7c20f8dee7a20054a7c3a2361b711088be0c046d1c0240b6ef6e08e4880860e43019273d5afc471a056e6b53f821d76d95418858d155fa575b93927e2c8","href":"https://static.observableusercontent.com/files/477cb7c20f8dee7a20054a7c3a2361b711088be0c046d1c0240b6ef6e08e4880860e43019273d5afc471a056e6b53f821d76d95418858d155fa575b93927e2c8","name":"kazuo-ota-oQG_6wdM0KY-unsplash@1.jpg","type":"image/jpeg","lastModified":1611815838276.004,"size":30334}] 30:{"id":"b9f513c4e2917e68","slug":"trend-of-exhibitions-in-tokyo","title":"Trend of Exhibitions in Tokyo","thumbnail":"6cbeb2741ffc6163774ec7fc959a91c28ef554c4f945d327fddd9199506a69a2","access_level":"public","create_time":"$D2020-12-10T13:29:53.994Z","update_time":"$D2021-07-11T06:07:26.629Z","view_time":null,"first_public_time":"$D2020-12-10T13:42:50.449Z","has_unpublished_edits":null,"fork":false,"stars":0,"starred":false,"owner":{"type":"team","id":"5165ec00a1c927e2","login":"taiki4532","name":"Taiki Sekiguchi","avatar_url":"https://avatars-next.observableusercontent.com/8fd3dcc90fb16d4e4280f19b9b25ec6d72cdb6bab6541a0e992ec8b7f7979312","tier":"starter_2024"},"version":1587,"publish_version":1587,"role":null,"authored":false,"authors":[{"type":"individual","id":"4b7dc05076733908","login":"taiki4532","name":"Taiki Sekiguchi","avatar_url":"https://avatars-next.observableusercontent.com/8fd3dcc90fb16d4e4280f19b9b25ec6d72cdb6bab6541a0e992ec8b7f7979312","tier":null}],"members":[{"type":"individual","id":"4b7dc05076733908","login":"taiki4532","name":"Taiki Sekiguchi","avatar_url":"https://avatars-next.observableusercontent.com/8fd3dcc90fb16d4e4280f19b9b25ec6d72cdb6bab6541a0e992ec8b7f7979312","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"titling":"auto","title":"Trend of Exhibitions in Tokyo","cells":[{"id":0,"value":"html`

Trend of Exhibitions in Tokyo

データ可視化で見る
東京都内の展覧会

\n　アート、芸術、美術とは、個人の思い、思想を表現としてあらわした創造物であり、展覧会の社会的な意義とは、それらの多様な表現を受け入れるための場を作り、多くの人に広く鑑賞する機会を設けることである。そのためには、展覧会が扱う作品も多様であるべきである。また、多様な展覧会を開催するだけでなく、それらの情報を公開し人々のもとに伝え、鑑賞するまでのきっかけを作ることも美術館の役割である。

\n\n

\n\n\n

\n　　しかし現実的には、社会には傾向が存在する。人気になる展覧会とならない展覧会があり、より多くの人の目に触れる作品とそうでない作品がある。

　では、東京の美術館においては、どんな傾向がみられるのか。人気となる展覧会とは何か。また、それらを規定する要因があるとすれば何か。そのような問いをもとに、展覧会のデータを収集し、可視化した。\n

数値を収集したのは、新国立美術館、国立西洋美術館、東京都美術館、東京都庭園美術館、東京都写真美術館、東京都現代美術館の6つの館で開催されたもので、展覧会開始日が2018年1月から2019年4月の間のものである。

グラフは、データを平均入場者で降順に並べ替えたものを棒グラフで表している。グラフ上部にあるチェックボックスでラベリングのフィルターを切り替えることができるので、フィルターの組み合わせを変えてみて傾向を発見してほしい。

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1411,"value":"html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":670,"value":"html`

1日の平均入場者数による展覧会のランキング（人/日）

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1044,"value":"viewof graphFilter = {\n const graphBox = d3.select(\n checkbox({\n title: \"フィルター\",\n options: [\n { value: \"genre\", label: \"1.作品のジャンル\" },\n { value: \"era\", label: \"2.作品の時代区分\" },\n { value: \"host\", label: \"3.展覧会の開催者\" }\n ]\n })\n );\n\n graphBox.selectAll('label').style('font-family', 'sans-serif');\n return graphBox.node();\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":291,"value":"$32","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":666,"value":"html`

　${text()}

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1408,"value":"html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1415,"value":"html`

補足

　東京の展覧会動向を論じるためには、今回データを集めた6つの美術館だけでは不十分である。都内の大型の美術館は他にも、森美術館や上野の森美術館などがあり、特にこの二つの美術館は2019年の展覧会入場者数ランキングの上位3位に入るほど動員数の多い美術館となっている。より包括的なリサーチのためには、これらの私立美術館も分析の対象とするべきだが、今回はそれらの美術館の入場者数のデータを発見することができなかった。
　参考として、美術手帖が調査した2019年の展覧会ランキングのデータをもとに作成したグラフを記載する。
出典：2019年展覧会入場者数TOP10。1位はフェルメール展の68万人（美術手帖）

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1509,"value":"viewof graphFilter2 = {\n const graphBox = d3.select(\n checkbox({\n title: \"フィルター\",\n options: [\n { value: \"genre\", label: \"1.作品のジャンル\" },\n { value: \"era\", label: \"2.作品の時代区分\" },\n { value: \"host\", label: \"3.展覧会の開催者\" }\n ]\n })\n );\n\n graphBox.selectAll('label').style('font-family', 'sans-serif');\n return graphBox.node();\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1464,"value":"$33","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1519,"value":"html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":158,"value":"html`

データの出典

展覧会のデータは以下の美術館のホームページまたは年報から数値を取り出した。
\n新国立美術館
\n国立西洋美術館
\n国立近代美術館
\n東京都美術館
\n東京都庭園美術館
\n東京都写真美術館
\n東京都現代美術館
\n

\n\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1528,"value":"html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1532,"value":"html`

データ処理用セル

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":35,"value":"url = \"https://gist.githubusercontent.com/Taiki4532/f6c7fb87614a6b315a9c5574cfde3431/raw/e43b829b12b56a9d1aad32e3df914fc85dbf0f51/museum.csv\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1448,"value":"url2 = \"https://gist.githubusercontent.com/Taiki4532/f6c7fb87614a6b315a9c5574cfde3431/raw/e43b829b12b56a9d1aad32e3df914fc85dbf0f51/2019exhibitionbyBT\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":323,"value":"dataset = d3.csv(url, d3.autoType)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1451,"value":"dataset2 = d3.csv(url2, d3.autoType)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":327,"value":"decendentedDatabyAve = d3.reverse(d3.sort(dataset, d => d.visiterAverage))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1388,"value":"decendentedDatabyDur = d3.reverse(d3.sort(dataset, d => d.duration))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1455,"value":"decendentedDatabyAve2 = d3.reverse(d3.sort(dataset2, d => d.visiterAverage))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":607,"value":"exhibitionNames = d3.map(decendentedDatabyAve, d => d.exhibitionNameJa)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1459,"value":"exhibitionNames2 = d3.map(decendentedDatabyAve2, d => d.exhibitionNameJa)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":862,"value":"museumLabel = d => {\n if (d == '新国立美術館') return '新国';\n else if (d == '国立西洋美術館') return '西美';\n else if (d == '国立近代美術館') return '近美';\n else if (d == '東京都立美術館') return '都美';\n else if (d == '東京都庭園美術館') return '庭美';\n else if (d == '東京都写真美術館') return '写美';\n else if (d == '東京都現代美術館') return '現美';\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":905,"value":"width = 1200","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":908,"value":"height = 800","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1487,"value":"width2 = 1200","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1488,"value":"height2 = 800","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1175,"value":"$34","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":236,"value":"html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1047,"value":"import { checkbox } from \"@jashkenas/inputs\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":292,"value":"d3 = require('d3@6')","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W35","stdlib":"1"}} 31:"$30:body" 2c:E{"digest":"NEXT_REDIRECT;replace;/@taiki4532/trend-of-exhibitions-in-tokyo;307;"}

Trend of Exhibitions in Tokyo

データ可視化で見る東京都内の展覧会

1日の平均入場者数による展覧会のランキング（人/日）

補足

データの出典

データ処理用セル

データ可視化で見る
東京都内の展覧会