34:null 35:["$","title",null,{"children":"POV: You woke up today thinking about graphs. | Chris Stanley | Observable"}] 3b:T6f1,cytoscape_instance = { graph_container; graph_container_id; const cy = cytoscape.use(d3Force)({ container: document.getElementById(graph_container_id), elements: { nodes: filtered_nodes, edges: filtered_edges }, zoom: 0.2, layout: { name: "d3-force", linkId: function id(d) { return d.id; }, manyBodyStrength: -700, fit: true, padding: 120, linkStrength: 0.75, // linkIterations: 10, collideIterations: 3, radialStrength: 0, ready: function () {}, stop: function () {}, tick: function (progress) {}, randomize: true, infinite: true }, style: [ { selector: "node", style: { color: "white", label: "data(label)" } }, { selector: "edge", style: { "target-arrow-shape": "triangle" } }, { selector: "node.highlight", style: { "border-color": "#FFF", "border-width": "2px" } }, { selector: "node.semitransp", style: { opacity: "0.5" } }, { selector: "edge.highlight", style: { "mid-target-arrow-color": "#FFF" } }, { selector: "edge.semitransp", style: { opacity: "0.2" } } ] }); cy.on("mouseover", "node", function (e) { var sel = e.target; cy.elements().difference(sel.successors()).not(sel).addClass("semitransp"); sel.addClass("highlight").successors().addClass("highlight"); }); cy.on("mouseout", "node", function (e) { var sel = e.target; cy.elements().removeClass("semitransp"); sel.removeClass("highlight").successors().removeClass("highlight"); }); return cy; }3c:[{"id":"185f8266cd72aed65c58b2a1c75180376e789cb91e37fc1cf3fc4b32c1bba996006e86affc3885687d4fe688039eabb4f4ae4d8804f7ed0d3fc8e20052a6078b","href":"https://static.observableusercontent.com/files/185f8266cd72aed65c58b2a1c75180376e789cb91e37fc1cf3fc4b32c1bba996006e86affc3885687d4fe688039eabb4f4ae4d8804f7ed0d3fc8e20052a6078b","name":"graph_elements.json","type":"application/json","lastModified":1667752090009.74,"size":10419}] 39:{"id":"9a35c7e9c3ebc5ae","slug":"pov-you-woke-up-wanting-to-use-graph-theory-for-something-for","title":"POV: You woke up today thinking about graphs.","thumbnail":"95c094dbae7650e3b75425dac6eabb5c448c7d37cb59b0a1a590910d5be070de","access_level":"public","create_time":"$D2022-11-06T15:52:14.951Z","update_time":"$D2022-11-10T22:36:07.103Z","view_time":null,"first_public_time":"$D2022-11-09T23:02:34.224Z","has_unpublished_edits":null,"fork":{"id":"7dcef0ebff4028d9","slug":"input-chart","title":"Input + Chart","owner":{"id":"f35c755083683fe5","login":"observablehq","name":"Observable"}},"stars":0,"starred":false,"owner":{"type":"team","id":"d6a36d1843592687","login":"propolisa","name":"Chris Stanley","avatar_url":"https://avatars-next.observableusercontent.com/b9dae0ea273274b656f3f0f3920e5ef3437913a4dc303e5fc3b006906a8f6e5d","tier":"starter_2024","bio":"Cybersecurity and data visualization.\nEverything is a graph.\nSecurity Engineer @ Zivver","following":false},"version":245,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"9578f02a8efdf1d2","login":"propolisa","name":"Chris Stanley","avatar_url":"https://avatars-next.observableusercontent.com/b9dae0ea273274b656f3f0f3920e5ef3437913a4dc303e5fc3b006906a8f6e5d","tier":null,"bio":"Cybersecurity and data visualization.\nEverything is a graph.\nSecurity Engineer @ Zivver","following":false}],"members":[{"type":"individual","id":"9578f02a8efdf1d2","login":"propolisa","name":"Chris Stanley","avatar_url":"https://avatars-next.observableusercontent.com/b9dae0ea273274b656f3f0f3920e5ef3437913a4dc303e5fc3b006906a8f6e5d","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"titling":"auto","title":"POV: You woke up today thinking about graphs.","cells":[{"id":4,"value":"# POV: You woke up today thinking about graphs.\n\nUsing [Inputs.range](https://github.com/observablehq/inputs/blob/main/README.md#range) and [Plot](/@observablehq/plot).","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":5,"value":"data = FileAttachment(\"graph_elements.json\").json()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":98,"value":"viewof search_string = Inputs.text({ label: \"Search Nodes\" })","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":95,"value":"filtered_nodes = data.nodes.filter((node) =>\n JSON.stringify(node).includes(search_string)\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":103,"value":"filtered_edges = data.edges.filter(\n (edge) =>\n filtered_nodes.some((n) => n.data.id == edge.data.source) &&\n filtered_nodes.some((n) => n.data.id == edge.data.target)\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":150,"value":"nodesHeader = md`## Nodes`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":137,"value":"table_nodes_short = html`\n \n \n \n \n \n \n \n ${filtered_nodes.slice(0,10).map(node => htl.html`\n \n \n `)}\n \n

ID	Label
${node[\"data\"][\"id\"]}	${node[\"data\"][\"label\"]}

Source	Target
${edge[\"data\"][\"source\"]}	${edge[\"data\"][\"target\"]}

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":161,"value":"viewof button = Inputs.button(\"Click me\", {value: null, reduce: () => new Date})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":222,"value":"viewof button3 = Inputs.button([[\"Highlight Loops\", () => {\n cytoscape_instance.elements().forEach(e => e.deselect())\n const bridges = getBridges(cytoscape_instance);\n const loops = cytoscape_instance.edges().difference(bridges)\n for (const loop of loops) loop.select();\n }\n],[\"Highlight Bridges\",() => {\n cytoscape_instance.elements().forEach(e => e.deselect())\n const bridges = getBridges(cytoscape_instance);\n for (const bridge of bridges) bridge.select();\n }]])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":36,"value":"graph_container = html`

`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":16,"value":"cytoscape = require(\"cytoscape@3.22.1/dist/cytoscape.min.js\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":78,"value":"cytoscape.use(d3Force)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":49,"value":"d3Force = require('cytoscape-d3-force');","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":165,"value":"graph_container_id = \"graph_container\"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":25,"value":"$3b","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":188,"value":"function getBridges(graph) {\n const visited = new Map,\n bridges = new Set(graph.edges().toArray());\n\n function dfs(previous, current, depth) {\n visited.set(current, depth);\n let cycleParent = depth+1; // = No cycle\n for (let edge of current.connectedEdges().toArray()) {\n // Get other node on this edge\n const next = edge.source() === current ? edge.target() : edge.source();\n if (next === previous) continue; // Already visited this edge\n // Either already visited this node, or recursion is initiated\n const cycle = visited.get(next) || dfs(current, next, depth+1);\n if (cycle <= depth) bridges.delete(edge); // Edge is on a cycle\n if (cycle < cycleParent) cycleParent = cycle;\n }\n return cycleParent;\n }\n dfs(null, graph.nodes()[0], 1);\n return bridges;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W3c","stdlib":"1"}} 3a:"$39:body"