ECharts Force-Directed Graph

An interactive force-directed network graph where nodes repel each other and edges pull connected nodes together — the simulation runs continuously so the layout self-organises and the user can drag any node to disturb the equilibrium. ECharts' graph series with `layout: 'force'`

Template details

  • chart
  • graph
  • network
  • force
  • node-link
  • echarts

When to use this template

This visualization excels at revealing complex, non-hierarchical relationships and emergent structures within a network. Analysts use it to explore how entities connect, identify central or influential nodes, and discover natural groupings or communities that might not be obvious in tabular data.

  • Data with distinct entities (nodes) and their connections (edges).
  • Relationships that are many-to-many, directed, or undirected.
  • Networks lacking a predefined hierarchy or linear flow.
  • Datasets where proximity or clustering of related items is meaningful.
  • When exploring the impact of individual nodes on the overall network.
  • Interactive analysis of dense, interconnected datasets.

Browse all Koan templates