Consistent radius of outer circles of a Force-Directed Tree

This demo shows how we can use adapters to make radius of node's outer circle be consistent, regardless of the size of the node.

To make that happen, all we need to do is to create adapters to fix outer circle's scale at 1 as well as add fixed number of pixels to its radius:

series.outerCircles.template.adapters.add("scale", function() {
  return 1;
});

series.outerCircles.template.adapters.add("radius", function(radius) {
  return radius + 5;
});
series.outerCircles.template.adapters.add("scale", function() {
  return 1;
});

series.outerCircles.template.adapters.add("radius", function(radius) {
  return radius + 5;
});

See the Pen Consistent width of outer circles of a Force-Directed Tree by amCharts team (@amcharts) on CodePen.

Posted in Uncategorized