Map with pulsating bullets not working with nonScaling

[fgildner]

Hi everyone,

I am trying to use the map with pulsating bullets and it works very fine. But i need the nonScaling of the circles.

When i set the two mapImages (circle, circle2) with:

circle.nonScaling = true; circle2.nonScaling = true;

Then the pulsating is not working anymore. I did not found anything about that in the documentation and the issues

Codepen: https://codepen.io/gilfra/pen/mdWbyzz

How can I use pulsating and nonScaling at the same time?

[martynasma]

Well, the pulsation function is achieved by animating scale property of the bullet. Since you set nonScaling, the scale setting is ignored, hence no animation.

You can disable nonScaling and adjust for zoom level in animation function:

function animateBullet(circle) {
    var animation = circle.animate([{ property: "scale", from: 1 / chart.zoomLevel, to: 5 / chart.zoomLevel }, { property: "opacity", from: 1, to: 0 }], 1000, am4core.ease.circleOut);
    animation.events.on("animationended", function(event){
      animateBullet(event.target.object);
    })
}

[martynasma]

P.S. updated official demo as per above.

[fgildner]

Thank you! That's working fine