Visjs

Visjs, versions:

vis-data → 6.6.1
vis-graph3d → 5.9.8
vis-network → 7.10.2
vis-timeline → 7.3.7
vis-util → 4.3.4

Example based on Vis Network Examples

Template: 

<div class="container"> <style> #mynetwork { width: 600px; height: 400px; border: 1px solid lightgray; } </style> <p>Create a simple network with some nodes and edges.</p> <div id="mynetwork"></div> </div>

Script:

SR.render({}, async () => { await eval(await fetch('https://cdnjs.cloudflare.com/ajax/libs/vis-data/6.6.1/dist/umd.js').then((res) => res.text())); await eval(await fetch('https://cdnjs.cloudflare.com/ajax/libs/vis-network/8.5.4/standalone/umd/vis-network.min.js').then((res) => res.text())); // create an array with nodes var nodes = new vis.DataSet([{ id: 1, label: "Node 1" }, { id: 2, label: "Node 2" }, { id: 3, label: "Node 3" }, { id: 4, label: "Node 4" }, { id: 5, label: "Node 5" } ]); // create an array with edges var edges = new vis.DataSet([{ from: 1, to: 3 }, { from: 1, to: 2 }, { from: 2, to: 4 }, { from: 2, to: 5 }, { from: 3, to: 3 } ]); // create a network var container = document.getElementById("mynetwork"); var data = { nodes: nodes, edges: edges }; var options = {}; var network = new vis.Network(container, data, options); });