31:T7b1,function showBillList() { const table = d3.create("div").attr("class", "table"); const maxCount = 3; function showInfo(d, i) { const cluster = d.cluster; const desc = d.desc; const billsCount = d.bills.length; const ratio = d.rate; const billList = d.bills.map((d, i) => { const lists = billInfo.resListVo.filter(bill => bill.billno == d.billNo); // const lists = bills.filter(bill => bill.의안번호 == d.billNo); const billdata = lists.length ? lists[0] : null; const 법률안명 = billdata ? billdata.billname : d.법안명; const 상세페이지 = "https://likms.assembly.go.kr/bill/billDetail.do?billId=" + billdata.billid; const committe = billdata.currcommitte; return `

= maxCount ? "hidden" : ""}>${ billChart(d.voteData, 20).outerHTML } ${법률안명}${ billdata.대표발의자 ? billdata.발의자정당 + " " + billdata.대표발의자 : "" } ${committe}`; }); const showbutton = d.bills.length > maxCount ? `

모두 보기 »

` : ""; const html = `유형 ${i}
${ billChart(clusterVotes[i]).outerHTML } ${desc .split(",") .map(d => d + "
") .join( "" )}

${billsCount}건 ${ratio}

${billList}${showbutton} `; return d.bills.length ? html : ""; } const cluster = table .selectAll("div.cluster") .data(filteredBills) .enter() .append("div") .attr("class", "cluster") .html((d, i) => showInfo(d, i)); return table.node(); }32:T90f,function billChart(voteData, size) { const series = d3.stack().keys(clusterVotes.columns.slice(1))(voteData); series.forEach(d => { d.forEach(item => { item.key = d.key; }); }); const margin = { left: 0, right: 0, top: 0, bottom: 0 }; const width = size ?? 50; const height = size ?? 50; const svg = d3 .select( DOM.svg( width + margin.left + margin.right, height + margin.top + margin.bottom ) ) .attr("class", "billchart"); const gSvg = svg .append("g") .attr("transform", "translate(" + margin.left + "," + margin.top + ")"); const xScale = d3 .scaleBand() .domain( clusterVotes[0].map(function(d) { return d.정당; }) ) .range([0, width]) .padding(0.01); const yScale = d3 .scaleLinear() .domain([0, d3.max(series, d => d3.max(d, d => d[1]))]) .range([height, 0]); const color = d3.scaleOrdinal(d3.schemeCategory10); function color2(key, party) { // console.log(key, party); if (key == "찬성") { if (party == "더불어민주당") return "#55A7DD"; if (party == "국민의힘") return "#DD6555"; if (party == "정의당") return "#E5C445"; } if (key == "반대") return "#666"; if (key == "기권") return "#ddd"; if (key == "불참") return "#fefefe"; } const rects = gSvg .selectAll("g") .data(series) .enter() .append("g"); //Color is assigned here because you want everyone for the series to be the same color // .attr("fill", d => color2(d.key)); rects .selectAll("rect") .data(d => d) .join("rect") .attr("fill", d => color2(d.key, d.data.정당)) .attr("x", (d, i) => xScale(d.data.정당)) .attr("y", d => yScale(d[1])) .attr("height", d => yScale(d[0]) - yScale(d[1])) .attr("width", xScale.bandwidth()); /*.on("mouseover", function(){d3.select(this).attr("fill", "purple")}) .on("mouseout", function(){d3.select(this).attr("fill", color(series.key))})*/ // const xAxis = gSvg // .append("g") // .attr("id", "xAxis") // .attr("transform", "translate(0," + height + ")") // .call(d3.axisBottom(xScale)); // const yAxis = gSvg // .append("g") // .attr("id", "yAxis") // .call(d3.axisLeft(yScale)); return svg.node(); }33:[{"id":"f1dd44558242ced83f699acf9f30ec45871236ebe6794f3d5d5618d0b3ee9c9fd42999f6ed5d9b05f9657e6784947de3d318b08e2fff28bcdaae624505ac0a94","href":"https://static.observableusercontent.com/files/f1dd44558242ced83f699acf9f30ec45871236ebe6794f3d5d5618d0b3ee9c9fd42999f6ed5d9b05f9657e6784947de3d318b08e2fff28bcdaae624505ac0a94","name":"partyInfo.csv","type":"text/csv","lastModified":1625786820999.361,"size":7950},{"id":"504ea4dca11a315f869bc72c157f0a70d5d209ba644bac5450fe61e026c93c3b08ebe8efa88842006112529331ba5e774d882195cf4b78336d742f97f7339f33","href":"https://static.observableusercontent.com/files/504ea4dca11a315f869bc72c157f0a70d5d209ba644bac5450fe61e026c93c3b08ebe8efa88842006112529331ba5e774d882195cf4b78336d742f97f7339f33","name":"IMG_2575.jpg","type":"image/jpeg","lastModified":1625719796260.785,"size":219866},{"id":"10eb2084bd95c196c7a9c43188bf5694dbfcef5417d94961c46e524ce5853c708b02b894f98010f14b32978a9648c8f297b83271d90b3e6357e425fbac6655a8","href":"https://static.observableusercontent.com/files/10eb2084bd95c196c7a9c43188bf5694dbfcef5417d94961c46e524ce5853c708b02b894f98010f14b32978a9648c8f297b83271d90b3e6357e425fbac6655a8","name":"legistlations.csv","type":"text/csv","lastModified":1625646696336.178,"size":4382355},{"id":"3b5791578b5c7975f33004af688cb72d752598f58d153daae4e5d70098de4e990c293ea04b4d3687e150c3f4dd455a694d22b14c8cc783de2ff928bd69c7ef54","href":"https://static.observableusercontent.com/files/3b5791578b5c7975f33004af688cb72d752598f58d153daae4e5d70098de4e990c293ea04b4d3687e150c3f4dd455a694d22b14c8cc783de2ff928bd69c7ef54","name":"Screen Shot 2021-07-07 at 9.43.07 AM.png","type":"image/png","lastModified":1625646822948.757,"size":545842},{"id":"b45e5c108a59d70134774b83daae341f9a1558965fedbf751b71a4068f8a9c9089535c0ed84e38f8e2fdbf91ed1c6dcfff65773106ba94f32f316fe081b98146","href":"https://static.observableusercontent.com/files/b45e5c108a59d70134774b83daae341f9a1558965fedbf751b71a4068f8a9c9089535c0ed84e38f8e2fdbf91ed1c6dcfff65773106ba94f32f316fe081b98146","name":"Screen Shot 2021-07-07 at 5.43.25 PM.png","type":"image/png","lastModified":1625647444739.672,"size":1493496},{"id":"06bac3cf8615f335cd08bd5c6d58f45c7d88c7de09f8243d063f72f225a85199eea7c5c9b1f1104b79cab572cc6f45141569bd6430dc01eabf4eb973679ea054","href":"https://static.observableusercontent.com/files/06bac3cf8615f335cd08bd5c6d58f45c7d88c7de09f8243d063f72f225a85199eea7c5c9b1f1104b79cab572cc6f45141569bd6430dc01eabf4eb973679ea054","name":"Screen Shot 2021-07-07 at 9.43.44 AM.png","type":"image/png","lastModified":1625647525898.223,"size":537406},{"id":"cd792592e4d620c33dbf121943e4590822236b78b4e2f46149388a57f712defde35707de65efd4371f1dc97e7358cf90c2dfacb61341b1a4eae799c368d3c0c2","href":"https://static.observableusercontent.com/files/cd792592e4d620c33dbf121943e4590822236b78b4e2f46149388a57f712defde35707de65efd4371f1dc97e7358cf90c2dfacb61341b1a4eae799c368d3c0c2","name":"billInfo (1).json","type":"application/json","lastModified":1625664380322.716,"size":380793},{"id":"58bf0065e89d9c1995340a3d03d0b8f254dd04a0b31e718211f6a1166c6020740f7df3922b32df8148bd5fd5550f3883af567dfd3225e8de2e31fa45d03a4cbf","href":"https://static.observableusercontent.com/files/58bf0065e89d9c1995340a3d03d0b8f254dd04a0b31e718211f6a1166c6020740f7df3922b32df8148bd5fd5550f3883af567dfd3225e8de2e31fa45d03a4cbf","name":"tidyVoteData (1).csv","type":"text/csv","lastModified":1625668526549.595,"size":20963599},{"id":"654a1a558084104ffb46685198a0034da37927e10d44fff5dcd9823742ee32a3c4377fca60cd5904f382cc6680b734f801799053139de6ab6265e6fd3337de20","href":"https://static.observableusercontent.com/files/654a1a558084104ffb46685198a0034da37927e10d44fff5dcd9823742ee32a3c4377fca60cd5904f382cc6680b734f801799053139de6ab6265e6fd3337de20","name":"clusteredBills2 (3).json","type":"application/json","lastModified":1625669038187.317,"size":618967}] 2f:{"title":"정당별 표결에 따른 법안 분류","cells":[{"id":0,"value":"md`# 정당별 표결에 따른 법안 분류\n21대 국회 법안 표결 데이터를 통해 정당의 지향 확인하기`","pinned":false,"hidden":false,"mode":"ojs"},{"id":2,"value":"md`### 자료 출처\n국회의안정보시스템\nhttps://likms.assembly.go.kr/bill/billVoteResult.do#21__________`","pinned":false,"hidden":false,"mode":"ojs"},{"id":42,"value":"md`\n### 법안 유형\n

${Object.assign(await FileAttachment(\"IMG_2575.jpg\").image(), {\n alt: '법안 벡터',\n style: 'width: 100%; max-width: 600px;'\n})}\n* 각 정당의 표결 결과를 피처로 법안을 유형화 할 수 있다.\n* 대부분(87%) 법안은 모든 정당이 찬성한다. 이념적, 당리적 차이가 거의 없다.\n* 더불어민주당은 모든 법안에 찬성한다. 단 하나 국민의힘에서 발의한 \"공수처법\" 개정안이 본래의 취지와 어긋나 반대한다.\n* 소수정당인 정의당은 지향에 따라 찬성, 반대를 하는 것이 기본이나. 법안의 지향 방향은 동의하지만 목표가 부족하면 기권하는 방식으로 메시지를 전달하는 것으로 생각된다.\n* 각 정당의 이념적 지향을 보려면 표결에서 차이를 보이는 법안을 직접 살펴보아야 한다.\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":387,"value":"md`#### 필터`","pinned":false,"hidden":false,"mode":"ojs"},{"id":241,"value":"viewof searchKeyword = Inputs.text({\n placeholder: \"법안 검색\"\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":369,"value":"viewof filterVar = Inputs.select(filterOptions, { value: \"국민의힘-찬성\" })","pinned":false,"hidden":false,"mode":"ojs"},{"id":351,"value":"viewof varRange = rangeSlider({\n min: 0,\n max: 1,\n // Note that values must be specified as array of length 2.\n value: this ? this.value : [0, 0.1],\n // Custom slider CSS, replaces all styles.\n // theme: theme_Flat,\n // Overrides the range color. Support for range colors is up to the theme.\n // color: '#364a5e',\n format: \".0%\"\n // title: '범위'\n // description: 'Hue filter',\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":319,"value":"showBillList()","pinned":false,"hidden":false,"mode":"ojs"},{"id":22,"value":"md`## 법안 분류 방법\n1. 법안 별로 더불어민주당,국민의힘,정의당 의원의 각 표결 비율(불참율, 참석자 중 찬성,반대,기권 비율)과 의결 결과(가결,부결)를 벡터로 만들어\n2. 9개로 계층 클러스터링 함\n\n#### 전처리\n의안별 표결 결과와 의원별 표결 정보를 합쳐 모든 의원의 모든 의안 표결 결과를 tidy 데이터 형태로 정리\n\n#### 법안의 정당별 표결율 계산\n

${Object.assign(\n await FileAttachment(\"Screen Shot 2021-07-07 at 9.43.07 AM.png\").image(),\n { alt: '법안 벡터', style: 'width: 100%; max-width: 440px;' }\n)}\n\n#### 법안 벡터 매트릭스\n

${Object.assign(\n await FileAttachment(\"Screen Shot 2021-07-07 at 5.43.25 PM.png\").image(),\n { alt: '법안 벡터', style: 'width: 100%; max-width: 440px;' }\n)}\n\n#### 계층적 클러스터링 (예시)\n

${Object.assign(\n await FileAttachment(\"Screen Shot 2021-07-07 at 9.43.44 AM.png\").image(),\n { alt: '법안 벡터', style: 'width: 100%; max-width: 440px;' }\n)}\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":532,"value":"clusterVotes[0]","pinned":true,"hidden":false,"mode":"ojs"},{"id":126,"value":"$31","pinned":false,"hidden":false,"mode":"ojs"},{"id":131,"value":"html``","pinned":false,"hidden":false,"mode":"ojs"},{"id":409,"value":"filteredBills = {\n const vars = filterVar.split(\"-\");\n const var1 = vars[0];\n const var2 = vars[1];\n // console.log(var1, var2);\n return clusteredBills.map(c => ({\n ...c,\n bills: c.bills.filter(\n bill =>\n bill[var1][var2] >= varRange[0] &&\n bill[var1][var2] <= varRange[1] &&\n (searchKeyword == \"\" ? true : bill.법안명.match(searchKeyword))\n )\n }));\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":371,"value":"filterOptions = [\"더불어민주당\", \"국민의힘\", \"정의당\"]\n .map(d => [\"불참\", \"찬성\", \"반대\", \"기권\"].map(v => d + \"-\" + v))\n .flat()","pinned":false,"hidden":false,"mode":"ojs"},{"id":418,"value":"clusteredBills.forEach(c =>\n c.bills.forEach(bill => {\n const 대표발의자 = billIdx.get(bill.billNo)\n ? billIdx.get(bill.billNo).대표발의자\n : \"\";\n const 정당 = partyIdx.get(대표발의자) ? partyIdx.get(대표발의자).정당 : \"\";\n bill.대표발의자 = 대표발의자;\n bill.발의자정당 = 정당;\n bill.voteData = [\"더불어민주당\", \"국민의힘\", \"정의당\"].map(d => ({\n 정당: d,\n ...bill[d]\n }));\n })\n)","pinned":false,"hidden":false,"mode":"ojs"},{"id":13,"value":"clusteredBills = FileAttachment(\"clusteredBills2 (3).json\").json()","pinned":false,"hidden":false,"mode":"ojs"},{"id":86,"value":"clusterVotes = {\n const data = clusteredBills.map(d => {\n const parties = [\"더불어민주당\", \"국민의힘\", \"정의당\"];\n return parties.map(party => {\n const partyVote = d[party];\n const 불참 = d3.mean(d.bills.map(b => b[party].불참));\n const 투표 = d3.mean(d.bills.map(b => 1 - b[party].불참));\n const 찬성 = d3.mean(\n d.bills.map(b => b[party].찬성 * (1 - b[party].불참))\n );\n const 반대 = d3.mean(\n d.bills.map(b => b[party].반대 * (1 - b[party].불참))\n );\n const 기권 = d3.mean(\n d.bills.map(b => b[party].기권 * (1 - b[party].불참))\n );\n\n return { 정당: party, 찬성, 반대, 기권, 불참 };\n });\n });\n data.columns = [\"정당\", \"찬성\", \"기권\", \"반대\", \"불참\"];\n return data;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":430,"value":"absenceData = clusteredBills\n .map(d => d.bills)\n .flat()\n .map(d => ({ 불참: d.국민의힘.불참 }))","pinned":false,"hidden":false,"mode":"ojs"},{"id":499,"value":"absenceData.filter(d => d.불참 < 0.1).length / 915","pinned":false,"hidden":false,"mode":"ojs"},{"id":502,"value":"d3.mean(absenceData.filter(d => d.불참 <= 1).map(d => 1 - d.불참))","pinned":false,"hidden":false,"mode":"ojs"},{"id":530,"value":"clusterVotes.columns.slice(1)","pinned":true,"hidden":false,"mode":"ojs"},{"id":90,"value":"$32","pinned":false,"hidden":false,"mode":"ojs"},{"id":78,"value":"parties = votesByParties.map(d => d.정당)","pinned":false,"hidden":false,"mode":"ojs"},{"id":456,"value":"billIdx = d3.index(bills, d => d.의안번호)","pinned":false,"hidden":false,"mode":"ojs"},{"id":453,"value":"partyIdx = d3.index(partyInfo, d => d.이름)","pinned":false,"hidden":false,"mode":"ojs"},{"id":450,"value":"partyInfo = FileAttachment(\"partyInfo.csv\").csv()","pinned":false,"hidden":false,"mode":"ojs"},{"id":517,"value":"votesByPerson = d3\n .groups(tidyVoteData, d => d.의원)\n .map(d => ({\n 의원: d[0],\n 정당: d[1][0].정당,\n 참석률: 1 - d[1].filter(v => v.투표 == \"불참\").length / d[1].length,\n data: d[1]\n }))\n .sort((a, b) => d3.ascending(a.참석률, b.참석률))","pinned":false,"hidden":false,"mode":"ojs"},{"id":68,"value":"votesByBills = d3\n .groups(tidyVoteData, d => d.billNo, d => d.정당)\n .map(d => ({\n billNo: d[0],\n data: d[1]\n }))","pinned":false,"hidden":false,"mode":"ojs"},{"id":48,"value":"votesByParties = d3\n .groups(tidyVoteData, d => d.정당, d => d.의원)\n .map(d => ({ 정당: d[0], 의원: d[1].map(p => ({ 의원: p[0], data: p[1] })) }))\n .sort((a, b) => d3.descending(a.의원.length, b.의원.length))","pinned":false,"hidden":false,"mode":"ojs"},{"id":15,"value":"tidyVoteData = FileAttachment(\"tidyVoteData (1).csv\").csv()","pinned":false,"hidden":false,"mode":"ojs"},{"id":476,"value":"{\n bills.forEach(d => {\n const 정당 = partyIdx.get(d.대표발의자)\n ? partyIdx.get(d.대표발의자).정당\n : \"\";\n d.발의자정당 = 정당;\n });\n billInfo.resListVo.map(d => {\n const match = bills.filter(bill => bill.의안번호 == d.billno);\n d.대표발의자 = match.length ? match[0].대표발의자 : \"\";\n d.발의자정당 = match.length ? match[0].발의자정당 : \"\";\n });\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":485,"value":"billInfo.resListVo.filter(d => d.billname.match(searchKeyword))","pinned":false,"hidden":false,"mode":"ojs"},{"id":18,"value":"bills = {\n const bills = await FileAttachment(\"legistlations.csv\").csv();\n return bills.map(d => {\n const billid = d.제안자목록링크.split(\"=\")[1];\n d.상세페이지 =\n \"https://likms.assembly.go.kr/bill/billDetail.do?billId=\" + billid;\n return d;\n });\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":163,"value":"billInfo = FileAttachment(\"billInfo (1).json\").json()","pinned":false,"hidden":false,"mode":"ojs"},{"id":176,"value":"billInfo.resListVo.filter(d => d.billname.match(\"고위공직자\"))","pinned":false,"hidden":false,"mode":"ojs"},{"id":233,"value":"import { search, Button, Select, Radio, Range } from \"@observablehq/inputs\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":352,"value":"import { rangeSlider } from '@mootari/range-slider'","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W33","stdlib":"1","titling":"auto"}