25:["$","title",null,{"children":"Sustituciones de diputados en la XV legislatura | Newtral Data | Observable"}] 49:Tbf8,viewof interactividad = { const infoData = await googleSheetData; const svgElement = viewof svgMapaRenderizado.querySelector("svg"); if (!svgElement) { console.error("El SVG no se ha cargado correctamente."); return; } const tooltip = document.createElement("div"); tooltip.id = "tooltip"; tooltip.style.position = "absolute"; tooltip.style.pointerEvents = "none"; tooltip.style.display = "none"; tooltip.style.background = "#fff"; tooltip.style.color = "#000"; tooltip.style.padding = "5px 10px"; tooltip.style.borderRadius = "5px"; tooltip.style.boxShadow = "0 2px 6px rgba(0, 0, 0, 0.2)"; tooltip.style.zIndex = "1000"; tooltip.style.maxWidth = "400px"; tooltip.style.minWidth = "150px"; tooltip.style.wordWrap = "break-word"; document.body.appendChild(tooltip); let mapaGroup = svgElement.querySelector("#mapa"); if (!mapaGroup) { mapaGroup = document.createElementNS("http://www.w3.org/2000/svg", "g"); mapaGroup.setAttribute("id", "mapa"); while (svgElement.firstChild) { mapaGroup.appendChild(svgElement.firstChild); } svgElement.appendChild(mapaGroup); } const ajustarTooltip = (event) => { const tooltipRect = tooltip.getBoundingClientRect(); const viewportWidth = window.innerWidth; const viewportHeight = window.innerHeight; let left = event.clientX + 10; let top = event.clientY + 10; if (left + tooltipRect.width > viewportWidth) { left = event.clientX - tooltipRect.width - 10; } if (top + tooltipRect.height > viewportHeight) { top = event.clientY - tooltipRect.height - 10; } if (left < 0) left = 0; if (top < 0) top = 0; tooltip.style.left = `${left}px`; tooltip.style.top = `${top}px`; }; const mostrarTooltip = (event, data) => { tooltip.style.display = "block"; tooltip.innerHTML = `${data.diputado_nuevo}
sustituye a
${data.diputado_antiguo}

Partido: ${data.partido}`; ajustarTooltip(event); }; const ocultarTooltip = () => { tooltip.style.display = "none"; }; const interactivos = svgElement.querySelectorAll("#layer1 *"); interactivos.forEach(elemento => { const id = elemento.id; const data = infoData.find(row => row.id == id); if (data) { if (data.color && /^#[0-9A-Fa-f]{6}$/.test(data.color)) { elemento.setAttribute("fill", data.color); } else { console.warn(`Color no válido para el ID ${id}: ${data.color}`); elemento.setAttribute("fill", "#000000"); } elemento.addEventListener("mouseover", (event) => { mostrarTooltip(event, data); elemento.style.cursor = "pointer"; }); elemento.addEventListener("mousemove", (event) => { ajustarTooltip(event); }); elemento.addEventListener("mouseout", () => { ocultarTooltip(); }); elemento.addEventListener("click", (event) => { mostrarTooltip(event, data); }); } }); return "OK"; }4a:[{"id":"fbb78ed5a127658c80d7a8e1bc370b0416d51ba54484ff643a755870765adf099f81fa157addb159ede01d66004159ff1583bffc77083618e2971e5aca053d31","href":"https://static.observableusercontent.com/files/fbb78ed5a127658c80d7a8e1bc370b0416d51ba54484ff643a755870765adf099f81fa157addb159ede01d66004159ff1583bffc77083618e2971e5aca053d31","name":"sustituciones_diputados.svg","type":"image/svg+xml","lastModified":1750935100198.657,"size":47983}] 29:{"id":"82e29697574051a0","slug":null,"title":"Sustituciones de diputados en la XV legislatura","thumbnail":"076078791be2660118d2d90b0e3fa7e74030b405562aef3a38b034e31435bb2c","access_level":"public","create_time":"$D2025-06-26T09:37:38.569Z","update_time":"$D2025-06-26T11:17:20.289Z","view_time":null,"first_public_time":"$D2025-06-26T11:02:17.660Z","has_unpublished_edits":null,"fork":false,"stars":0,"starred":false,"owner":{"type":"team","id":"6721f19fe640557e","login":"newtral-datos","name":"Newtral Data","avatar_url":"https://avatars-next.observableusercontent.com/ff6ff00f51721a8025f0514b4e310cc0f80a1f58417bdffd6aa86bd2c3bcd948","tier":"starter_2024","bio":"Somos el equipo de datos de Newtral. Nos dedicamos a analizar y convertir datos en historias periodísticas, utilizando IA y programación.","following":false},"version":48,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"dcf36f2cf3d68944","login":"newtral-datos","name":"Newtral Data","avatar_url":"https://avatars-next.observableusercontent.com/ff6ff00f51721a8025f0514b4e310cc0f80a1f58417bdffd6aa86bd2c3bcd948","tier":null,"bio":"Somos el equipo de datos de Newtral. Nos dedicamos a analizar y convertir datos en historias periodísticas, utilizando IA y programación.","following":false}],"members":[{"type":"team","id":"6721f19fe640557e","login":"newtral-datos","name":"Newtral Data","avatar_url":"https://avatars-next.observableusercontent.com/ff6ff00f51721a8025f0514b4e310cc0f80a1f58417bdffd6aa86bd2c3bcd948","tier":"starter_2024","role":"editor"},{"type":"individual","id":"dcf36f2cf3d68944","login":"newtral-datos","name":"Newtral Data","avatar_url":"https://avatars-next.observableusercontent.com/ff6ff00f51721a8025f0514b4e310cc0f80a1f58417bdffd6aa86bd2c3bcd948","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"titling":"auto","title":"Sustituciones de diputados en la XV legislatura","cells":[{"id":34,"value":"titulo = html`

Sustituciones de diputados en la XV legislatura

`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":0,"value":"csvURL = \"https://docs.google.com/spreadsheets/d/e/2PACX-1vTe-eB6e9H4OOTJshqdfywm0mjranfbvVbx6oSOwpBXHrzPlZfpDLFPzt7yMLlKng/pub?output=csv\";","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":6,"value":"function csvToJson(csv) {\n const lines = csv.split(\"\\n\");\n const headers = lines[0].split(\",\");\n\n const result = lines.slice(1).map(line => {\n const values = line.split(/,(?=(?:[^\\\"]*\\\"[^\\\"]*\\\")*[^\\\"]*$)/);\n const obj = {};\n \n headers.forEach((header, index) => {\n let value = values[index].trim();\n\n value = value.replace(/\"/g, '').trim(); \n\n obj[header.trim()] = value;\n });\n \n return obj;\n });\n\n return result;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":8,"value":"googleSheetData = fetch(csvURL)\n .then(response => response.text())\n .then(csvText => csvToJson(csvText));","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":10,"value":"d3 = require(\"d3@6\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":12,"value":"viewof svgMapa = FileAttachment(\"sustituciones_diputados.svg\").text()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":14,"value":"viewof svgMapaRenderizado = {\n const container = html`

`;\n const svgElement = document.createElement(\"div\");\n svgElement.innerHTML = viewof svgMapa;\n container.appendChild(svgElement);\n\n const svg = svgElement.querySelector(\"svg\");\n\n if (!svg) {\n console.error(\"El SVG no se ha cargado correctamente.\");\n return;\n }\n\n const mapaGroup = svg.querySelector(\"#mapa\");\n\n if (!mapaGroup) {\n console.warn(\"No se encontró un grupo con ID 'mapa' en el SVG.\");\n }\n\n const zoom = d3.zoom()\n .scaleExtent([0.5, 5])\n .on(\"zoom\", (event) => {\n if (mapaGroup) {\n mapaGroup.setAttribute(\"transform\", event.transform);\n }\n });\n\n d3.select(svg)\n .call(zoom)\n .on(\"wheel.zoom\", null)\n .on(\"dblclick.zoom\", null);\n\n return container;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":16,"value":"infoHemiciclo = googleSheetData;","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":18,"value":"$49","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":20,"value":"estilos = html`\n \n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W4a","stdlib":"1"}} 24:null