PixiJS map pin pulse: 3 beats and stop with NixieFX

An objective marker on a game map has one primary job: helping players find their destination. However, if every single pin on the map pulses continuously, it turns into visual noise where nothing stands out. This post explores building a tracked objective pin in PixiJS 8 using particle effects from NixieFX with a strict attention budget, pulsing three times upon opening the map, skipping beats while off-screen, and then stopping completely.

This demonstration runs on pixi.js 8.22.0 and nixie-fx 0.1.20, stepped on a fixed 1/60 second clock. The effect is a single one-shot pulse featuring two emitters: a soft glow that grows and fades over 0.7 seconds, and a ring of 14 sparks moving outward over roughly 0.8 seconds. It does not loop on its own, allowing game code to dictate when to fire it again so all stop conditions stay in one centralized place.

Stock photo for illustration only, not from the actual event

The demo map features 30 pins across an 1100 by 720 map viewed through a 640 by 400 canvas, meaning 9 pins are on screen at a time. Each run lasts 8 seconds, with real WebGL draw calls counted by wrapping drawArrays and drawElements. Every scenario executed three times, yielding identical draw counts consistently across all runs.