<head>
<style> body { margin: 0; } </style>
<script type="importmap">{ "imports": {
"react": "https://esm.sh/react",
"react-dom": "https://esm.sh/react-dom/client"
}}</script>
</head>
<body>
<div id="graph"></div>
<script src="//unpkg.com/@babel/standalone"></script>
<script type="text/jsx" data-type="module">
import ForceGraph3D from 'https://esm.sh/react-force-graph-3d?external=react';
import React from 'react';
import { createRoot } from 'react-dom';
fetch('../datasets/blocks.json').then(res => res.json()).then(data => {
createRoot(document.getElementById('graph')).render(
<ForceGraph3D
graphData={data}
nodeLabel={node => `${node.user}: ${node.description}`}
nodeAutoColorBy="user"
linkDirectionalParticles={1}
/>
);
});
</script>
</body>