Treemap with auto-colored labels

This is a demo tutorial. While there is no step-by-step commentary available (yet), the live demo below is fully functional. Feel free to open it for full source code.

This demo shows how we can use adapters to pick a contrasting color for Treemap labels.

Code

series.labels.template.adapters.add("fill", function(fill, target) {
  if (target.dataItem) {
    return am5.Color.alternative(
      target.dataItem.get("rectangle").get("fill"),
      am5.color(0xffffff),
      am5.color(0x000000)
    );
  }
  return fill;
});

series.labels.template.adapters.add("fill", function(fill, target) {
  if (target.dataItem) {
    return am5.Color.alternative(
      target.dataItem.get("rectangle").get("fill"),
      am5.color(0xffffff),
      am5.color(0x000000)
    );
  }
  return fill;
});

Example

See the Pen Treemap with auto-colored labels by amCharts team (@amcharts) on CodePen.