Published
Edited
Sep 19, 2022
1 fork
2 stars
Insert cell
Insert cell
Orb = require("@memgraph/orb@0.1/dist/browser/orb.js")
Insert cell
{
const container = htl.html`<div style="border: 1px solid #e0e0e0; width: 600px; height: 600px;">`;
yield container; // needs to be added to the DOM before we call Orb

const nodes = [
{ id: 1, label: "Orb" },
{ id: 2, label: "Graph" },
{ id: 3, label: "Canvas" }
];
const edges = [
{ id: 1, start: 1, end: 2, label: "DRAWS" },
{ id: 2, start: 2, end: 3, label: "ON" }
];

// First `Orb` is just a namespace of the JS package
const orb = new Orb.Orb(container);

// Initialize nodes and edges
orb.data.setup({ nodes, edges });

// Render and recenter the view
orb.view.render(() => {
orb.view.recenter();
});
}
Insert cell

Purpose-built for displays of data

Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
Learn more