Adaptive label colors on a Treemap

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 automatically color Treemap labels so they standout over node background.

Related code

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

Demo

See the Pen
Drill-Down Treemap
by amCharts team (@amcharts)
on CodePen.0