2d:null 2e:["$","title",null,{"children":"메타크리틱 게임점수 지형도 - 종합편 | Humble Data Miner | Observable"}] 33:T64f,viewof selection_mixed_30 = Inputs.table(filtered_mixed_30,{ rows: 16, columns: ["platform", "title", "releasedate", "mscore", "uscore", "auscore", "avgscore", "diffscore"], header: {platform:"기종", title:"제목", releasedate:"출시일", mscore:"평론점수", uscore:"유저점수", auscore:"조정유저점수", avgscore:"평균=(평론+조정유저)/2", diffscore:"차이=평론-조정유저" }, width: {platform: 40, releasedate:80, mscore:80, uscore:80, auscore:80, avgscore:140, diffscore:140}, format: { mscore: x=>html`

${x.toFixed(0)}

`, uscore: x=>x.toFixed(1), diffscore: x=>x.toFixed(1), avgscore:x=>html`

${x.toFixed(1)}

`, auscore: x=>html`

${x.toFixed(0)}

`, title: x=> html`${x.split(";")[0]}`, platform: x=>html`

${x.toUpperCase()}

`, }, required: false });34:Te2e,mixed_chart = { const zoom = d3.zoom().scaleExtent([0.5, 64]).on("zoom", zoomed); const svg = d3.create("svg").attr("viewBox", [0, 0, width, height]); const gDot = svg.append("g"); const gGrid = svg.append("g"); const x = d3.scaleLinear().domain([0,110]).range([0, width]); const y = d3.scaleLinear().domain([0,11.0]).range([height, 0]); const xAxis = (g, x) => g.attr("transform", `translate(0,0)`).call(d3.axisBottom(x)); const yAxis = (g, y) => g.call(d3.axisRight(y)); const grid = (g, x, y) => g .attr("stroke", "currentColor") .attr("stroke-opacity", 0.1) .call(g => g .selectAll(".x") .data(x.ticks(12)) .join( enter => enter.append("line").attr("class", "x").attr("y2", height), update => update, exit => exit.remove() ) .attr("x1", d => 0.5 + x(d)) .attr("x2", d => 0.5 + x(d))) .call(g => g .selectAll(".y") .data(y.ticks(12 * height/width)) .join( enter => enter.append("line").attr("class", "y").attr("x2", width), update => update, exit => exit.remove() ) .attr("y1", d => 0.5 + y(d)) .attr("y2", d => 0.5 + y(d))); const defaultCircleOpacity = 0.3; const defaultTextOpacity = 0.7; const gCircle = gDot.selectAll("circle") .data(review_mixed_30) .join("circle") .attr("cx", d => x(d.mscore)) .attr("cy", d => y(d.uscore)) .attr("r", 5) .attr("fill", d => platform_color_map[d.platform]) .attr("fill-opacity", defaultCircleOpacity); const gText = gDot.selectAll("text") .data(review_mixed_30) .join("text") .attr("x", d => x(d.mscore)) .attr("y", d => y(d.uscore)) .attr("fill-opacity", defaultTextOpacity) .attr("visibility","hidden") .attr("font-weight","bold") .attr("text-anchor","start") .attr("transform", d=>`rotate(-39,${x(d.mscore)},${y(d.uscore)})`) .text(d=>d.title.split(";")[0]); const aLine = raw_review_mixed.lines.all; const aLinePoints = [[x(0),y(aLine[1])],[x(100),y(aLine[0]*100+aLine[1])]]; const gLine = gDot.append("path") .attr("stroke", "black").attr("d", d3.line()(aLinePoints)); const gLineText = gDot.append("text") .attr("x", aLinePoints[1][0]).attr("y", aLinePoints[1][1]) .text("전체평균선"); const gx = svg.append("g"); const gy = svg.append("g"); svg.call(zoom).call(zoom.transform, d3.zoomIdentity); function zoomed({transform}) { const zx = transform.rescaleX(x).interpolate(d3.interpolateRound); const zy = transform.rescaleY(y).interpolate(d3.interpolateRound); gDot.attr("transform", transform); gCircle.attr("r", x=> Math.sqrt(x.count)/2/transform.k) const tx = d=>x(d.mscore); gLine.attr("stroke-opacity", 1.0/transform.k); gText.attr("font-size", 11/transform.k).attr("dx",6/transform.k).attr("dy",x=>3/transform.k); gLineText.attr("opacity", 1.0/transform.k); gx.call(xAxis, zx); gy.call(yAxis, zy); gGrid.call(grid, zx, zy); } return Object.assign(svg.node(), { update(selection) { if (selection.length == 0) { gCircle .attr("fill-opacity", defaultCircleOpacity) .attr("fill", d => platform_color_map[d.platform]); gText.attr("visibility","hidden"); svg.call(zoom.transform, d3.zoomIdentity); } else { const selected = new Set(selection.map(x=>x.itemid)); gCircle.attr("fill-opacity", (d,i)=>selected.has(i)? defaultCircleOpacity: 0.01); gText.attr("visibility", (d,i)=>selected.has(i)? "visible":"hidden"); } } }); }35:T4dc,review_mixed_30 = { const data = raw_review_mixed const score = data.table; const a = data.lines["all"][0]; const b = data.lines["all"][1]; let records = score.map((x,i) => { const ms = x[4]; const aus = ((x[5]-b)/a).toFixed(2)*1; return { itemid: i, platform: platform_abbr_map[x[0]], title:x[1]+";"+x[0], releasedate:new Date(x[3]), mscore:ms, uscore:x[5], auscore:aus, avgscore:((aus+ms)/2).toFixed(2)*1, diffscore:(ms-aus).toFixed(2)*1, count: x[6], hashcode: hashCode(x[1]) % 30 } }); let uscore_map = {}; for(const r of records) { if(!uscore_map.hasOwnProperty(r.uscore)) uscore_map[r.uscore] = []; uscore_map[r.uscore].push(r.itemid); } // split adjacency a little to enhance title text visibility const backoff = 0.04; for(const k in uscore_map) { uscore_map[k].sort((ia,ib)=>records[ia].mscore - records[ib].mscore); if(uscore_map[k].length==0) continue; for(let cur = 0; cur < uscore_map[k].length-1; cur++) { if(Math.abs(records[uscore_map[k][cur+1]].mscore-records[uscore_map[k][cur]].mscore)\n### 제약사항\n* 기종은 6가지로 한정 (PC, PS4, PS5, XBOX-ONE, XBOX-SERIES, SWITCH)\n* 평론점수가 30개 이상 존재하는 게임으로 결과를 한정\n\n### 사용법\n* 테이블에서 헤더를 클릭해 제목, 기종, 출시일, 점수등으로 정렬 가능\n* 테이블에서 행을 선택하면 아래 산포도에 해당 게임과 제목을 강조함\n* 테이블에서 행을 선택할때 Shift키로 범위 선택 가능\n* 테이블에서 제목을 클릭해 해당 메타크리틱 사이트로 이동가능\n* 문자열 검색을 통해서 테이블 결과를 축약가능\n* 산포도에서 마우스 휠로 줌인아웃, 마우스 드래그로 영역이동 가능","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":160,"value":"viewof filtered_mixed_30 = Inputs.search(review_mixed_30, {\n placeholder: \"문자열 검색\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":85,"value":"$33","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":198,"value":"$34","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":413,"value":"
\n## 해석은 여러분의 몫이지만 제 요약은 다음과 같습니다\n* 평론점수는 상업적 성공의 예측값에 가깝다\n * EA 스포츠/FPS, WoW, 포켓몬, 동숲 등등 어쨌든 잘 팔린다\n* 유저점수가 낮은경우 게임내외적인 다양한 불편함을 반영한다\n * 감자서버, 핵, \"Uneducated\", PC강요, 과도한BM, 저성능, 버그, 재포장 등등\n* 유저점수가 높은 일부 경우는 팬덤을 반영한다\n * 조조의 기묘한 모험, 래리, 메가맨, 노모어히어로즈, 뱀파이어:마스커래이드\n* 평균선을 기준으로 좌상단은 밀도가 높고 꼬리가 짧다\n * 유저가 상대적으로 더 선호하는게임이 다양성이 높고 덜 편향적이다\n* 평균선을 기준으로 우하단의 밀도가 낮고 꼬리가 길다\n * 평론그룹이 상대적으로 더 선호하는 게임이 단편적이고 더 편향적이다","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":5,"value":"---","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":11,"value":"html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":18,"value":"raw_review_mixed = FileAttachment(\"mcgames_reviewcount_more_than_30@3.json\").json();","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":52,"value":"$35","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":176,"value":"href_mixed_30 = {\n let href_map = {};\n review_mixed_30.forEach((x,i)=> { href_map[x.title]=\"https://www.metacritic.com\"+raw_review_mixed.table[i][2]; } );\n return href_map;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":200,"value":"height = width","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":206,"value":"platform_color_map = {return {ps4:\"blue\", ps5:\"darkblue\",pc:\"gray\", xbo:\"green\", xb1:\"green\", xboxone:\"green\", xbs:\"darkgreen\", \"xbox-series-x\":\"darkgreen\", swt:\"red\", switch:\"red\"};}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":255,"value":"platform_abbr_map = { return {ps4:\"ps4\", ps5:\"ps5\", pc:\"pc\", xboxone:\"xb1\", \"xbox-series-x\":\"xbs\", switch:\"swt\"}; }","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":250,"value":"mixed_chart.update(selection_mixed_30)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":356,"value":"hashCode = function(str) {\n var hash = 0, i, chr;\n if (str.length === 0) return hash;\n for (i = 0; i < str.length; i++) {\n chr = str.charCodeAt(i);\n hash = ((hash << 5) - hash) + chr;\n hash |= 0; // Convert to 32bit integer\n }\n return hash;\n};","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W36","stdlib":"1","titling":"auto"}} 32:"$31:body"