This demo page showcases the standalone HypergraphPlotter class library imported as an ES module. It mounts the visualizer in a container and controls the layout programmatically.
import { HypergraphPlotter } from './hypergraph-plotter.js';
const plotter = new HypergraphPlotter('#plotter-mount', {
layoutType: 'spring-embedding',
edgePalette: 'warm-sunset',
showGrid: true,
pinOnDrag: false
});
plotter.setData({
vertices: [
{ id: 'v1', label: 'A' },
{ id: 'v2', label: 'B' },
{ id: 'v3', label: 'C' }
],
hyperedges: [
{ id: 1, vertices: ['v1', 'v2', 'v3'] }
]
});