2f:null 30:["$","title",null,{"children":"#307 Porcentaje de hombres y mujeres en los altos cargos de cada ministerio | Civio | Observable"}] 35:Ta14,chart = { // Append svg const svg = d3 .create("svg") .attr("id", "high-charges-bar-chart") .attr("width", myWidth) .attr("height", height); // Axes const xAxis = (g, position) => { g.attr("transform", () => { return `translate(0,${height - margin.bottom})`; }).attr("class", `axis x ${position}`); if (position === "top") { return g.call( d3 .axisTop(x) .ticks(myWidth / 100) .tickSize(height - margin.top - margin.bottom) .tickFormat((d) => `${d}%`) .ticks(5) ); } else { return g.call( d3 .axisBottom(x) .ticks(myWidth / 100) .tickSize(-height + margin.top + margin.bottom) .tickFormat((d) => `${d}%`) .ticks(5) ); } }; const yAxis = (g) => g .attr( "transform", `translate(${margin.left},${isMobile ? -y.bandwidth() / 1.15 : 0})` ) .attr("class", "axis y") .call( d3 .axisLeft(y) .tickSizeOuter(0) .tickFormat((d) => d.length > 30 && !isMobile ? `${d.substring(0, 30)}...` : d.length > 50 && isMobile ? `${d.substring(0, 50)}...` : d ) ) .selectAll(".tick") .classed("minister", (d, i) => departments[i].is_minister === 1); // Append chart elements svg .append("g") .attr("fill", color("men_percent")) .attr("class", "men_percent") .selectAll("rect") .data(departments) .join("rect") .attr("class", (d, i) => `bar-${i}`) // .classed("men-bar", true) .call((el) => { setRectPosition(el, "men_percent"); }) .call((el) => { setTooltipEvent(el, "men_percent"); }); svg .append("g") .attr("fill", color("women_percent")) .attr("class", "women_percent") .selectAll("rect") .data(departments) .join("rect") // .attr("class", "women-bar") .attr("class", (d, i) => `bar-${i}`) .call((el) => { setRectPosition(el, "women_percent"); }) .call((el) => { setTooltipEvent(el, "women_percent"); }); svg .append("g") .attr("class", "law-line") .selectAll("line") .data([40, 60]) .enter() .append("line") .attr("x1", (d) => x(d)) .attr("x2", (d) => x(d)) .attr("y1", margin.top) .attr("y2", height - margin.bottom); svg.append("g").call(xAxis, "top"); svg.append("g").call(xAxis, "bottom"); svg.append("g").call(yAxis); return svg.node(); }36:T760,setTooltipEvent = (el, gender) => { el.on("mouseover", function (d) { const barClass = this.classList[0]; d3.selectAll(`.${barClass}`).classed("hover", true); tooltip .html( `

${d.name}

	Total	%
Mujeres	${Math.round(d.women_total)}	${Math.round(d.women_percent)} %
Hombres	${Math.round(d.men_total)}	${Math.round(d.men_percent)} %

` ) .style("visibility", "visible"); }) .on("mousemove", function (d, i) { tooltip .style("z-index", "300") .style("top", function () { // console.log(d3.event, d, i); return `${ d3.event.pageY + 5 < height / 2 + d3 .select("#high-charges-bar-chart") .node() .getBoundingClientRect().top ? d3.event.pageY - 5 : d3.event.pageY - tooltip.node().getBoundingClientRect().height + 5 }px`; }) .style("left", function () { return `${ d3.event.pageX + 5 < width / 2 ? d3.event.pageX + 5 : d3.event.pageX - tooltip.node().getBoundingClientRect().width - 5 }px`; }) .style("pointer-events", "none"); }) .on("mouseout", function () { const barClass = this.classList[0]; d3.selectAll(`.${barClass}`).classed("hover", false); tooltip.html(``).style("visibility", "hidden"); }); }37:T107f,arrMinisters = [ { departamento: "DEFENSA", ministerio: 1 }, { departamento: "ASUNTOS EXTERIORES Y DE COOPERACION", ministerio: 1 }, { departamento: "INTERIOR", ministerio: 1 }, { departamento: "EDUCACION, CULTURA Y DEPORTE", ministerio: 1 }, { departamento: "SANIDAD, SERVICIOS SOCIALES E IGUALDAD", ministerio: 1 }, { departamento: "HACIENDA Y ADMINISTRACIONES PUBLICAS", ministerio: 1 }, { departamento: "GRUPO PATRIMONIO", ministerio: 0 }, { departamento: "SECEGSA", ministerio: 0 }, { departamento: "PRESIDENCIA", ministerio: 1 }, { departamento: "CASA DE S.M. EL REY", ministerio: 0 }, { departamento: "AGRICULTURA, ALIMENTACION Y MEDIO AMBIENTE", ministerio: 1 }, { departamento: "ECONOMIA Y COMPETITIVIDAD", ministerio: 1 }, { departamento: "FOMENTO", ministerio: 1 }, { departamento: "GRUPO SEPI", ministerio: 0 }, { departamento: "JUSTICIA", ministerio: 1 }, { departamento: "ASUNTOS ECONOMICOS Y TRANSFORMACION DIGITAL", ministerio: 1 }, { departamento: "ASUNTOS EXTERIORES, UNION EUROPEA Y COOPERACION", ministerio: 1 }, { departamento: "INDUSTRIA, ENERGIA Y TURISMO", ministerio: 1 }, { departamento: "EMPLEO Y SEGURIDAD SOCIAL", ministerio: 1 }, { departamento: "TRANSICION ECOLOGICA Y EL RETO DEMOGRAFICO", ministerio: 1 }, { departamento: "FUNDACION SERVICIO INTERCONFEDERAL DE MEDIACION Y ARBITRAJE (SIMA)", ministerio: 0 }, { departamento: "COMERCIAL DEL FERROCARRIL, S.A. (COMFERSA)", ministerio: 0 }, { departamento: "CIENCIA E INNOVACION", ministerio: 1 }, { departamento: "PRESIDENCIA DEL GOBIERNO", ministerio: 1 }, { departamento: "INCLUSION, SEGURIDAD SOCIAL Y MIGRACIONES", ministerio: 1 }, { departamento: "FUNDACION TEATRO REAL", ministerio: 0 }, { departamento: "TRABAJO, MIGRACIONES Y SEGURIDAD SOCIAL", ministerio: 1 }, { departamento: "LOTERIAS Y APUESTAS DEL ESTADO", ministerio: 0 }, { departamento: "TRANSPORTES, MOVILIDAD Y AGENDA URBANA", ministerio: 1 }, { departamento: "FUNDACION LAZARO GALDIANO", ministerio: 0 }, { departamento: "PRESIDENCIA Y PARA LAS ADMINISTRACIONES TERRITORIALES", ministerio: 1 }, { departamento: "CULTURA Y DEPORTE", ministerio: 1 }, { departamento: "FUNDACION ICO", ministerio: 0 }, { departamento: "HACIENDA", ministerio: 1 }, { departamento: "FUNDACION OBSERVATORIO AMBIENTAL GRANADILLA", ministerio: 0 }, { departamento: "ICEX, ICO, ENISA", ministerio: 0 }, { departamento: "NAVANTIA", ministerio: 0 }, { departamento: "ECONOMIA Y EMPRESA", ministerio: 1 }, { departamento: "SOCIEDAD DE GESTION DEL PROYECTO ALETAS, S.A.", ministerio: 0 }, { departamento: "AGRICULTURA, PESCA Y ALIMENTACION", ministerio: 1 }, { departamento: "ECONOMIA, INDUSTRIA Y COMPETITIVIDAD", ministerio: 1 }, { departamento: "AGRICULTURA Y PESCA, ALIMENTACION Y MEDIO AMBIENTE", ministerio: 1 }, { departamento: "HACIENDA Y FUNCION PUBLICA", ministerio: 1 }, { departamento: "UNIVERSIDADES", ministerio: 1 }, { departamento: "ENERGIA, TURISMO Y AGENDA DIGITAL", ministerio: 1 }, { departamento: "POLITICA TERRITORIAL Y FUNCION PUBLICA", ministerio: 1 }, { departamento: "FUNDACION C. PARA LA MEMORIA DE LAS VICTIMAS DEL TERRORISMO", ministerio: 0 }, { departamento: "TRABAJO Y ECONOMIA SOCIAL", ministerio: 1 }, { departamento: "SANIDAD", ministerio: 1 }, { departamento: "PRESIDENCIA, RELACIONES CON LAS CORTES E IGUALDAD", ministerio: 1 }, { departamento: "TRANSICION ECOLOGICA", ministerio: 1 }, { departamento: "SANIDAD, CONSUMO Y BIENESTAR SOCIAL", ministerio: 1 }, { departamento: "GRUPO CESCE", ministerio: 0 }, { departamento: "CONSEJO DE SEGURIDAD NUCLEAR", ministerio: 0 }, { departamento: "DERECHOS SOCIALES Y AGENDA 2030", ministerio: 1 }, { departamento: "CIENCIA, INNOVACION Y UNIVERSIDADES", ministerio: 1 }, { departamento: "INDUSTRIA, COMERCIO Y TURISMO", ministerio: 1 }, { departamento: "IGUALDAD", ministerio: 1 }, { departamento: "EDUCACION Y FORMACION PROFESIONAL", ministerio: 1 }, { departamento: "PRESIDENCIA, RELACIONES CON LAS CORTES Y MEMORIA DEMOCRATICA", ministerio: 1 }, { departamento: "CONSUMO", ministerio: 1 } ]38:T4de,departments = { // Array with ministers and without duplications const departments = Array.from( new Set(...[charges.map((d) => d.departamento)]) ).map((department) => ({ name: department, men_total: 0, women_total: 0, men_percent: 0, women_percent: 0, is_minister: undefined })); // Aggregate totals for each gender departments.forEach((department) => { charges.forEach((charge) => { if (charge.departamento === department.name) { if (charge.genero === "H") { department.men_total += 1; } else { department.women_total += 1; } } }); }); // Calculate percentages for each gender departments.forEach((department) => { department.men_percent = (department.men_total * 100) / (department.men_total + department.women_total); department.women_percent = (department.women_total * 100) / (department.men_total + department.women_total); }); departments.forEach( (department) => (department.is_minister = ministers[department.name]) ); // Sort array return departments .sort((a, b) => d3.descending(a.women_percent, b.women_percent)) .filter((d) => d.women_total > 1 || d.men_total > 1); }39:T8ea,// Copyright 2021, Observable Inc. // Released under the ISC license. // https://observablehq.com/@d3/color-legend function Swatches( color, { columns = null, format, unknown: formatUnknown, swatchSize = 15, swatchWidth = swatchSize, swatchHeight = swatchSize, marginLeft = 0 } = {} ) { const id = `-swatches-${Math.random().toString(16).slice(2)}`; const unknown = formatUnknown == null ? undefined : color.unknown(); const unknowns = unknown == null || unknown === d3.scaleImplicit ? [] : [unknown]; const domain = color.domain().concat(unknowns); if (format === undefined) format = (x) => (x === unknown ? formatUnknown : x); function entity(character) { return `&#${character.charCodeAt(0).toString()};`; } if (columns !== null) return htl.html`

${domain.map((value) => { const label = `${format(value)}`; return htl.html`

${label}

`; })}

`; return htl.html`

`; }3a:T70c,styles = html`