Créer des bords (glisser et cliquer)
La création de contours est intégrée, avec deux styles d'interaction soutenus par un aperçu en direct du "bord fantôme": clic-clic (cliquez sur un nœud source, puis sur une cible) et drag-and-drop (faites glisser d'un nœud à un autre).
Cliquez sur Modifier le graphique (en haut à droite), puis sur Ajouter un bord et connectez deux nœuds – ou faites simplement glisser d'un nœud à un autre. Chaque nouveau bord déclenche l'événement de données edgeAdd, qui porte ici un toast.
js
// Edge creation lives in the full UI mode. Turn it on and the toolbar's
// Edit Graph → Add Edge starts a click-click (or drag) connect session — the
// shadow-edge preview and both interaction styles come for free.
const options = {
// Off: `full` mode brings a minimap and the data dock, and this card is about
// neither (see the Minimap and Data table cards for those).
UI: { mode: 'full', minimap: false, table: false }
}js
const data = {
nodes: [
{ id: 'alice', data: { label: 'Alice' } },
{ id: 'bob', data: { label: 'Bob' } },
{ id: 'carol', data: { label: 'Carol' } },
{ id: 'dave', data: { label: 'Dave' } },
{ id: 'erin', data: { label: 'Erin' } }
],
edges: [
{ from: 'alice', to: 'bob' },
{ from: 'alice', to: 'carol' }
]
}