Sprites. Extend Node or NodeComponent?

If we’d like to have sprites, should a Sprite class extend Node due to the fact that it’s transform matrix would need to be different than a regular Node (a billboard transform), or should it be a component? But if it’s a node component, what happens when other node components like DOMComponent or MeshComponent are added? Perhaps those items will simply face the camera (their Z axis is always perpendicular to the screen, and rotation can only happen around the Z axis)?

I haven’t put much thoughts into sprites, but component communication is not an issue. In my current model, the chain is like this:


(Those are all components). You could add to the chain or replace parts of it as long as the same events are emitted and handled. E.g. for a parallax component it could call setPosition and setRotation or it could itself emit POSITION_CHANGED and ROTATION_CHANGED, or simply replace the transform component and communicate TRANSFORM_CHANGED to DOMELEMENT/MESH directly.

The ECS model specifically allows different components to depend on each other.

1 Like

@gadicc Makes sense about the communication and component dependencies. What I was asking slightly different though. A sprite is a 2D plane that always faces the camera (right?) and so I was wondering how we might achieve that. If we have a DOMElement component on a Node, would that mean that the Sprite component (communicating to the Transform component or acting as a transform component itself) update the DOMElement with a transform that make the DOMElement always face the camera? And if there’s a 3D Mesh, would that Mesh’s Z axis always point at the camera too? And what would happen if there is a Rotation component on the node and rotation is applied that involves the Z axis? Would rotation then be limited to the Z axis to that the Z axis itself always faces the camera? Or perhaps a better approach would be to have a component that is on the same level as DOMElement and Mesh, that depends on the Transform component, so that if you, for example, have a SpriteElement and Mesh on the same node, then applying rotation works like normal, but the Sprite filters the rotation and applies only Z-axis rotation, while the Mesh rotates like normal?

I think I answered my own question by writing them: I like the latter approach (the Sprite component filters rotation instead of making the whole Node’s transform behave like a sprite). You can imagine that animating the X rotation would make a Mesh rotate while nothing happens to the Sprite.

@joe, can you give me an example of when you’d want to use a sprite in a 3D world with an off-center camera?

But yeah, you could do it like you said… maybe just have a “SpriteRender extends DOMRenderer” or something and use that instead :>


I a Doom remake, rendered with DOM. :laughing: