31:T135e,{ const margin = { top: 50, right: -10, bottom: 40, left: 130 }; // 下の余白を広げる const width = 800 - margin.left - margin.right; const height = 600 - margin.top - margin.bottom; // SVG要素の作成 const svg = d3 .create("svg") .attr("viewBox", [ 0, 0, width + margin.left + margin.right, height + margin.top + margin.bottom ]); // スケール関数 const xScale = d3 .scaleLog() .domain([200000, d3.max(dataset, (d) => d.population)]) .range([margin.left, width - margin.right]); const yScale = d3 .scaleLog() .domain([1, d3.max(dataset, (d) => d.number)]) .range([height - margin.bottom - 30, margin.top]); const rScale = d3.scaleSqrt().domain([0, 20]).range([0, 40]); // 横線グリッド svg .append("g") .selectAll("line") .data(yScale.ticks(3)) .join("line") //.attr("x1", xScale(0)) .attr("x1", margin.left) // グリッドの始点を左の余白に合わせる .attr("x2", xScale(d3.max(dataset, (d) => d.population))) .attr("y1", (d) => yScale(d)) .attr("y2", (d) => yScale(d)) .attr("stroke", "#ccc"); svg .append("g") .selectAll("line") .data(xScale.ticks(3)) .join("line") .attr("x1", (d) => xScale(d)) .attr("x2", (d) => xScale(d)) .attr("y1", yScale(1)) .attr("y2", yScale(d3.max(dataset, (d) => d.number))) .attr("stroke", "#ccc"); // ドットとテキスト const dots = svg .append("g") .selectAll("g") .data(dataset) .join("g") .attr( "transform", (d) => `translate(${xScale(d.population)}, ${yScale(d.number)})` ); dots .append("circle") .attr("r", 10) .attr("fill", "#4A84B8") .attr("opacity", 0.5); dots .append("text") .text((d) => d.language) // 表示したいプロパティに変更 .attr("text-anchor", "middle") .attr("y", -20) .attr("dy", "0.25em") .style("font-size", "10px") .attr("transform", (d) => d.number === d3.min(dataset, (d) => d.number) ? "rotate(-15)" : "" ) // 条件に基づいてラベルを回転 .style("pointer-events", "none"); // ドットの重なりを確認して、重なっている場合はラベルを省略 dots.each((d, i, nodes) => { const currentDot = d3.select(nodes[i]); const x1 = +currentDot.attr("transform").split(",")[0].slice(10); const y1 = +currentDot.attr("transform").split(",")[1].slice(0, -1); // 他のドットと比較 dots.each((dd, ii, nn) => { if (i !== ii) { const x2 = +d3.select(nn[ii]).attr("transform").split(",")[0].slice(10); const y2 = +d3 .select(nn[ii]) .attr("transform") .split(",")[1] .slice(0, -1); // 一定の距離以下にドットが重なっている場合はラベルを省略 if (Math.sqrt((x1 - x2) ** 2 + (y1 - y2) ** 2) < 20) { currentDot.select("text").style("visibility", "hidden"); } } }); }); tooltip .append("rect") .attr("fill", "white") .attr("stroke", "#DDDDDD") .attr("width", 145) .attr("height", 105) .attr("opacity", 0.8); // ドットにマウスが乗ったらツールチップを表示 dots .on("mouseover", function (e, d, i) { tooltip .html( `

${d.language}
人口：${d.population}
受賞数：${d.number}

` ) .style("visibility", "visible"); d3.select(this).attr("opacity", 1); }) .on("mousemove", function (e) { // ツールチップの横幅を取得 var tooltipWidth = tooltip.node().offsetWidth; // マウスのX座標によって条件分岐 var tooltipX = e.pageX < window.innerWidth / 2 ? e.pageX + 10 : e.pageX - tooltipWidth - 10; // ツールチップをマウスの位置に移動 tooltip .style("top", e.pageY + 10 + "px") .style("left", tooltipX + "px") .style("width", "200px"); }) .on("mouseout", function () { tooltip.html(``).style("visibility", "hidden"); d3.select(this).transition(); }); // 軸関数 const xAxis = d3.axisBottom().scale(xScale); const yAxis = d3.axisLeft().scale(yScale); // 軸表示 svg .append("g") .attr("transform", `translate(0,${height - margin.bottom})`) .call(xAxis); svg.append("g").attr("transform", `translate(${margin.left},0)`).call(yAxis); // テキスト svg .append("text") .attr("text-anchor", "middle") // .attr("transform", `translate(${width / 2},${height - 10})`) // 位置を調整 .attr("x", width / 2) .attr("y", height) .text("話者数"); svg .append("text") .attr("text-anchor", "middle") .attr("transform", "rotate(-90)") .attr("y", margin.left / 4) // 位置を調整 .attr("x", -height / 2) .text("受賞数"); return svg.node(); }32:T5fc, https://books.google.co.jp/ 　　　https://ja.wikipedia.org/wiki/%E3%83%8E%E3%83%BC%E3%83%99%E3%83%AB%E6%96%87%E5%AD%A6%E8%B3%9E%E5%8F%97%E8%B3%9E%E8%80%85%E3%81%AE%E4%B8%80%E8%A6%A7#%E8%A8%80%E8%AA%9E%E3%81%AB%E3%82%88%E3%82%8B%E5%88%86%E9%A1%9E https://japan.wipgroup.com/media/language-population 言語 https://ja.wikipedia.org/wiki/%E3%82%B9%E3%82%A6%E3%82%A7%E3%83%BC%E3%83%87%E3%83%B3%E8%AA%9E スウェーデン語 https://ja.wikipedia.org/wiki/%E3%83%8E%E3%83%AB%E3%82%A6%E3%82%A7%E3%83%BC%E8%AA%9E ノルウェー語 https://ja.wikipedia.org/wiki/%E3%83%87%E3%83%B3%E3%83%9E%E3%83%BC%E3%82%AF%E8%AA%9E デンマーク https://ja.wikipedia.org/wiki/%E3%82%AE%E3%83%AA%E3%82%B7%E3%82%A2%E8%AA%9E ギリシャ https://ja.wikipedia.org/wiki/%E3%83%81%E3%82%A7%E3%82%B3%E8%AA%9E チェコ https://ja.wikipedia.org/wiki/%E3%83%95%E3%82%A3%E3%83%B3%E3%83%A9%E3%83%B3%E3%83%89%E8%AA%9E フィンランド https://ja.wikipedia.org/wiki/%E3%83%98%E3%83%96%E3%83%A9%E3%82%A4%E8%AA%9E ヘブライ https://ja.wikipedia.org/wiki/%E3%83%8F%E3%83%B3%E3%82%AC%E3%83%AA%E3%83%BC%E8%AA%9E ハンガリー https://ja.wikipedia.org/wiki/%E3%82%A2%E3%82%A4%E3%82%B9%E3%83%A9%E3%83%B3%E3%83%89%E8%AA%9E アイスランド https://ja.wikipedia.org/wiki/%E3%83%97%E3%83%AD%E3%83%B4%E3%82%A1%E3%83%B3%E3%82%B9%E8%AA%9E プロヴァンス https://ja.wikipedia.org/wiki/%E3%82%BB%E3%83%AB%E3%83%93%E3%82%A2%E8%AA%9E セルビア https://ja.wikipedia.org/wiki/%E3%82%A4%E3%83%87%E3%82%A3%E3%83%83%E3%82%B7%E3%83%A5%E8%AA%9E　イディッシュ 33:T1772,function createGraph() { const margin = { top: 20, right: -10, bottom: 40, left: 130 }; // 下の余白を広げる const width = 800 - margin.left - margin.right; const height = 500 - margin.top - margin.bottom; // SVG要素の作成 const svg = d3 .create("svg") .attr("viewBox", [ 0, 0, width + margin.left + margin.right, height + margin.top + margin.bottom ]); // 手動でoriginalの順序を指定 const originalOrder = [ "トルコ語", "スウェーデン語", "ノルウェー語", "英語", "中国語", "ハンガリー語", "ロシア語", "ポーランド語", "ドイツ語", "フランス語", "スペイン語" ]; // 一つの original に対応する言語ごとのデータを集計 const aggregatedData = d3.group(dataset2, (d) => d.original); const languageData = d3.group(dataset2, (d) => d.language); // Sort languageData based on the "area" property const sortedLanguageData = Array.from(languageData.keys()).sort((a, b) => d3.ascending(languageData.get(a)[0].area, languageData.get(b)[0].area) ); // 左側のテキストを描画 const leftTextGroup = svg .selectAll(".left-text-group") .data(originalOrder) .enter() .append("g") .attr("class", "left-text-group") .attr( "transform", (d, i) => `translate(${margin.left - 5},${ (height / originalOrder.length) * i + margin.top })` ); // 四角で囲んだラベルを描画 leftTextGroup .append("rect") .attr("width", 50) .attr("height", height / originalOrder.length) .attr("fill", colorScale2) .style("opacity", 0.5); leftTextGroup .append("text") .attr("x", 25) .attr("y", height / (2 * originalOrder.length)) .style("text-anchor", "middle") .style("alignment-baseline", "middle") .style("font-size", "7px") .style("fill", "black") .text((d) => d); // 右側のテキストを描画 const rightTextGroups = svg .selectAll(".right-text-group") .data(sortedLanguageData) // ソートされた言語データを使用 .enter() .append("g") .attr("class", "right-text-group") .attr( "transform", (d, i) => `translate(${width - margin.right - 50},${ (height / languageData.size) * i + margin.top + 15 })` ); // 各 "area" に対応する言語ごとに色を割り当てる const areaLanguageColors = {}; sortedLanguageData.forEach((language, i) => { const area = languageData.get(language)[0].area; if (!(area in areaLanguageColors)) { areaLanguageColors[area] = colorScale(area); } }); // 四角で囲んだラベルを描画 rightTextGroups .append("rect") .attr("width", 50) .attr("height", height / languageData.size) .style("fill", (d) => areaLanguageColors[languageData.get(d)[0].area]) .style("opacity", 0.5); rightTextGroups .append("text") .attr("x", 25) .attr("y", height / (2 * languageData.size)) .style("text-anchor", "middle") .style("alignment-baseline", "middle") .style("font-size", "7px") .style("fill", "black") .text((d) => d); // 曲線のジェネレータ const curveGenerator = d3.line().curve(d3.curveBasis); // パスを描画して country と language を繋げる const paths = svg .selectAll(".path") .data(dataset2) .enter() .append("path") .attr("class", "path") .attr("d", (d) => { const originalIndex = originalOrder.indexOf(d.original); const startX = margin.left + 50; const startY = (height / originalOrder.length) * originalIndex + margin.top + height / (2 * originalOrder.length); // 中央にオフセット const endX = width - margin.right - 50; const endY = (height / languageData.size) * sortedLanguageData.indexOf(d.language) + margin.top + 15; // 中央にオフセット // 曲線の制御点を計算 const controlX1 = startX + (endX - startX) / 2; const controlY1 = startY; const controlX2 = startX + (endX - startX) / 2; const controlY2 = endY; return `M ${startX} ${startY} C ${controlX1} ${controlY1}, ${controlX2} ${controlY2}, ${endX} ${endY}`; }) .attr("stroke", "gray") .attr("stroke-width", 1) .attr("fill", "none") .style("opacity", 0.5); // Hover effect leftTextGroup .on("mouseover", function (event, d) { const original = d; paths .filter((data) => data.original === original) .attr("stroke", "#9370DB") .attr("stroke-width", 5); }) .on("mouseout", function (event, d) { paths .filter((data) => data.original === d) .attr("stroke", "gray") .attr("stroke-width", 1); // Revert to the original stroke width }); // Hover effect for rightTextGroups (languages) rightTextGroups .on("mouseover", function (event, d) { const language = d; paths .filter((data) => data.language === language) .attr("stroke", "#9370DB") .attr("stroke-width", 5); }) .on("mouseout", function (event, d) { paths .filter((data) => data.language === d) .attr("stroke", "gray") .attr("stroke-width", 1); // Revert to the original stroke width }); // Add original language label svg .append("text") .attr("x", margin.left + 10) .attr("y", margin.top - 15) .style("text-anchor", "start") .style("alignment-baseline", "hanging") .style("font-size", "12px") .style("fill", "black") .text("原語"); // Add translated language label svg .append("text") .attr("x", width + margin.left - 130) .attr("y", margin.top) .style("text-anchor", "end") .style("alignment-baseline", "hanging") .style("font-size", "12px") .style("fill", "black") .text("翻訳語"); return svg.node(); }34:T15c8,function createCountryGraph() { const margin = { top: 20, right: -10, bottom: 40, left: 130 }; // 下の余白を広げる const width = 800 - margin.left - margin.right; const height = 500 - margin.top - margin.bottom; // SVG要素の作成 const svg = d3 .create("svg") .attr("viewBox", [ 0, 0, width + margin.left + margin.right, height + margin.top + margin.bottom ]); // 手動でcountryの順序を指定 const countryOrder = [ "トルコ", "スウェーデン", "ノルウェー", "イギリス", "オーストラリア", "カナダ", "アメリカ", "中国", "ハンガリー", "ベラルーシ", "ポーランド", "フランス", "ドイツ", "ペルー" ]; const aggregatedData = d3.group(dataset2, (d) => d.country); const languageData = d3.group(dataset2, (d) => d.language); // 左側のテキストを描画 const leftTextGroup = svg .selectAll(".left-text-group") .data(countryOrder) .enter() .append("g") .attr("class", "left-text-group") .attr( "transform", (d, i) => `translate(${margin.left - 5},${ (height / countryOrder.length) * i + margin.top })` ); leftTextGroup .append("rect") .attr("width", 50) .attr("height", height / countryOrder.length) .attr("fill", colorScale3) .style("opacity", 0.5); leftTextGroup .append("text") .attr("x", 25) .attr("y", height / (2 * countryOrder.length)) .style("text-anchor", "middle") .style("alignment-baseline", "middle") .style("font-size", "7px") .style("fill", "black") .text((d) => d); // 右側のテキストを描画（言語ごとに色分けし、エリアごとにソート） const sortedLanguageData = Array.from(languageData.keys()).sort((a, b) => d3.ascending(languageData.get(a)[0].area, languageData.get(b)[0].area) ); const rightTextGroup = svg .selectAll(".right-text-group") .data(sortedLanguageData) .enter() .append("g") .attr("class", "right-text-group") .attr( "transform", (d, i) => `translate(${width - margin.right - 50},${ (height / languageData.size) * i + margin.top + 15 })` ); // 各 "area" に対応する言語ごとに色を割り当てる const areaLanguageColors = {}; sortedLanguageData.forEach((language, i) => { const area = languageData.get(language)[0].area; if (!(area in areaLanguageColors)) { areaLanguageColors[area] = colorScale(area); } }); rightTextGroup .append("rect") .attr("width", 50) .attr("height", height / languageData.size) .style("fill", (d) => areaLanguageColors[languageData.get(d)[0].area]) .style("opacity", 0.5); rightTextGroup .append("text") .attr("x", 25) .attr("y", height / (2 * languageData.size)) .style("text-anchor", "middle") .style("alignment-baseline", "middle") .style("font-size", "7px") .style("fill", "black") .text((d) => d); // パスを描画して country と language を繋げる const paths = svg .selectAll(".path") .data(dataset2) .enter() .append("path") .attr("class", "path") .attr("d", (d) => { const countryIndex = countryOrder.indexOf(d.country); const startX = margin.left + 50; const startY = (height / countryOrder.length) * countryIndex + margin.top + height / (2 * countryOrder.length); const endX = width - margin.right - 50; const endY = (height / languageData.size) * sortedLanguageData.indexOf(d.language) + margin.top + 20; const controlX1 = startX + (endX - startX) / 2; const controlY1 = startY; const controlX2 = startX + (endX - startX) / 2; const controlY2 = endY; return `M ${startX} ${startY} C ${controlX1} ${controlY1}, ${controlX2} ${controlY2}, ${endX} ${endY}`; }) .attr("stroke", "gray") .attr("stroke-width", 1) .attr("fill", "none") .style("opacity", 0.5); // Hover effect leftTextGroup .on("mouseover", function (event, d) { const country = d; paths .filter((data) => data.country === country) .attr("stroke", "#9370DB") .attr("stroke-width", 5); }) .on("mouseout", function (event, d) { paths .filter((data) => data.country === d) .attr("stroke", "gray") .attr("stroke-width", 1); }); // Hover effect for rightTextGroup (languages) rightTextGroup .on("mouseover", function (event, d) { const language = d; paths .filter((data) => data.language === language) .attr("stroke", "#9370DB") .attr("stroke-width", 5); }) .on("mouseout", function (event, d) { paths .filter((data) => data.language === d) .attr("stroke", "gray") .attr("stroke-width", 1); }); // Add original language label svg .append("text") .attr("x", margin.left + 10) .attr("y", margin.top - 15) .style("text-anchor", "start") .style("alignment-baseline", "hanging") .style("font-size", "12px") .style("fill", "black") .text("国"); // Add translated language label svg .append("text") .attr("x", width + margin.left - 130) .attr("y", margin.top) .style("text-anchor", "end") .style("alignment-baseline", "hanging") .style("font-size", "12px") .style("fill", "black") .text("翻訳語"); return svg.node(); }35:Tab7,function createMultiPieCharts() { // グラフの寸法を設定 const margin = { top: 150, right: 50, bottom: 100, left: 300 }; const width = 900 - margin.left - margin.right; const height = 900 - margin.top - margin.bottom; // SVG を作成 const svg = d3.create("svg").attr("viewBox", [0, 0, width, height]); // 各地域ごとに円グラフを描画 const regions = Array.from(new Set(dataset2.map((d) => d.area))); const numChartsPerRow = 3; // 1行あたりの円グラフの数 const paddingFactor = 1; regions.forEach((region, i) => { const row = Math.floor(i / numChartsPerRow); const col = i % numChartsPerRow; const chartWidth = width / numChartsPerRow; const chartHeight = height / Math.ceil(regions.length / numChartsPerRow); const radius = Math.min(chartWidth, chartHeight) / 2.5; const regionData = dataset2.filter((d) => d.area === region); const originalLanguageData = d3.group(regionData, (d) => d.original); const originalLanguageCounts = Array.from( originalLanguageData, ([original, translations]) => ({ original, count: translations.length }) ); originalLanguageCounts.sort((a, b) => d3.descending(a.count, b.count)); const pie = d3.pie().value((d) => d.count); const arc = d3.arc().innerRadius(0).outerRadius(radius); const chartGroup = svg .append("g") // .attr("transform", `translate(${col * chartWidth},${row * chartHeight})`); .attr( "transform", `translate(${col * chartWidth * paddingFactor},${ row * chartHeight * paddingFactor })` ); // 地域名を表示 chartGroup .append("text") .attr("x", chartWidth / 2) .attr("y", 20) .attr("text-anchor", "middle") .attr("fill", "black") .text(region) .attr("font-size", "8px"); const arcs = chartGroup .selectAll("arc") .data(pie(originalLanguageCounts)) .enter() .append("g") .attr("class", "arc") .attr("transform", `translate(${chartWidth / 2}, ${chartHeight / 2})`); arcs .append("path") .attr("d", arc) .attr("fill", (d) => colorScale2(d.data.original)); arcs .append("text") .attr("transform", (d) => `translate(${arc.centroid(d)})`) .attr("text-anchor", "middle") .attr("fill", "white") .attr("font-size", "5px") .text((d) => d.data.original); arcs .append("text") .attr("transform", (d) => `translate(${arc.centroid(d)})`) .attr("dy", "1.2em") .attr("text-anchor", "middle") .attr("fill", "white") .attr("font-size", "5px") .text((d) => d.data.count); }); return svg.node(); }36:T59a,37:[{"id":"0fe6ea7807f9c34caf4fef71ba870f6f03939091a4c50ad0cf164ab169836a48afa40e6da051ed2a861c51e021252e814e8e87b54877b333182f6bb442575eb3","href":"https://static.observableusercontent.com/files/0fe6ea7807f9c34caf4fef71ba870f6f03939091a4c50ad0cf164ab169836a48afa40e6da051ed2a861c51e021252e814e8e87b54877b333182f6bb442575eb3","name":"7495602E-8D18-43B5-968C-5D9DFC96C2F5_1_201_a.jpeg","type":"image/jpeg","lastModified":1706348989003.647,"size":88698},{"id":"afb1bef398435726ed990a674b2240b05e994ee5b833656c596cb3b8faaa4566c5519243ad4eccf79f07d06d44d2244f013c98f2751d4c24f3cc4cfeaf388af2","href":"https://static.observableusercontent.com/files/afb1bef398435726ed990a674b2240b05e994ee5b833656c596cb3b8faaa4566c5519243ad4eccf79f07d06d44d2244f013c98f2751d4c24f3cc4cfeaf388af2","name":"15907D20-944C-460E-B2FD-D1C9CA379A31_1_201_a.jpeg","type":"image/jpeg","lastModified":1706349061125.1,"size":92738},{"id":"440a8437ef0d8eaaf56de6b8fd5148facba007e16a99b43100b19f07bf5e495c8d774c609590ca8944ca4c6e6218a7d2bb9e833e50142d2500090e9e2212c86d","href":"https://static.observableusercontent.com/files/440a8437ef0d8eaaf56de6b8fd5148facba007e16a99b43100b19f07bf5e495c8d774c609590ca8944ca4c6e6218a7d2bb9e833e50142d2500090e9e2212c86d","name":"92D6E972-9822-4B22-B4CE-1340125134CD_1_201_a.jpeg","type":"image/jpeg","lastModified":1706355178840.271,"size":70357},{"id":"027949dedf53a4ed081ff81401544759897391ea457c91e03dd6094bcfcbaf5960bc1635a3cb2a5c07d514d6399e49160fbc720ba33c5bc7998dcbf6f73318e5","href":"https://static.observableusercontent.com/files/027949dedf53a4ed081ff81401544759897391ea457c91e03dd6094bcfcbaf5960bc1635a3cb2a5c07d514d6399e49160fbc720ba33c5bc7998dcbf6f73318e5","name":"92D6E972-9822-4B22-B4CE-1340125134CD_1_201_a@1.jpeg","type":"image/jpeg","lastModified":1706355255688.461,"size":75325},{"id":"f62cfaec04017b210d6382200342500d02fc691fef2aeaf631f7af4cbfe897e4d0d224ab6e7ddcaf4f7eadfad898b8db31ac2d471aecc1ac3675301664aa6893","href":"https://static.observableusercontent.com/files/f62cfaec04017b210d6382200342500d02fc691fef2aeaf631f7af4cbfe897e4d0d224ab6e7ddcaf4f7eadfad898b8db31ac2d471aecc1ac3675301664aa6893","name":"2E58B98C-A8DD-4AEC-812E-27954A9FAE36_1_201_a.jpeg","type":"image/jpeg","lastModified":1706355362949.359,"size":73991},{"id":"4fbc71a363fbc2459782554d4d1076fe548af66b027785930a891d1d262bd6f9c3a9b5be4233433f7a76d3560d9990e231590a642ebb7b52c797de83531fb782","href":"https://static.observableusercontent.com/files/4fbc71a363fbc2459782554d4d1076fe548af66b027785930a891d1d262bd6f9c3a9b5be4233433f7a76d3560d9990e231590a642ebb7b52c797de83531fb782","name":"2.jpg","type":"image/jpeg","lastModified":1706359641355.824,"size":272576},{"id":"2bafa9333a7fe16f18af6acefffe028a679d954f5ca49a418dbc46b375871b9b10287ef285cd9c416805a05b913cafc279c991ea1d044ced47773d7df8380e91","href":"https://static.observableusercontent.com/files/2bafa9333a7fe16f18af6acefffe028a679d954f5ca49a418dbc46b375871b9b10287ef285cd9c416805a05b913cafc279c991ea1d044ced47773d7df8380e91","name":"3.jpg","type":"image/jpeg","lastModified":1706359641710.831,"size":265181},{"id":"548b3eba1826099deab02e3d302a1c05b46688f11ddf6bf815b66810ec57c00cabbda3029d8355a0fb5b48df0f3850041f318cad9847667da7d2339c95b2efe8","href":"https://static.observableusercontent.com/files/548b3eba1826099deab02e3d302a1c05b46688f11ddf6bf815b66810ec57c00cabbda3029d8355a0fb5b48df0f3850041f318cad9847667da7d2339c95b2efe8","name":"g.jpg","type":"image/jpeg","lastModified":1706432931945.143,"size":266875},{"id":"659d295820e2c6190aac066c64ba29f46aef30b6367ece0c1f255806e7c13f1d3759485d33b4a81818789eb5ed3b9c92b08cd04850a6bbbb1ed509b394a07a99","href":"https://static.observableusercontent.com/files/659d295820e2c6190aac066c64ba29f46aef30b6367ece0c1f255806e7c13f1d3759485d33b4a81818789eb5ed3b9c92b08cd04850a6bbbb1ed509b394a07a99","name":"images-5.jpeg","type":"image/jpeg","lastModified":1706434108510.188,"size":84607},{"id":"659d295820e2c6190aac066c64ba29f46aef30b6367ece0c1f255806e7c13f1d3759485d33b4a81818789eb5ed3b9c92b08cd04850a6bbbb1ed509b394a07a99","href":"https://static.observableusercontent.com/files/659d295820e2c6190aac066c64ba29f46aef30b6367ece0c1f255806e7c13f1d3759485d33b4a81818789eb5ed3b9c92b08cd04850a6bbbb1ed509b394a07a99","name":"images-3.jpeg","type":"image/jpeg","lastModified":1706185289639.893,"size":84607},{"id":"505b179b15578e2f0a8dc8e6dd734cad6f9f9ded7a60da125b31aa6e229d3008c977e002eeff9f912f32ac7b5b0330cfec768d68e045225c80e0efa443f96346","href":"https://static.observableusercontent.com/files/505b179b15578e2f0a8dc8e6dd734cad6f9f9ded7a60da125b31aa6e229d3008c977e002eeff9f912f32ac7b5b0330cfec768d68e045225c80e0efa443f96346","name":"images-4.jpeg","type":"image/jpeg","lastModified":1706185422221.85,"size":15973}] 2f:{"title":"ノーベル文学賞作品が異なる言語圏でどのように受け入れられているか？","cells":[{"id":0,"value":"# ノーベル文学賞作品が異なる言語圏でどのように受け入れられているか？","pinned":false,"hidden":false,"mode":"md"},{"id":2763,"value":"

by Haruna Yamamoto

","pinned":false,"hidden":false,"mode":"md"},{"id":2155,"value":"

はじめに

","pinned":false,"hidden":false,"mode":"html"},{"id":616,"value":"{\n // 画像のURLを取得\n const imageUrl = await FileAttachment(\"images-5.jpeg\").url();\n return html`

\n『ハリー・ポッター』や『ロード・オブ・ザ・リング』など、国際的に愛される作品は、その普遍的なテーマや深いメッセージにより、様々な文化や言語圏で読者に受け入れられている。例えば、ハリー・ポッターシリーズは世界80か国語に翻訳され、各国の読者と共有されている。このような文学作品が異なる言語に翻訳される際、そのプロセスは単なる言語の移し替えに留まらず、文学の普遍性や文化の交流を探求する興味深い側面も含んでいる。一冊あたりの翻訳には2〜3ヶ月かかるとされ、この期間は単なる言葉の変換だけでなく、著者の意図や文学的な要素を正確に再現するための繊細な作業を要する。そのため、翻訳者は翻訳先の言語や文化に適した表現を見つけることにより、作品の本質を保ちながら読者にアプローチする必要がある。

\n\n特にノーベル文学賞は、その受賞作品が世界的に価値のある文学とされ、多くの作品が様々な言語に翻訳されている。例えば、2023年にノルウェー語で受賞した『だれか、来る』(ヨン・フォッセ)も既に和訳が公開されている。ただし、一方で翻訳されることが少ない言語も存在するだろう。

\n

そこで、この賞を受賞した作家たちの代表作品を探求し、異なる言語圏でどのように受け入れられているかについて調査する。\n

\n `;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1536,"value":"

言語における受賞数と話者数の関係

","pinned":false,"hidden":false,"mode":"html"},{"id":1543,"value":"

まずはじめに1901年から2023年まで、120人が受賞したノーベル文学賞の言語における受賞数と話者数の関係を調べた。

","pinned":false,"hidden":false,"mode":"md"},{"id":2218,"value":"

\nノーベル文学賞受賞言語と話者数\n

","pinned":false,"hidden":false,"mode":"md"},{"id":2238,"value":"$31","pinned":false,"hidden":false,"mode":"ojs"},{"id":1548,"value":"

散布図から弱い正の相関が見られる。このことから、一般的には話者数が多いほどノーベル文学賞を受賞しやすい傾向がある。一方で日本語・中国語は話者数に対し受賞数が少ないことがわかる。日本語・中国語やその他アジアの言語が少ないのは、ノーベル文学賞はスウェーデンのアカデミーによって授与されており、その審査プロセスが関係している可能性がある。では、受賞した作品はどのような言語圏に広まっているのだろうか。

","pinned":false,"hidden":false,"mode":"md"},{"id":1557,"value":"

原語と翻訳語の関係

","pinned":false,"hidden":false,"mode":"html"},{"id":1561,"value":"

\n データの収集方法\n

","pinned":false,"hidden":false,"mode":"html"},{"id":1567,"value":"

Google ブックスを用いて2000~2023年までのノーベル文学賞受賞者の代表作データを収集した。代表作は、一人ずつWikipediaなどで調べて決定した。代表作の元の言語、翻訳語、作者の出身国のデータを集め、スプレッドシートにまとめた。代表作は以下の通りである。

\n ","pinned":false,"hidden":false,"mode":"md"},{"id":2137,"value":"table2 = {\n var names = d3table.keys(dataset5[0]);\n const table = d3table.create(\"table\");\n\n table\n .append(\"thead\")\n .join(\"tr\")\n .selectAll(\"th\")\n .data(names)\n .join(\"th\")\n .text((d) => d)\n .style(\"background-color\", \"#f9f8f9\") // セルの背景色\n .style(\"color\", \"black\"); // 文字の色\n\n table\n .append(\"tbody\")\n .selectAll(\"tr\")\n .data(dataset5)\n .join(\"tr\")\n .selectAll(\"td\")\n .data((row) => d3table.entries(row))\n .join(\"td\")\n .text((d) => d.value);\n // テーブルを中央に寄せるスタイルを追加\n table.style(\"margin\", \"0 auto\");\n\n return table.node();\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":2107,"value":"

それらから、原語と翻訳語の関係を示すダイアグラムが下である。右の翻訳語は地域ごとに分類して色付けをしている。分類は、以下のようになっている。全体的にヨーロッパの地域への翻訳が多かったため、ヨーロッパは細分化して分類している。\n

","pinned":false,"hidden":false,"mode":"md"},{"id":2232,"value":"

\n地域の分類\n

","pinned":false,"hidden":false,"mode":"html"},{"id":2081,"value":"{\n const margin = { top: 20, right: -10, bottom: 40, left: 130 }; // 下の余白を広げる\n const width = 800 - margin.left - margin.right;\n const height = 250 - margin.top - margin.bottom;\n\n // SVG要素の作成\n const svg = d3\n .create(\"svg\")\n .attr(\"viewBox\", [\n 0,\n 0,\n width + margin.left + margin.right,\n height + margin.top + margin.bottom\n ]);\n const areaData = [\n \"中東・南アジア\",\n \"北欧\",\n \"南ヨーロッパ\",\n \"国際的\",\n \"東アジア\",\n \"東ヨーロッパ\",\n \"西ヨーロッパ\"\n ];\n const g = svg\n .append(\"g\")\n .selectAll(\"g\")\n .data(areaData)\n .join(\"g\")\n .attr(\"transform\", (d, i) => `translate(300, ${20 + i * 30})`);\n\n g.append(\"text\")\n .attr(\"x\", 20)\n .attr(\"dy\", 5)\n .text((d) => d);\n g.append(\"circle\").attr(\"r\", 10).attr(\"fill\", colorScale);\n return svg.node();\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":2382,"value":"

このグラフは言語のタブをホバーすることで一つ一つそのつながりを見ることができます。

","pinned":false,"hidden":false,"mode":"md"},{"id":2225,"value":"

\n原語と翻訳語の関係\n

","pinned":false,"hidden":false,"mode":"html"},{"id":2552,"value":"createGraph()","pinned":false,"hidden":false,"mode":"ojs"},{"id":1338,"value":"

このダイアグラムは、作品の原語と、翻訳語の関係を示すものである。特定の地域の言語への翻訳が少ない例が見られる。例えば、中国語の本は東ヨーロッパの言語の翻訳が少ない。フランス語の本は中東南アジアへの翻訳が少ない。反対にドイツ語の本は多くの地域の言語に翻訳されている。

","pinned":false,"hidden":false,"mode":"md"},{"id":2567,"value":"

中国語

","pinned":false,"hidden":false,"mode":"md"},{"id":2559,"value":"// 関数を呼び出して \"中国語\" のみを選択してグラフを表示する\ndisplayChineseGraph()","pinned":false,"hidden":false,"mode":"ojs"},{"id":2570,"value":"

フランス語

","pinned":false,"hidden":false,"mode":"md"},{"id":2563,"value":"displayFrenchGraph()","pinned":false,"hidden":false,"mode":"ojs"},{"id":2227,"value":"

\n作者の出身国と翻訳語の関係\n

","pinned":false,"hidden":false,"mode":"html"},{"id":2574,"value":"createCountryGraph()","pinned":false,"hidden":false,"mode":"ojs"},{"id":1342,"value":"

このダイアグラムは、作者の出身国と翻訳語の関係を示すものである。出身国と先ほどの原語の翻訳は対応していることが多い。しかし、同じ言語圏であっても出身国の地域によって、翻訳される地域も異なっている場合がある。例えば、カナダとイギリスは同じ英語圏である。しかし、イギリス出身の作者の本はほとんどの地域で受け入れられているのに対してカナダの作品は中東・南アジアの翻訳がないことがわかる。

","pinned":false,"hidden":false,"mode":"html"},{"id":2595,"value":"

カナダ

","pinned":false,"hidden":false,"mode":"md"},{"id":2582,"value":"displayCanadaGraph()","pinned":false,"hidden":false,"mode":"ojs"},{"id":2597,"value":"

イギリス

","pinned":false,"hidden":false,"mode":"md"},{"id":2591,"value":"displayukGraph()","pinned":false,"hidden":false,"mode":"ojs"},{"id":1904,"value":"

翻訳と地域

","pinned":false,"hidden":false,"mode":"html"},{"id":1916,"value":"

次に先ほどの分析から中国語の本は東ヨーロッパの言語の翻訳が少なかったり、フランス語の本は中東・南アジアへの翻訳が少ないことに着目して特定の地域に対する翻訳数が少ない理由を探る。下の円グラフは、地域ごとに翻訳された作品の原語を示すものである。

","pinned":false,"hidden":false,"mode":"html"},{"id":2230,"value":"

\n地域と翻訳されている原語の関係\n

","pinned":false,"hidden":false,"mode":"html"},{"id":2754,"value":"createMultiPieCharts()","pinned":false,"hidden":false,"mode":"ojs"},{"id":1897,"value":"

中国語からの翻訳が少なかった東ヨーロッパの地域で翻訳されていた原語の円グラフでは英語の本が一番多く翻訳されているとわかる。次に、ドイツ語やトルコ語などが続く。

","pinned":false,"hidden":false,"mode":"html"},{"id":1900,"value":"

次に、フランス語からの翻訳が少なかった中東・南アジアの地域の円グラフからトルコ語の本が一番多く翻訳されているとわかる。次に、ドイツ語やハンガリー語などが続いている。

","pinned":false,"hidden":false,"mode":"html"},{"id":1926,"value":"

このことからどちらも、地理的に近い地域の言語に翻訳されることが多いとわかる。また、トルコ語は東ヨーロッパ・中東南アジアともにランクインしている。これはトルコがヨーロッパとアジアの境界に位置しており、両方に文学的な影響を与えている可能性がある。

","pinned":false,"hidden":false,"mode":"html"},{"id":2291,"value":"","pinned":false,"hidden":false,"mode":"ojs"},{"id":1959,"value":"

まとめ

","pinned":false,"hidden":false,"mode":"html"},{"id":1962,"value":"

ノーベル文学賞が異なる言語圏でどのように受け入れられているかについて調査した。まず、出身国と原語の翻訳が対応している一方で、同じ言語圏でも出身国の地域によって翻訳される言語が異なることが確認された。これは文学的な影響や地域の特有の文化的背景が、翻訳の受け入れに影響を与えている可能性がある。\n

また、地理的な要素が翻訳の傾向に影響を与えていることも明らかになった。特定の地域で翻訳が少ない場合、それは地理的な距離や文学的な交流の程度に関係している可能性がある。
\n
以上の2点から、ノーベル文学賞作品は言語や地域の垣根を超えながらも、文学的な影響や地理的な要素が引き続き受け入れに影響を与えていることが分かる。

","pinned":false,"hidden":false,"mode":"html"},{"id":2129,"value":"
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
","pinned":false,"hidden":false,"mode":"html"},{"id":2795,"value":"

\n引用\n

","pinned":false,"hidden":false,"mode":"md"},{"id":626,"value":"$32","pinned":false,"hidden":false,"mode":"md"},{"id":2799,"value":"

\nデータ処理\n

","pinned":false,"hidden":false,"mode":"md"},{"id":974,"value":"language = [...d3.group(dataset2, (d) => d.language).keys()]","pinned":false,"hidden":false,"mode":"ojs"},{"id":875,"value":"original = [...d3.group(dataset2, (d) => d.original).keys()]","pinned":false,"hidden":false,"mode":"ojs"},{"id":27,"value":"dataset = d3.tsv(url, d3.autoType)","pinned":false,"hidden":false,"mode":"ojs"},{"id":267,"value":"dataset2 = d3.tsv(url2, d3.autoType)","pinned":false,"hidden":false,"mode":"ojs"},{"id":1787,"value":"dataset4 = d3.tsv(url3, d3.autoType)","pinned":false,"hidden":false,"mode":"ojs"},{"id":1842,"value":"dataset5 = d3.tsv(url4, d3.autoType)","pinned":false,"hidden":false,"mode":"ojs"},{"id":284,"value":"d3.group(dataset2, (d) => d.person)","pinned":false,"hidden":false,"mode":"ojs"},{"id":291,"value":"sortedGroupedData = new Map([...d3.group(dataset2, (d) => d.person).entries()])","pinned":false,"hidden":false,"mode":"ojs"},{"id":1365,"value":"d3.group(dataset2, (d) => d.language)","pinned":false,"hidden":false,"mode":"ojs"},{"id":763,"value":"originalGroupedData = new Map([\n ...d3.group(dataset2, (d) => d.original).entries()\n])","pinned":false,"hidden":false,"mode":"ojs"},{"id":264,"value":"d3.tsv(url2)","pinned":false,"hidden":false,"mode":"ojs"},{"id":260,"value":"url2 = \"https://docs.google.com/spreadsheets/d/e/2PACX-1vRaLU8zep7sIkNvry7Gc_5iPsyPpufCXN1NIVDl67b6-I0GvTA3idFnLpmf9k7ZJch02m6MaCTehiRy/pub?gid=1641949120&single=true&output=tsv\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":1785,"value":"url3 = \"https://docs.google.com/spreadsheets/d/e/2PACX-1vRaLU8zep7sIkNvry7Gc_5iPsyPpufCXN1NIVDl67b6-I0GvTA3idFnLpmf9k7ZJch02m6MaCTehiRy/pub?gid=348311192&single=true&output=tsv\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":1840,"value":"url4 = \"https://docs.google.com/spreadsheets/d/e/2PACX-1vRaLU8zep7sIkNvry7Gc_5iPsyPpufCXN1NIVDl67b6-I0GvTA3idFnLpmf9k7ZJch02m6MaCTehiRy/pub?gid=1017873942&single=true&output=tsv\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":22,"value":"url = \"https://docs.google.com/spreadsheets/d/e/2PACX-1vRaLU8zep7sIkNvry7Gc_5iPsyPpufCXN1NIVDl67b6-I0GvTA3idFnLpmf9k7ZJch02m6MaCTehiRy/pub?gid=462949775&single=true&output=tsv\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":24,"value":"d3.tsv(url)","pinned":false,"hidden":false,"mode":"ojs"},{"id":1363,"value":"d3.group(\n dataset2,\n (d) => d.original,\n (d) => d.language\n)","pinned":false,"hidden":false,"mode":"ojs"},{"id":2141,"value":"d3table = require(\"d3@5\")","pinned":false,"hidden":false,"mode":"ojs"},{"id":2299,"value":"import { tooltip } from \"@2023-tmu-dataviz/kouhakuhistory\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":2811,"value":"

ダイアグラム\n

\n","pinned":false,"hidden":false,"mode":"md"},{"id":1670,"value":"colorScale = d3\n .scaleOrdinal()\n // .domain([...original.keys()])\n .range([\n \"#FFB6C1\", // パステルピンク\n \"#FFD700\", // パステルイエロー\n \"#6B8E23\", // 裏葉色 (Urahairo) - パステルグリーン\n \"#4A84B8\", // パステルブルー\n \"#FFA07A\", // パステルオレンジ\n \"#9370DB\", // パステルパープル\n \"#9E7C70\" // 茶色\n ])","pinned":false,"hidden":false,"mode":"ojs"},{"id":1704,"value":"colorScale2 = d3\n .scaleOrdinal()\n .domain([\n \"トルコ語\",\n \"スウェーデン語\",\n \"ノルウェー語\",\n \"英語\",\n \"中国語\",\n \"ハンガリー語\",\n \"ロシア語\",\n \"ポーランド語\",\n \"ドイツ語\",\n \"フランス語\",\n \"スペイン語\"\n ])\n .range([\n \"#FFB6C1\",\n \"#FFD700\",\n \"#FFD700\",\n \"#4A84B8\",\n \"#FFA07A\",\n \"#9370DB\",\n \"#9370DB\",\n \"#9370DB\",\n \"#9E7C70\",\n \"#9E7C70\",\n \"#9E7C70\"\n ])","pinned":false,"hidden":false,"mode":"ojs"},{"id":1719,"value":"colorScale3 = d3\n .scaleOrdinal()\n\n .range([\n \"#FFB6C1\",\n \"#FFD700\",\n \"#FFD700\",\n \"#4A84B8\",\n \"#4A84B8\",\n \"#4A84B8\",\n \"#4A84B8\",\n \"#FFA07A\",\n \"#9370DB\",\n \"#9370DB\",\n \"#9370DB\",\n \"#9E7C70\",\n \"#9E7C70\",\n \"#9E7C70\"\n ])","pinned":false,"hidden":false,"mode":"ojs"},{"id":2416,"value":"$33","pinned":false,"hidden":false,"mode":"ojs"},{"id":2430,"value":"$34","pinned":false,"hidden":false,"mode":"ojs"},{"id":2578,"value":"function displayCanadaGraph() {\n const svgNode = createCountryGraph(); // グラフを作成\n\n // \"中国語\"以外のパスを非表示にする\n d3.select(svgNode)\n .selectAll(\".path\")\n .filter((d) => d.country !== \"カナダ\")\n .style(\"opacity\", 0);\n\n // \"中国語\"のテキストのホバーエフェクトをトリガー\n d3.select(svgNode)\n .selectAll(\".left-text-group\")\n .filter((d) => d !== \"カナダ\")\n .dispatch(\"mouseover\");\n\n return svgNode;\n}\n\n ","pinned":false,"hidden":false,"mode":"ojs"},{"id":2585,"value":"function displayukGraph() {\n const svgNode = createCountryGraph(); // グラフを作成\n\n // \"中国語\"以外のパスを非表示にする\n d3.select(svgNode)\n .selectAll(\".path\")\n .filter((d) => d.country !== \"イギリス\")\n .style(\"opacity\", 0);\n\n // \"中国語\"のテキストのホバーエフェクトをトリガー\n d3.select(svgNode)\n .selectAll(\".left-text-group\")\n .filter((d) => d !== \"イギリス\")\n .dispatch(\"mouseover\");\n\n return svgNode;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":2513,"value":"area = d3.group(dataset2, (d) => d.area)","pinned":false,"hidden":false,"mode":"ojs"},{"id":2555,"value":"// \"中国語\"のみを選択してグラフを表示する関数\nfunction displayChineseGraph() {\n const svgNode = createGraph(); // グラフを作成\n\n // \"中国語\"以外のパスを非表示にする\n d3.select(svgNode)\n .selectAll(\".path\")\n .filter((d) => d.original !== \"中国語\")\n .style(\"opacity\", 0);\n\n // \"中国語\"のテキストのホバーエフェクトをトリガー\n d3.select(svgNode)\n .selectAll(\".left-text-group\")\n .filter((d) => d !== \"中国語\")\n .dispatch(\"mouseover\");\n\n return svgNode;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":2561,"value":"// \"中国語\"のみを選択してグラフを表示する関数\nfunction displayFrenchGraph() {\n const svgNode = createGraph(); // グラフを作成\n\n // \"中国語\"以外のパスを非表示にする\n d3.select(svgNode)\n .selectAll(\".path\")\n .filter((d) => d.original !== \"フランス語\")\n .style(\"opacity\", 0);\n\n // \"中国語\"のテキストのホバーエフェクトをトリガー\n d3.select(svgNode)\n .selectAll(\".left-text-group\")\n .filter((d) => d !== \"フランス語\")\n .dispatch(\"mouseover\");\n\n return svgNode;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":2817,"value":"

\n円グラフ\n

","pinned":false,"hidden":false,"mode":"md"},{"id":2649,"value":"$35","pinned":true,"hidden":false,"mode":"ojs"},{"id":1513,"value":"$36","pinned":false,"hidden":false,"mode":"html"}],"files":"$W37","stdlib":"1","titling":"auto"}