Fruchterman

2 min read
Fruchterman is a kind of force-directed layout. G6 implements it according to the paper Graph Drawing by Force-directed Placement.
img
const graph = new G6.Graph({
  container: 'mountNode',
  width: 1000,
  height: 600,
  layout: {
    type: 'fruchterman',
    center: [200, 200], // The center of the graph by default
    gravity: 20,
    speed: 2,
    clustering: true,
    clusterGravity: 30,
    maxIteration: 2000,
    workerEnabled: true, // Whether to activate web-worker
    gpuEnabled: true, // Whether to enable the GPU parallel computing, supported by G6 4.0
  },
});

If you want to fix the positions for some nodes during calculation, assign fx and fy for the nodes as fixing positions. Demo for fixing node.

layoutCfg.center

Type: Array
Example: [ 0, 0 ]
Default: The center of the graph
Required: false
Description: The center of the layout

layoutCfg.maxIteration

Type: Number
Default: 1000
Required: false
Description: The maximum iteration number

layoutCfg.gravity

Type: Number
Default: 10
Required: false
Description: The gravity, which will affect the compactness of the layout

layoutCfg.speed

Type: Number
Default: 1
Required: false
Description: The moving speed of each iteraction. Large value of the speed might lead to violent swing

layoutCfg.clustering

Type: Boolean
Default: false
Required: false
Description: Whether to layout by cluster

layoutCfg.clusterGravity

Type: Number
Default: 10
Required: false
Description: The gravity of each cluster, which will affect the compactness of each cluster. Takes effect only when clustering is true

layoutCfg.workerEnabled

Type: Boolean
Default: false
Required: false
Description: Whether to enable the web-worker in case layout calculation takes too long to block page interaction

layoutCfg.gpuEnabled

Type: Boolean
Default: false
Required: false
Description: Whether to enable the GPU parallel computing, supported by G6 4.0. If the machine or browser does not support GPU computing, it will be degraded to CPU computing automatically. The performance improvement: