27:null 28:["$","title",null,{"children":"Network Analysis of Library and Information Science Journals | Kevin Gutierrez | Observable"}] 2d:T5289,chart = { // ========================================== // RED BIBLIOMÉTRICA WEBGL - LIBRARY & INFORMATION SCIENCE // Corrección: Sistema de referencias de nodos robusto // ========================================== const CONFIG = { width: 1400, height: 950, colors: { americas: "#8B0000", europe: "#003366", asia: "#B8860B", oceania: "#4B0082", africa: "#006400", other: "#696969", oa_high: "#2E8B57", oa_medium: "#DAA520", oa_low: "#CD853F", oa_none: "#A9A9A9", hover: "#DC143C", text: "#1a1a1a", bg: "#faf8f5" } }; const REGIONS = { US: "americas", CA: "americas", MX: "americas", BR: "americas", AR: "americas", CL: "americas", CO: "americas", PE: "americas", CU: "americas", VE: "americas", UY: "americas", PY: "americas", BO: "americas", EC: "americas", GB: "europe", DE: "europe", ES: "europe", FR: "europe", IT: "europe", NL: "europe", PT: "europe", SE: "europe", CH: "europe", HU: "europe", BE: "europe", AT: "europe", DK: "europe", NO: "europe", FI: "europe", PL: "europe", CZ: "europe", GR: "europe", IE: "europe", RU: "europe", TR: "europe", CN: "asia", JP: "asia", KR: "asia", IN: "asia", IR: "asia", TW: "asia", SG: "asia", HK: "asia", MY: "asia", TH: "asia", ID: "asia", PH: "asia", VN: "asia", PK: "asia", BD: "asia", AU: "oceania", NZ: "oceania", ZA: "africa", EG: "africa", NG: "africa", KE: "africa", GH: "africa", ET: "africa" }; const SEARCH_TERMS = [ "library science", "information science", "bibliotecología", "documentación", "archives", "knowledge management", "biblioteconomia", "ciencia informação", "information management", "digital libraries", "scholarly communication", "bibliography", "cataloging", "metadata", "information retrieval", "data science journal", "scientometrics", "informatics", "records management" ]; async function fetchAllSources() { const allSources = []; const seen = new Set(); for (const term of SEARCH_TERMS) { try { const url = `https://api.openalex.org/sources?search=${encodeURIComponent(term)}&filter=type:journal&per_page=25&mailto=researcher@university.edu`; const res = await fetch(url); if (!res.ok) continue; const data = await res.json(); (data.results || []).forEach(s => { if (!seen.has(s.id)) { seen.add(s.id); const name = (s.display_name || "").toLowerCase(); const relevant = ["library", "information", "bibli", "document", "archive", "knowledge", "data", "scientomet", "informática", "bibliote"].some(k => name.includes(k)); if (relevant) allSources.push(s); } }); await new Promise(r => setTimeout(r, 30)); } catch (e) {} } return processData(allSources.slice(0, 360)); } function processData(sources) { // Crear nodos con IDs únicos y estables const nodes = sources.map((s, i) => { const cc = s.country_code || "XX"; const region = REGIONS[cc] || "other"; const oa = s.open_access?.percentage || 0; const oaLevel = oa === 100 ? "high" : oa >= 50 ? "medium" : oa > 0 ? "low" : "none"; return { id: `node-${i}`, // ID único y estable tipo string idx: i, // Índice numérico auxiliar title: (s.display_name || "Unknown").substring(0, 50), fullTitle: s.display_name || "Unknown", country: s.country || "Unknown", region: region, works: s.works_count || 0, citations: s.cited_by_count || 0, publisher: s.host_organization_name || "Independent", oa: oa, oaLevel: oaLevel, impact: ((s.cited_by_count || 0) / Math.max(s.works_count || 1, 1)).toFixed(2), url: s.homepage_url || null, x: Math.random() * CONFIG.width, y: Math.random() * CONFIG.height, vx: 0, vy: 0 }; }).filter(n => n.works > 0).slice(0, 360); // Mapa de IDs para referencias rápidas const nodeById = new Map(nodes.map(n => [n.id, n])); // Crear enlaces usando referencias a objetos, no índices const links = []; nodes.forEach((a) => { let count = 0; for (const b of nodes) { if (a.id === b.id || count >= 3) continue; let weight = 0; if (a.publisher === b.publisher && a.publisher !== "Independent") weight = 0.9; else if (a.country === b.country) weight = 0.5; else if (a.region === b.region) weight = 0.2; if (weight > 0.3) { // CORRECCIÓN CLAVE: Usar referencias a objetos, no índices links.push({ source: a, // Referencia directa al objeto target: b, // Referencia directa al objeto weight, sourceId: a.id, // Guardar IDs para filtrado targetId: b.id }); count++; } } }); return { nodes, links, nodeById }; } const data = await fetchAllSources(); // Contenedor académico const container = d3.create("div") .style("font-family", "'Times New Roman', Times, serif") .style("width", "100%") .style("max-width", "1450px") .style("background", CONFIG.colors.bg) .style("border", "2px solid #333") .style("padding", "20px") .style("box-shadow", "0 4px 20px rgba(0,0,0,0.1)"); const header = container.append("div") .style("text-align", "center") .style("border-bottom", "2px solid #333") .style("padding-bottom", "15px") .style("margin-bottom", "20px"); header.append("h1") .style("margin", "0 0 8px 0") .style("font-size", "22px") .style("font-weight", "normal") .style("color", CONFIG.colors.text) .style("letter-spacing", "0.5px") .text("Network Analysis of Library and Information Science Journals"); header.append("div") .style("font-size", "12px") .style("color", "#555") .style("font-style", "italic") .text(`Bibliometric visualization of ${data.nodes.length} journals • Data: OpenAlex • Force-directed layout`); // Panel de controles const controls = container.append("div") .style("display", "grid") .style("grid-template-columns", "repeat(4, 1fr)") .style("gap", "15px") .style("margin-bottom", "20px") .style("padding", "15px") .style("background", "#fff") .style("border", "1px solid #999"); let filterRegion = "all", filterOA = "all", searchQuery = ""; const createFilter = (parent, label, options, callback) => { const div = parent.append("div"); div.append("div") .style("font-size", "11px") .style("font-weight", "bold") .style("margin-bottom", "5px") .style("text-transform", "uppercase") .style("letter-spacing", "0.5px") .text(label); const select = div.append("select") .style("width", "100%") .style("padding", "6px") .style("font-family", "inherit") .style("font-size", "12px") .style("border", "1px solid #666") .on("change", function() { callback(this.value); }); options.forEach(o => select.append("option").attr("value", o.value).text(o.label)); return select; }; createFilter(controls, "Geographic Region", [ {value: "all", label: "All Regions"}, {value: "americas", label: "Americas"}, {value: "europe", label: "Europe"}, {value: "asia", label: "Asia & Pacific"}, {value: "oceania", label: "Oceania"}, {value: "africa", label: "Africa"} ], v => { filterRegion = v; updateFilters(); }); createFilter(controls, "Open Access", [ {value: "all", label: "All Access Types"}, {value: "high", label: "Gold/Diamond OA (100%)"}, {value: "medium", label: "Hybrid OA (50-99%)"}, {value: "low", label: "Limited OA (1-49%)"}, {value: "none", label: "Subscription (0%)"} ], v => { filterOA = v; updateFilters(); }); const searchDiv = controls.append("div"); searchDiv.append("div") .style("font-size", "11px") .style("font-weight", "bold") .style("margin-bottom", "5px") .style("text-transform", "uppercase") .text("Search"); searchDiv.append("input") .attr("type", "text") .attr("placeholder", "Journal, publisher, country...") .style("width", "100%") .style("padding", "6px") .style("font-family", "inherit") .style("font-size", "12px") .style("border", "1px solid #666") .on("input", function() { searchQuery = this.value.toLowerCase(); updateFilters(); }); // Métricas const metricsDiv = controls.append("div") .style("display", "grid") .style("grid-template-columns", "repeat(2, 1fr)") .style("gap", "10px"); const updateMetric = (id, val, label, color) => { const d = metricsDiv.append("div").style("text-align", "center"); d.append("div").attr("id", id).style("font-size", "18px").style("font-weight", "bold").style("color", color).text(val); d.append("div").style("font-size", "9px").style("color", "#666").style("text-transform", "uppercase").text(label); }; updateMetric("m-total", data.nodes.length, "Journals", "#333"); updateMetric("m-oa", data.nodes.filter(d => d.oaLevel === "high").length, "Open Access", CONFIG.colors.oa_high); // Canvas const canvasContainer = container.append("div") .style("position", "relative") .style("border", "2px solid #333") .style("background", "#fff"); const canvas = canvasContainer.append("canvas") .attr("width", CONFIG.width) .attr("height", CONFIG.height) .style("width", "100%") .style("height", "auto") .style("display", "block") .style("cursor", "move"); const ctx = canvas.node().getContext("2d"); // CORRECCIÓN: Simulación con manejo correcto de referencias const simulation = d3.forceSimulation(data.nodes) .force("link", d3.forceLink() .id(d => d.id) // Usar d.id como identificador .distance(120) .strength(0.4)) .force("charge", d3.forceManyBody().strength(-150).distanceMax(300)) .force("center", d3.forceCenter(CONFIG.width / 2, CONFIG.height / 2)) .force("collide", d3.forceCollide().radius(d => Math.sqrt(d.citations) * 0.15 + 8).strength(0.8)) .force("x", d3.forceX(d => { const pos = { americas: 400, europe: 750, asia: 1100, oceania: 1250, africa: 200, other: 750 }; return pos[d.region] || 750; }).strength(0.08)) .force("y", d3.forceY(d => { const pos = { high: 300, medium: 500, low: 700, none: 800 }; return pos[d.oaLevel] || 500; }).strength(0.06)) .alphaDecay(0.02) .velocityDecay(0.3); // CORRECCIÓN CRÍTICA: Asignar enlaces como objetos, no como índices simulation.force("link").links(data.links); const rScale = d3.scaleSqrt() .domain([0, d3.max(data.nodes, d => d.citations)]) .range([5, 35]); const cScale = d3.scaleOrdinal() .domain(["americas", "europe", "asia", "oceania", "africa", "other"]) .range([CONFIG.colors.americas, CONFIG.colors.europe, CONFIG.colors.asia, CONFIG.colors.oceania, CONFIG.colors.africa, CONFIG.colors.other]); let transform = d3.zoomIdentity; let hoveredNode = null; let visibleNodes = [...data.nodes]; let visibleLinks = [...data.links]; const zoom = d3.zoom() .scaleExtent([0.1, 4]) .on("zoom", (e) => { transform = e.transform; render(); }); d3.select(canvas.node()).call(zoom); // CORRECCIÓN: Filtrado seguro que mantiene consistencia de referencias function updateFilters() { // Filtrar nodos visibleNodes = data.nodes.filter(d => { if (filterRegion !== "all" && d.region !== filterRegion) return false; if (filterOA !== "all" && d.oaLevel !== filterOA) return false; if (searchQuery && !d.fullTitle.toLowerCase().includes(searchQuery) && !d.country.toLowerCase().includes(searchQuery) && !d.publisher.toLowerCase().includes(searchQuery)) return false; return true; }); const visibleIds = new Set(visibleNodes.map(d => d.id)); // CORRECCIÓN CRÍTICA: Filtrar enlaces verificando ambos extremos visibleLinks = data.links.filter(l => { const sId = typeof l.source === 'object' ? l.source.id : l.sourceId; const tId = typeof l.target === 'object' ? l.target.id : l.targetId; return visibleIds.has(sId) && visibleIds.has(tId); }); // Actualizar métricas d3.select("#m-total").text(visibleNodes.length); d3.select("#m-oa").text(visibleNodes.filter(d => d.oaLevel === "high").length); // CORRECCIÓN: Reiniciar simulación solo con nodos visibles y enlaces filtrados simulation.nodes(visibleNodes); simulation.force("link").links(visibleLinks); simulation.alpha(0.8).restart(); render(); } function render() { ctx.save(); ctx.clearRect(0, 0, CONFIG.width, CONFIG.height); ctx.fillStyle = "#fff"; ctx.fillRect(0, 0, CONFIG.width, CONFIG.height); // Grid ctx.strokeStyle = "#e0e0e0"; ctx.lineWidth = 1; for (let i = 0; i < CONFIG.width; i += 100) { ctx.beginPath(); ctx.moveTo(i, 0); ctx.lineTo(i, CONFIG.height); ctx.stroke(); } for (let i = 0; i < CONFIG.height; i += 100) { ctx.beginPath(); ctx.moveTo(0, i); ctx.lineTo(CONFIG.width, i); ctx.stroke(); } ctx.translate(transform.x, transform.y); ctx.scale(transform.k, transform.k); // Enlaces - CORRECCIÓN: Acceder a coordenadas de objeto directamente ctx.strokeStyle = "#bbb"; ctx.lineWidth = 1.5; visibleLinks.forEach(l => { // CORRECCIÓN: source y target son objetos, no índices const s = l.source; const t = l.target; if (s && t && s.x !== undefined && t.x !== undefined) { ctx.beginPath(); ctx.moveTo(s.x, s.y); ctx.lineTo(t.x, t.y); ctx.stroke(); } }); // Nodos visibleNodes.forEach(d => { const r = rScale(d.citations); const isHovered = hoveredNode === d; if (isHovered) { ctx.beginPath(); ctx.arc(d.x, d.y, r + 10, 0, 2 * Math.PI); ctx.fillStyle = "rgba(220, 20, 60, 0.2)"; ctx.fill(); } ctx.beginPath(); ctx.arc(d.x, d.y, r + 3, 0, 2 * Math.PI); ctx.strokeStyle = CONFIG.colors[`oa_${d.oaLevel}`]; ctx.lineWidth = isHovered ? 4 : 2; ctx.stroke(); ctx.beginPath(); ctx.arc(d.x, d.y, r, 0, 2 * Math.PI); ctx.fillStyle = cScale(d.region); ctx.fill(); if (isHovered) { ctx.strokeStyle = CONFIG.colors.hover; ctx.lineWidth = 3; ctx.stroke(); } else { ctx.strokeStyle = "#fff"; ctx.lineWidth = 2; ctx.stroke(); } if (isHovered || d.citations > 5000) { ctx.font = isHovered ? "italic 12px Times New Roman" : "11px Times New Roman"; ctx.fillStyle = "#1a1a1a"; ctx.textAlign = "left"; ctx.fillText(d.title, d.x + r + 8, d.y + 4); } }); ctx.restore(); } const tooltip = d3.select("body").append("div") .style("position", "absolute") .style("visibility", "hidden") .style("background", "#fff") .style("border", "2px solid #333") .style("padding", "12px") .style("border-radius", "0") .style("font-family", "'Times New Roman', Times, serif") .style("font-size", "11px") .style("max-width", "350px") .style("box-shadow", "4px 4px 0 rgba(0,0,0,0.2)") .style("z-index", "1000") .style("pointer-events", "none"); canvas.on("mousemove", function(e) { const [mx, my] = d3.pointer(e, this); const invTransform = transform.invert([mx, my]); let found = null; for (const d of visibleNodes) { const r = rScale(d.citations) + 5; const dx = invTransform[0] - d.x; const dy = invTransform[1] - d.y; if (dx * dx + dy * dy < r * r) { found = d; break; } } if (found !== hoveredNode) { hoveredNode = found; render(); if (found) { const oaText = found.oaLevel === "high" ? "Gold/Diamond OA (100%)" : found.oaLevel === "medium" ? "Hybrid OA (50-99%)" : found.oaLevel === "low" ? "Limited OA (1-49%)" : "Subscription (0%)"; tooltip.html(`

${found.fullTitle}

${found.country} • ${found.region}

Works:	${found.works.toLocaleString()}
Citations:	${found.citations.toLocaleString()}
Impact Factor:	${found.impact}
Publisher:	${found.publisher}

${oaText}

${found.url ? `

${found.url}

` : ''} `) .style("visibility", "visible") .style("left", (e.pageX + 15) + "px") .style("top", (e.pageY - 10) + "px"); } else { tooltip.style("visibility", "hidden"); } } }); canvas.on("click", function(e) { if (hoveredNode && hoveredNode.url) { window.open(hoveredNode.url, '_blank'); } }); canvas.on("mouseleave", () => { hoveredNode = null; render(); tooltip.style("visibility", "hidden"); }); // Leyendas const legendContainer = container.append("div") .style("display", "grid") .style("grid-template-columns", "1fr 1fr") .style("gap", "20px") .style("margin-top", "20px") .style("padding", "15px") .style("background", "#fff") .style("border", "1px solid #999"); const createLegend = (parent, title, items) => { const div = parent.append("div"); div.append("div") .style("font-size", "12px") .style("font-weight", "bold") .style("margin-bottom", "10px") .style("text-transform", "uppercase") .style("letter-spacing", "1px") .style("border-bottom", "1px solid #333") .style("padding-bottom", "5px") .text(title); const grid = div.append("div").style("display", "grid").style("grid-template-columns", "repeat(2, 1fr)").style("gap", "8px"); items.forEach(item => { const row = grid.append("div").style("display", "flex").style("align-items", "center"); row.append("div") .style("width", "12px") .style("height", "12px") .style("background", item.color) .style("border", item.border ? `2px solid ${item.border}` : "1px solid #666") .style("margin-right", "8px"); row.append("div").style("font-size", "11px").style("color", "#333").text(item.label); }); }; createLegend(legendContainer, "Geographic Distribution", [ {color: CONFIG.colors.americas, label: "Americas"}, {color: CONFIG.colors.europe, label: "Europe"}, {color: CONFIG.colors.asia, label: "Asia & Pacific"}, {color: CONFIG.colors.oceania, label: "Oceania"}, {color: CONFIG.colors.africa, label: "Africa"}, {color: CONFIG.colors.other, label: "Other/Unknown"} ]); createLegend(legendContainer, "Open Access Status", [ {color: "transparent", border: CONFIG.colors.oa_high, label: "Gold/Diamond (100%)"}, {color: "transparent", border: CONFIG.colors.oa_medium, label: "Hybrid (50-99%)"}, {color: "transparent", border: CONFIG.colors.oa_low, label: "Limited (1-49%)"}, {color: "transparent", border: CONFIG.colors.oa_none, label: "Subscription (0%)"} ]); container.append("div") .style("margin-top", "15px") .style("padding-top", "10px") .style("border-top", "1px solid #999") .style("font-size", "10px") .style("color", "#666") .style("font-style", "italic") .style("text-align", "center") .text(`Visualization: Force-directed network • Physics: D3-force • Rendering: HTML5 Canvas • Data: OpenAlex API (${new Date().toLocaleDateString()})`); simulation.on("tick", render); updateFilters(); return container.node(); }2e:[] 2b:{"id":"09f8be04c48311b4","slug":null,"title":"Network Analysis of Library and Information Science Journals","thumbnail":"aa5f13b1b6807ed539929b8c92f4437a4284a609305db35f80b7fcd042640e30","access_level":"public","create_time":"$D2026-04-08T16:59:19.551Z","update_time":"$D2026-06-03T17:34:14.475Z","view_time":null,"first_public_time":"$D2026-04-20T03:58:55.169Z","has_unpublished_edits":null,"fork":false,"stars":0,"starred":false,"owner":{"type":"team","id":"51fe6e2ec1bb1cf6","login":"kahernandezg","name":"Kevin Gutierrez","avatar_url":"https://avatars-next.observableusercontent.com/2565601e8fd1d0ae6653db3f9322b46e911143f9b192883ac7484f5393c17bde","tier":"starter_2024"},"version":12,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"10fe80357ee10d94","login":"kevin-amilcar-hernandez-gutierrez","name":"Kevin Amilcar Hernández Gutierrez","avatar_url":"https://avatars-next.observableusercontent.com/5e7bab77859fa97769d110935c464ca14bf058cee0bf8ec50ef736a6e77653f3","tier":null}],"members":[{"type":"team","id":"51fe6e2ec1bb1cf6","login":"kahernandezg","name":"Kevin Gutierrez","avatar_url":"https://avatars-next.observableusercontent.com/2565601e8fd1d0ae6653db3f9322b46e911143f9b192883ac7484f5393c17bde","tier":"starter_2024","role":"editor"},{"type":"individual","id":"10fe80357ee10d94","login":"kevin-amilcar-hernandez-gutierrez","name":"Kevin Amilcar Hernández Gutierrez","avatar_url":"https://avatars-next.observableusercontent.com/5e7bab77859fa97769d110935c464ca14bf058cee0bf8ec50ef736a6e77653f3","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"title":"Network Analysis of Library and Information Science Journals","cells":[{"id":0,"value":"# Network Analysis of Library and Information Science Journals","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":4,"value":"$2d","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W2e","stdlib":"1","titling":"auto"}} 2c:"$2b:body"