36:["$","title",null,{"children":"Distribuição Ideológica de Deputados Federais Eleitos em 2018 por Estado | Guilherme Carvalho da SIlva | Observable"}] 3e:T768,chart = { const svg = d3.create('svg') .attr('viewBox',[0,0,width, noSplitHeight + margin.top + margin.bottom]); const wrapper = svg.append('g') .attr('transform', `translate(${margin.left}, ${margin.top})`); wrapper.append('g') .call(xAxis) const yAxisContainer = wrapper.append('g') .attr('transform', `translate(-10,10)`); const circles = wrapper.append('g') .attr('className', 'circles') .selectAll('circle') .data(groupData) .join('circle') .attr('r', d => r(d.votos)) .attr('fill', d => color(d.ideologia)) .attr('x', d => Math.floor(Math.random() * 100)) .attr('y', d => y(d.partido)) .call(text => text.append('title').text(d => d.nome + '\nIdeologia: ' + d.ideologia + '\nPartido: ' + d.partido + '\nEstado: ' + d.estado)) force.on('tick', () => { circles .transition() .ease(d3.easeLinear) .attr('cx', d => d.x) .attr('cy', d => d.y); }) invalidation.then(() => force.stop()); return Object.assign(svg.node(), { update(split) { let height = split ? splitHeight : noSplitHeight; let partidos = [...groupPartido.keys()].sort() const t = d3.transition().duration(750); svg.transition(t).attr('viewBox', [0, 0, width, height]); y.domain(split ? partidos : ['Todos']); y.range(split ? [splitHeight - margin.top - margin.bottom, 0] : [noSplitHeight - margin.top - margin.bottom, 0]); yAxisContainer.call(yAxis, y, split ? partidos : ['Todos']) .call(g => g.select('.domain').remove()) .call(g => g.selectAll('.tick line').remove()); force.force('y', split ? d3.forceY(d => y(d.partido) + 45) : d3.forceY((noSplitHeight - margin.top - margin.bottom) / 2)); force.alpha(1).restart(); console.log(height) } }) }3f:Ta11,donutChart = { let arcs, svg; arcs = pie( data.filter(d => d.Estado == state) ); svg = d3 .create("svg") .attr("viewBox", [-width / 2, -height / 2, width, height]); svg.append("g") .attr("stroke", "white") .selectAll("path") .data(arcs) .join("path") .attr("fill", d => color(d.data.Ideologia)) .attr("d", arc) .on('mouseenter', onMouseEnter) .on('mouseleave', onMouseLeave) .append("title") .text(d => `Partido: ${d.data.Partido}\nPorcentagem de Votos: ${d.data.percent.toLocaleString() + "%"}`); var legend = svg.selectAll('.legend') //the legend and placement .data(color.domain()) .enter() .append('g') .attr('class', 'circle-legend') .attr('transform', function (d, i) { var height = legendRectSize + legendSpacing; var offset = height * color.domain().length / 2; var horz = -2 * legendRectSize - 13; var vert = i * height - offset/1.5; return 'translate(' + horz + ',' + vert + ')'; }); legend.append('circle') //keys .style('fill', color) .style('stroke', color) .attr('cx', 0) .attr('cy', 0) .attr('r', '.2rem'); legend.append('text') //labels .attr('x', legendRectSize + legendSpacing) .attr('y', legendRectSize - legendSpacing) .text(function (d) { return d; }); //return svg.node() const chart = svg.node(); const tooltip = d3.create("div") .attr("id", "tooltip") .attr("class", "tooltip") .html(` `); function onMouseEnter(d) { const x = arc.centroid(d)[0] + (width / 2); const y = arc.centroid(d)[1] + (height / 2); d3.select(this).transition() .duration('50') .attr('opacity', '.85') tooltip.style("opacity", 1); tooltip.style("transform", `translate(calc( -50% + ${x}px), calc(-100% + ${y}px))`); tooltip.select("#Ideologia") .text(d.data.Ideologia); tooltip.select("#percent") .text(d.data.percent); } function onMouseLeave() { d3.select(this).transition() .duration('50') .attr('opacity', '1'); tooltip.style("opacity", 0); } return html`

${chart}

` }40:[{"id":"9a3a08fa43c0daee0393166890cad933f1a18566f3be0c469d1cd773a1393e9beeaae6310e2f626b1e9253de497dc296bf64026a78933dde6b8daf30577fe7a1","href":"https://static.observableusercontent.com/files/9a3a08fa43c0daee0393166890cad933f1a18566f3be0c469d1cd773a1393e9beeaae6310e2f626b1e9253de497dc296bf64026a78933dde6b8daf30577fe7a1","name":"deputados_votos.csv","type":"text/csv","lastModified":1617497835076.553,"size":25528},{"id":"8449cd9752098a04c3d864e212edf37634b5273219eabfc4753343a94e83b4d248e8761a2b93983d75af533a5316a066152e6cf4a8dc719772993ed199630c64","href":"https://static.observableusercontent.com/files/8449cd9752098a04c3d864e212edf37634b5273219eabfc4753343a94e83b4d248e8761a2b93983d75af533a5316a066152e6cf4a8dc719772993ed199630c64","name":"percent_estado@2.csv","type":"text/csv","lastModified":1617516108704.146,"size":12053},{"id":"b95e60c02e8439a9534fc033d572fd238a2b0047c420efe695977c67c08521ebda45d235693d16005405c32abf59e97840f38574d4a75425f079149e9cdb8424","href":"https://static.observableusercontent.com/files/b95e60c02e8439a9534fc033d572fd238a2b0047c420efe695977c67c08521ebda45d235693d16005405c32abf59e97840f38574d4a75425f079149e9cdb8424","name":"deputados.csv","type":"text/csv","lastModified":1617497901394.094,"size":10288},{"id":"f476552c82d87931fdeae2f63a81f9686b8dffd5c4cfb673ad12fa4acf38f58f0d30dd15a64706cacf6e40f0afd4074f2f430239bd58b4f6e45fd64f807b1a2e","href":"https://static.observableusercontent.com/files/f476552c82d87931fdeae2f63a81f9686b8dffd5c4cfb673ad12fa4acf38f58f0d30dd15a64706cacf6e40f0afd4074f2f430239bd58b4f6e45fd64f807b1a2e","name":"percent_estado.csv","type":"text/csv","lastModified":1617497778806.986,"size":27980},{"id":"d5d2dedce25be7fe4e1b290c3211339a6dfb12af107baf9baf565ff21e6fce9e31528bc5afada00176577a44e206fa5c5763651d482d54fd08e88c34cc8009ab","href":"https://static.observableusercontent.com/files/d5d2dedce25be7fe4e1b290c3211339a6dfb12af107baf9baf565ff21e6fce9e31528bc5afada00176577a44e206fa5c5763651d482d54fd08e88c34cc8009ab","name":"IdeologiaPartidos.csv","type":"text/csv","lastModified":1617497895142.675,"size":429}] 3a:{"id":"465a09d977c44fb3","slug":"distribuicao-ideologica-de-deputados-federais-eleitos-em/3","title":"Distribuição Ideológica de Deputados Federais Eleitos em 2018 por Estado","thumbnail":"382bca165acdd4ee207e8d947db4b166efba5a206f01cf16399c142de6cd11d0","access_level":"public","create_time":"$D2021-04-04T00:34:35.690Z","update_time":"$D2021-04-04T21:24:20.601Z","view_time":null,"first_public_time":"$D2021-04-04T06:05:55.705Z","has_unpublished_edits":null,"fork":false,"stars":1,"starred":false,"owner":{"type":"team","id":"f4f03875c0fc7eea","login":"kylestorm1812","name":"Guilherme Carvalho da SIlva","avatar_url":"https://avatars-next.observableusercontent.com/8544cafb35754275356aceb16a9a00462295f4080035de43056116cc1008376f","tier":"starter_2024","bio":"Electrical Engineer Student at the Federal University of Ceará, Brasil, interested in polishing its programming skills for Data Science and Machine Learning","followed_by_you":false,"follows_you":false},"version":386,"publish_version":386,"role":null,"authored":false,"authors":[{"type":"individual","id":"3df5af99ba62dc39","login":"kylestorm1812","name":"Guilherme Carvalho da SIlva","avatar_url":"https://avatars-next.observableusercontent.com/8544cafb35754275356aceb16a9a00462295f4080035de43056116cc1008376f","tier":null,"bio":"Electrical Engineer Student at the Federal University of Ceará, Brasil, interested in polishing its programming skills for Data Science and Machine Learning","followed_by_you":false,"follows_you":false}],"members":[{"type":"individual","id":"3df5af99ba62dc39","login":"kylestorm1812","name":"Guilherme Carvalho da SIlva","avatar_url":"https://avatars-next.observableusercontent.com/8544cafb35754275356aceb16a9a00462295f4080035de43056116cc1008376f","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":1,"collection":null,"type":"notebook","body":{"titling":"auto","title":"Distribuição Ideológica de Deputados Federais Eleitos em 2018 por Estado","cells":[{"id":0,"value":"md`# Distribuição Ideológica de Deputados Federais Eleitos em 2018 por Estado`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":85,"value":"\nviewof split = {\n // https://observablehq.com/@mbostock/form-input\n const form = html``;\n form.oninput = () => form.value = Array.from(form.querySelectorAll(\"input\"))\n .find(d => d.checked).value === \"1\"\n\n \n form.oninput();\n return form;\n \n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":82,"value":"$3e","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":344,"value":"viewof state = select(['SC', 'MG', 'RJ', 'RO', 'BA', 'AP', 'SE', 'SP', 'RR', 'PI', 'GO',\n 'RN', 'PA', 'MS', 'MA', 'PR', 'AC', 'MT', 'AM', 'PB', 'AL', 'RS', 'CE',\n 'PE', 'DF', 'ES'])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":275,"value":"$3f","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":351,"value":"md `## Dados Donut Chart`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":271,"value":"data = await FileAttachment('percent_estado@2.csv').csv()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":265,"value":"arc = d3.arc()\n .innerRadius(radius - donutWidth)\n .outerRadius(radius);","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":263,"value":"pie = d3.pie()\n .sort(null)\n .value(d => d.percent)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":260,"value":"function pathEnter() {\n\n d3.select(this).transition()\n .duration('50')\n .attr('opacity', '.85');\n\n\n }","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":259,"value":"function pathOut() {\n d3.select(this).transition()\n .duration('50')\n .attr('opacity', '1');\n\n }","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":257,"value":"height = Math.min(width, 500)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":255,"value":"radius = Math.min(width, height) / 3","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":251,"value":"donutWidth = 60","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":250,"value":"legendRectSize = 13;","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":248,"value":"legendSpacing = 5;","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":236,"value":"md`## Dados Bubble Chart`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":80,"value":"y = d3.scaleBand()\n .domain(['Todos'])\n .range([noSplitHeight, 0])","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":78,"value":"force = d3.forceSimulation(groupData)\n .force('charge', d3.forceManyBody().strength(0))\n .force('x', d3.forceX().x(d => {\n switch(d.ideologia){\n case 'Esquerda':\n return Math.floor(Math.random() * (350 - 50 + 1)) + 50\n break;\n case 'Centro':\n return Math.floor(Math.random() * (550 - 380 + 1)) + 380\n break;\n case 'Direita':\n return Math.floor(Math.random() * (860 - 580 + 1)) + 580\n break;\n }\n }))\n .force('y', d3.forceY(d => y(d.partido)))\n .force('collision', d3.forceCollide().radius(d => r(d.votos) + 1))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":76,"value":"x = d3.scalePoint().domain(['Esquerda', 'Centro', 'Direita']).padding(0.1).range([30, 850]).round(true)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":74,"value":"xAxis = g => g\n .call(d3.axisTop(x)\n .tickFormat(d => d))\n .call(g => g.select('.domain').remove())\n .call(g => g.append('text')\n .attr('x', 1000)\n .attr('y', 300)\n .attr('font-weight', 'bold')\n .attr('fill', 'currentColor')\n .attr('text-anchor', 'end'))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":73,"value":"yAxis = g => g\n .call(d3.axisLeft(y).ticks(8))\n .call(g => g.select('.domain').remove())\n .call(g => g.selectAll('.tick line').remove())\n .attr('y', 1000)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":64,"value":"margin = ({top: 30, right: 30, left: 100, bottom: 30})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":62,"value":"groupEstado = d3.group(groupData, d => d.estado)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":60,"value":"groupPartido = d3.group(groupData, d => d.partido)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":58,"value":"chart.update(split)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":56,"value":"width = 1200","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":54,"value":"noSplitHeight = 500","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":52,"value":"splitHeight = 2000","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":50,"value":"r = d3.scaleSqrt()\n .domain(d3.extent(groupData, d => d.votos))\n .range([3, 8])","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":48,"value":"innerWidth = width - margin.left - margin.right","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":46,"value":"//const colorLeft = \"#ef3b2c\"\n//onst colorRight = \"#4292c6\"\n//const colorCenter = \"#8a00e6\"\n\n\ncolor = d3.scaleOrdinal()\n .domain([\"Esquerda\", \"Centro\", \"Direita\"])\n .range([\"#ef3b2c\", \"#4292c6\", \"#8a00e6\"])","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":36,"value":"groupData = deputadosData.map(d => {\n let partidoDeputado = ''\n let votosNumber = 0;\n let estadoDeputado = ''\n const result = ideologiaPartidos.find(element => element.partido === d.partido)\n const votos = votosData.find(element => element.nome.normalize(\"NFD\").replace(/[\\u0300-\\u036f]/g, \"\") === d.nome)\n console.log(votos)\n if(typeof(votos) !== 'undefined'){\n votosNumber = votos.votosRecebidos\n partidoDeputado = votos.partido\n estadoDeputado = votos.estado\n }\n return {nome: d.nome, partido: d.partido, estado: estadoDeputado, ideologia: result.ideologia, votos: votosNumber, partido: partidoDeputado}\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":30,"value":"md`## Variáveis`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":33,"value":"percentData = await FileAttachment('percent_estado.csv').csv()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":26,"value":"deputadosData = d3.csvParse(await FileAttachment(\"deputados.csv\").text(), d => {\n return {\n nome: d.Nome,\n partido: d.Partido\n }\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":24,"value":"ideologiaPartidos = d3.csvParse(await FileAttachment(\"IdeologiaPartidos.csv\").text(), d => {\n return {\n partido: d.Partido,\n ideologia: d.Ideologia\n }\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":19,"value":"votosData = d3.csvParse(await FileAttachment(\"deputados_votos.csv\").text(), d => {\n return {\n nome: d.Nome,\n partido: d.Partido,\n estado: d.Estado,\n votosRecebidos: d.votos_totalizados,\n votosTotais: d.total_de_votos,\n ideologia: d.Ideologia\n }\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":4,"value":"d3 = require('d3')","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":6,"value":"import { select } from \"@jashkenas/inputs\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":194,"value":"import {form} from \"@mbostock/form-input\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W40","stdlib":"1"}} 35:null