2e:null 2f:["$","title",null,{"children":"Graph layout with Dagre | Olivier Lange | Observable"}] 34:[] 32:{"id":"a935eda769b30cba","slug":"graph-layout-with-dagre","title":"Graph layout with Dagre","thumbnail":"9527522cb689e65c4bdb64a7f77a9aa8213f9b660997359f2f6a4cb47f6d2442","access_level":"public","create_time":"$D2019-02-07T18:20:41.627Z","update_time":"$D2019-02-07T23:23:32.540Z","view_time":null,"first_public_time":"$D2019-02-07T18:28:25.034Z","has_unpublished_edits":null,"fork":false,"stars":0,"starred":false,"owner":{"type":"team","id":"3febe0974a7138cb","login":"olange","name":"Olivier Lange","avatar_url":"https://avatars-next.observableusercontent.com/52639e5630d4e3e4e2772fe77680883002a0b9352d8dd7a649dbcb67b1e1fb3a","tier":"starter_2024"},"version":74,"publish_version":74,"role":null,"authored":false,"authors":[{"type":"individual","id":"deea7e78e25caede","login":"olange","name":"Olivier Lange","avatar_url":"https://avatars-next.observableusercontent.com/05f7623b298d024c8fdb05b03c59e2d52fe0349b7c85bced7cdea69e7dcb847a","tier":null}],"members":[{"type":"individual","id":"deea7e78e25caede","login":"olange","name":"Olivier Lange","avatar_url":"https://avatars-next.observableusercontent.com/05f7623b298d024c8fdb05b03c59e2d52fe0349b7c85bced7cdea69e7dcb847a","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"title":"Graph layout with Dagre","cells":[{"id":0,"value":"md`# Graph layout with Dagre`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":40,"value":"md`Lays out the [\\`Graph\\`](https://github.com/dagrejs/graphlib/wiki/API-Reference#graph-concepts) object from the [\\`@olange/a-graph-of-actors\\`](a-graph-of-actors) notebook, using the [Dagre](https://github.com/dagrejs/dagre/wiki#an-example-layout) library.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":30,"value":"html`\n

Layouted graph attributes

directed: ${graph.isDirected()};\n compound: ${graph.isCompound()};\n multigraph: ${graph.isMultigraph()}
width: ${graph.graph().width}; height: ${graph.graph().height}

\n\n

Positions of the layouted graph nodes

${node.label} ${nid} ‹x:${Math.floor(node.x)}; y:${Math.floor(node.y)}; w:${node.width}; h:${node.height}›

\n\n

List of edges in the layouted graph

\n ${edge.v} ⟶ ${edge.w}\n points: [ ${label.points.map( point => `‹x:${Math.floor(point.x)}; y:${Math.floor(point.y)}›`)} ]\n

\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":20,"value":"layoutedGraph = {\n dagre.layout( graph);\n return graph;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":5,"value":"import { graph } from \"@olange/a-graph-of-actors\";","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2,"value":"dagre = require('dagre@0.8.4/dist/dagre.min.js')","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":44,"value":"md`---\n### Source\n\n[Dagre › Wiki › Example layout](https://github.com/dagrejs/dagre/wiki#an-example-layout)`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W34","stdlib":"1","titling":"auto"}} 33:"$32:body"