2f:null 30:["$","title",null,{"children":"Cytoscape 3d-force layout testing for a notebook | Figay | Observable"}] 35:T50d,myCy = { cytoscape.use(d3Force); // cytoscape.use(cytoscapeCola); // cytoscape.use(fcose); // cytoscape.use(cose_bilkent); // cytoscape.use(avsdf); // cytoscape.use(cise); // cytoscape.use(spread); // cytoscape.use(klay); // cytoscape.use(euler); // cytoscape.use(elk); // cytoscape.use(dagre); var cy = cytoscape({ container: document.getElementById("myGraph"), layout: { name: layout, animate: true, fixedAfterDragging: false, linkId: function id(d) { return d.id; }, //linkDistance: 80, // manyBodyStrength: -800, radialX: 10, radialY: 10, radialRadius: 200, radialStrength: 1, xStrength: null, yStrength: null, //manyBodyStrength: -800, //collideRadius: 10, //collideStrength: 1, fit: false, ready: function () {}, stop: function () {}, tick: function (progress) { console.log("progress - ", progress); }, randomize: false, infinite: false }, style: [ { selector: "edge", style: { "curve-style": "bezier", "target-arrow-shape": "triangle" } } ], elements: createData(10), wheelSensitivity: 0.5 }); return cy; }36:[] 33:{"id":"836af766dff5be8c","slug":"cytoscape-3d-force-layout-testing-for-a-notebook","title":"Cytoscape 3d-force layout testing for a notebook","thumbnail":"0cf9fbfa0a7fc78a79350c45052bfb832920ffc12395a8a6b94fdd245f6f5377","access_level":"public","create_time":"$D2022-01-09T10:55:19.256Z","update_time":"$D2022-01-11T10:36:31.497Z","view_time":null,"first_public_time":"$D2022-01-09T12:45:03.589Z","fork":false,"stars":0,"starred":false,"owner":{"type":"team","id":"37f7a7f77e187b5e","login":"nfigay","name":"Figay","avatar_url":"https://avatars-next.observableusercontent.com/071fc1ce1d8fbec71d4409987642a0c881b8a3651627b51e2cdaa7fcde295a10","tier":"starter_2024"},"version":451,"publish_version":451,"role":null,"authored":false,"authors":[{"type":"individual","id":"71983294fb89ee80","login":"nfigay","name":"Figay","avatar_url":"https://avatars-next.observableusercontent.com/604017b640b1f50c2b41a96fcf316faa227738b7b2b4d0f6221ace789ebbfd42","tier":null}],"members":[{"type":"individual","id":"71983294fb89ee80","login":"nfigay","name":"Figay","avatar_url":"https://avatars-next.observableusercontent.com/604017b640b1f50c2b41a96fcf316faa227738b7b2b4d0f6221ace789ebbfd42","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"title":"Cytoscape 3d-force layout testing for a notebook","cells":[{"id":0,"value":"

Cytoscape 3d-force layout testing for a notebook

","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":446,"value":"My Cytoscape graph (myGraph):","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":104,"value":"graph = html`

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":400,"value":"My cytoscape:","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":23,"value":"$35","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":405,"value":"Layout selection:","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":236,"value":"viewof layout = Inputs.select(\n [\n // \"avsdf\",\n // \"breadthfirst\",\n // \"cise\",\n // \"cola\",\n // \"concentric\",\n // \"cose-bilkent\",\n // \"dagre\",\n \"d3-force\"\n // \"elk\",\n // \"fcose\",\n // \"grid\",\n // \"klay\",\n // \"spread\"\n ],\n {\n label: \"Select one\"\n }\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":409,"value":"

Data creation

","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":419,"value":"Data as inputs for the cytoscape:","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":66,"value":"data = {\n return createData(100);\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":415,"value":"Aggregation of nodes and edges:","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":35,"value":"function createData(num) {\n let nodes = createNodes(num);\n let edges = createEdges(nodes, num);\n // let edges = [];\n return nodes.concat(edges);\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":423,"value":"Function for the creation of edges:","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":39,"value":"function createEdges(nodes, num) {\n let edges = [];\n for (let i = 0; i < num - 1; i++) {\n let target = nodes[i + 1].data.id;\n let source = nodes[Math.floor(Math.sqrt(i))].data.id;\n let edge = {\n target,\n source,\n id: createId(\"edge_\"),\n group: edgegroup[Math.floor(Math.random() * edgegroup.length)],\n time:\n year[Math.floor(Math.random() * year.length)] +\n \"-\" +\n Math.ceil(Math.random() * 12) +\n \"-\" +\n Math.ceil(Math.random() * 30)\n };\n edge.label = \"edge\" + i;\n edge.name = \"edge\" + i;\n\n edges.push({\n data: edge,\n group: \"edges\",\n id: edge.id\n });\n }\n return edges;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":431,"value":"Function for the creation of Identifiers:","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":43,"value":"function createId(salt, randomLength = 8) {\n return (\n (salt || \"\") +\n Number(\n Math.random().toString().substr(3, randomLength) + Date.now()\n ).toString(36)\n );\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":427,"value":"Function for the creation of nodes:","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":47,"value":"function createNodes(num) {\n let datas = [];\n for (let i = 0; i < num; i++) {\n let _groupId = group[Math.floor(Math.random() * group.length)];\n let data = {\n id: createId(\"node_\"),\n position: {\n x: Math.random() * MAX_X,\n y: Math.random() * MAX_Y\n },\n group: _groupId,\n parent: _groupId\n };\n data.label = data.group + \"-node\" + i;\n datas.push({\n group: \"nodes\",\n data,\n id: data.id\n });\n }\n return datas;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":435,"value":"Function of the creation of children:","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":95,"value":"function createChildren(id, num) {\n let nodes = createNodes(num);\n let edges = createEdgesFromId(nodes, id);\n return nodes.concat(edges);\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":439,"value":"Function for creating edges from an Identifier:","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":98,"value":"function createEdgesFromId(nodes, id) {\n let edges = nodes.map((node) => {\n return {\n group: \"edges\",\n data: {\n target: node.data.id,\n source: id,\n id: createId(\"edge_\"),\n group: edgegroup[Math.floor(Math.random() * edgegroup.length)],\n label: node.data.id + \"-\" + id,\n name: node.data.id + \"-\" + id\n }\n };\n });\n return edges;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":50,"value":"MAX_Y = 200","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":53,"value":"MAX_X = 200","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":56,"value":"edgegroup = [\"has\", \"goto\", \"love\"]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":59,"value":"group = [\n \"hospital\",\n \"clothes\",\n \"computer\",\n \"person\",\n \"flower\",\n \"tree\",\n \"desk\",\n \"house\",\n \"water\",\n \"cup\"\n]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":62,"value":"year = [\"2017\", \"2018\", \"2019\"]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":387,"value":"

Libraries

","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":384,"value":"cytoscape = require(\"cytoscape@3.20.0/dist/cytoscape.min.js\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":396,"value":"d3 = require(\"d3@6\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":392,"value":"d3Force = (await import(\"https://cdn.skypack.dev/cytoscape-d3-force@1.1.4?min\"))\n .default","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":114,"value":"cytoscapeCola = (\n await import(\"https://cdn.skypack.dev/cytoscape-cola@2.5.0?min\")\n).default","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":129,"value":"fcose = (await import(\"https://cdn.skypack.dev/cytoscape-fcose@latest\")).default","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":136,"value":"cose_bilkent = (\n await import(\"https://cdn.skypack.dev/cytoscape-cose-bilkent@latest\")\n).default","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":179,"value":"avsdf = (await import(\"https://cdn.skypack.dev/cytoscape-avsdf@latest\")).default","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":187,"value":"cise = (await import(\"https://cdn.skypack.dev/cytoscape-cise@latest\")).default","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":197,"value":"spread = (await import(\"https://cdn.skypack.dev/cytoscape-spread@latest\"))\n .default","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":203,"value":"klay = (await import(\"https://cdn.skypack.dev/cytoscape-klay@latest\")).default","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":208,"value":"euler = (await import(\"https://cdn.skypack.dev/cytoscape-euler@latest\")).default","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":216,"value":"elk = (await import(\"https://cdn.skypack.dev/cytoscape-elk@latest\")).default","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":222,"value":"dagre = (await import(\"https://cdn.skypack.dev/cytoscape-dagre@latest\")).default","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W36","stdlib":"1","titling":"auto"}} 34:"$33:body"