Documentation Index
Fetch the complete documentation index at: https://mintlify.com/OmarMtya/enginejs-module/llms.txt
Use this file to discover all available pages before exploring further.
Transform is the visual descriptor attached to every Figura. It holds the canvas coordinates, the dimensions (width, height, or radius), the CSS fill color, and optional Imagen and Sonido components. The animation loop reads Transform every frame to draw the figure at the correct position with the correct appearance.
Constructor
new Transform({ x, y, altura, anchura, radio, relleno, imagen, sonido })
Horizontal position on the canvas in pixels. Measured from the left edge.
For rectangles and images,
x is the left edge of the figure. For circles,
x is the center point.Vertical position on the canvas in pixels.
0 is the top edge. For
rectangles and images, y is the top edge of the figure. For circles, y is
the center point. Gravity increases y to move the figure downward.Height of the figure in pixels. Used for rectangles (
'cuadrado') and images
('imagen'). For circles, this is set automatically from radio when radio
is non-zero.Width of the figure in pixels. Used for rectangles and images. For circles,
this is set automatically from
radio when radio is non-zero.Radius of a circle figure in pixels. When this value is non-zero, the
constructor sets both
anchura and altura to radio. This is required
because collision detection uses anchura and altura in its AABB
calculations even for circles.CSS color string used as the canvas fill style. Accepts any valid CSS color:
hex values,
rgb(), hsl(), or named colors. Ignored for figures of
tipo: 'imagen', which are rendered from imagen.src instead.Image or animated sprite to render. Only read by the engine when the parent
Figura has tipo: 'imagen'. When a Sprite is attached to the Imagen,
the engine calls DibujarSprite; otherwise it calls drawImage. See
Imagen.Sound component attached to this figure. The engine checks
sonido.activacion
during Figura.tocandoRigidos() to decide when to call .play() or
.pause() on the underlying HTMLAudioElement. See Sonido.Instance Properties
Current horizontal canvas position. Mutated directly by user code or by the
animation loop.
Current vertical canvas position. Mutated each frame by
afectarGravedad()
and clamped by tocandoFondo() and tocandoRigidos().Height in pixels. For circles, equal to
radio after construction.Width in pixels. For circles, equal to
radio after construction.Radius in pixels. Only meaningful for figures of
tipo: 'circulo'.CSS fill color string.
Notes on radio
When
radio is set to a non-zero value in the constructor, both anchura and
altura are overwritten with radio. Collision detection in Engine.js
uses AABB (anchura × altura) for all figure types, including circles, so
keeping all three values in sync is required for correct physics behavior.
Do not set radio alongside explicit anchura / altura values — radio
always wins.