amcharts / amcharts5

The newest, fastest, and most advanced amCharts charting library for JavaScript and TypeScript apps.
Other
353 stars 95 forks source link

Add an additional check for cases where the value of the bullet label goes outside the series #1715

Closed dmytro-kuz closed 2 months ago

dmytro-kuz commented 2 months ago

Question

Hi. I'd like to add an additional check for cases where the value of the bullet label goes outside the series. In such cases, I want to hide it. This check should apply not only to bar charts but also to row charts.

As far as I understand, this can be achieved with the help of adapters. We need to define the height of the bullet label and the height of the series. With these values, I will be able to add validation and hide the total value if it is out of range. Therefore, could you please tell me how to determine these values correctly?

CodePen: https://codepen.io/Dmytro-Kuz/pen/OJedOdY?editors=0010

Additional context

image

martynasma commented 2 months ago

Just add oversizedBehavior: "hide" to your bullet label:

series.bullets.push(function () {
  return am5.Bullet.new(root, {
    locationY: 1,
    sprite: am5.Label.new(root, {
      text: "{valueY}",
      fill: am5.color(0x000000),
      centerY: am5.p0,
      centerX: am5.p50,
      populateText: true,
      fontSize: 26,
      oversizedBehavior: "hide"
    })
  });
});
dmytro-kuz commented 2 months ago

thanks