36:null 37:["$","title",null,{"children":"Librerias k9-mail | Juan C. Sanguino | Observable"}] 3d:T604,html`

Librerias k9-mail

Licencia MIT
codigo de extracción de datos

Modulos de app

Modulos de mail

Modulos de plugins

Modulos de backend

Librerias externas

`3e:T869,chart = { const links = data.links.map(d => Object.create(d)); const nodes = data.nodes.map(d => Object.create(d)); const simulation = d3.forceSimulation(nodes) .force("link", d3.forceLink(links).id(d => d.libreria)) .force("charge", d3.forceManyBody().strength(-350)) .force("center", d3.forceCenter(width / 2, height / 2)); const svg = d3.create("svg") .attr("viewBox", [0, 0, width, height]); const link = svg.append("g") .selectAll("line") .data(links) .join("line") .attr("stroke", "#999") .attr("stroke-opacity", 0.6) .attr("class", d => d.__proto__.ide); function mouseoverHandler(d) { console.log(d.identificador) d3.selectAll("." + d.identificador) .style("stroke","red") .style("stroke-opacity",1); } function mouseoutHandler(d) { d3.selectAll("line") .style("stroke","#999") .style("stroke-opacity", 0.6); } const node = svg.append("g") .attr("stroke", "#fff") .attr("stroke-width", 1.5) .selectAll("circle") .data(nodes) .join("circle") .attr("r", 7) .attr("fill", color) .call(drag(simulation)) .on('mouseover', mouseoverHandler) .on("mouseout", mouseoutHandler) .attr("class", d => d.__proto__.identificador + "Node"); node.append("title") .text(d => d.libreria); simulation.on("tick", () => { link .attr("x1", d => d.source.x) .attr("y1", d => d.source.y) .attr("x2", d => d.target.x) .attr("y2", d => d.target.y); node .attr("cx", d => d.x) .attr("cy", d => d.y); }); d3.select(target).select("#selectButton").on("change",function(){ var selectedOption = d3.select(this).property("value") if(selectedOption === "0") { d3.selectAll("circle").style("opacity", 1); } else{ d3.selectAll("circle").style("opacity", 0.4); d3.selectAll("."+selectedOption+"Node") .style("opacity", 1); } }); invalidation.then(() => simulation.stop()); return svg.node(); }3f:[] 3b:{"id":"42933fd6e8d6f279","slug":"untitled/3","title":"Librerias k9-mail","thumbnail":"d1e117a1d858fbfd80670b8f2709f074cf2c9b01f72e4e5a841ebc340bed3f39","access_level":"public","create_time":"$D2019-11-21T04:40:32.710Z","update_time":"$D2019-11-22T21:59:31.759Z","view_time":null,"first_public_time":"$D2019-11-21T05:42:06.436Z","has_unpublished_edits":null,"fork":{"id":"a6c00de7c09bdfa1","slug":"force-directed-graph-component","title":"Force-directed graph component","owner":{"id":"863951e3ebe4c0ae","login":"d3","name":"D3"}},"stars":0,"starred":false,"owner":{"type":"team","id":"561cbfd91d4c293b","login":"jcsanguino10","name":"Juan C. Sanguino","avatar_url":"https://avatars-next.observableusercontent.com/dacd41d39352452a13633fd532154eb8a7d45de6120eb8ef7f3ab0d8a61f7c10","tier":"starter_2024","bio":"","following":false},"version":314,"publish_version":314,"role":null,"authored":false,"authors":[{"type":"individual","id":"000c0bbe77eaa5ff","login":"jcsanguino10","name":"Juan C. Sanguino","avatar_url":"https://avatars-next.observableusercontent.com/dacd41d39352452a13633fd532154eb8a7d45de6120eb8ef7f3ab0d8a61f7c10","tier":null,"bio":"","following":false}],"members":[{"type":"individual","id":"000c0bbe77eaa5ff","login":"jcsanguino10","name":"Juan C. Sanguino","avatar_url":"https://avatars-next.observableusercontent.com/dacd41d39352452a13633fd532154eb8a7d45de6120eb8ef7f3ab0d8a61f7c10","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"titling":"auto","title":"Librerias k9-mail","cells":[{"id":258,"value":"$3d","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":237,"value":"target = html`

\n\n

Filtrar por libreria

Al situarse en un nodo puede ver su nombre y sus conexiones

\n\n

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":7,"value":"$3e","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":312,"value":"md`Inspirado en el codigo de Mike Bostock Force-Directed Graph`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":228,"value":"sel = {\n let arra = []\n let ord = data.nodes.sort(function(x, y){\n return d3.ascending(x.libreria, y.libreria);\n })\n ord.forEach((d)=>{\n var obj = html``\n arra.push(obj)\n })\n return arra\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":3,"value":"data = d3.json(\"https://raw.githubusercontent.com/jcsanguino10/datosMoviles/master/data.JSON\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":32,"value":"height = 650","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":26,"value":"color = {\n const scale = d3.scaleOrdinal(d3.schemeCategory10);\n return d => scale(d.group);\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":76,"value":"drag = simulation => {\n \n function dragstarted(d) {\n if (!d3.event.active) simulation.alphaTarget(0.8).restart();\n d.fx = d.x;\n d.fy = d.y;\n }\n \n function dragged(d) {\n d.fx = d3.event.x;\n d.fy = d3.event.y;\n }\n \n function dragended(d) {\n if (!d3.event.active) simulation.alphaTarget(0);\n d.fx = null;\n d.fy = null;\n }\n \n return d3.drag()\n .on(\"start\", dragstarted)\n .on(\"drag\", dragged)\n .on(\"end\", dragended);\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":232,"value":"import {checkbox, select, slider} from \"@jashkenas/inputs\"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":11,"value":"d3 = require(\"d3@5\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W3f","stdlib":"1"}} 3c:"$3b:body"

Librerias k9-mail

Licencia MIT codigo de extracción de datos Modulos de app Modulos de mail Modulos de plugins Modulos de backend Librerias externas

Filtrar por libreria

Licencia MIT
codigo de extracción de datos

Modulos de app

Modulos de mail

Modulos de plugins

Modulos de backend

Librerias externas