Adaptive label colors on a Treemap

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.

Posted in Uncategorized