API

Sprite Map Options

Sprite Map Options

The options parameter object, when creating a sprite map, contains a number of properties.

import { SpriteMap } from "@babylonjs/core/Sprites/spriteMap";
const spriteMap = new SpriteMap(name, atlasJSON, spriteTexture, options, scene);

Each option property helps the sprite map reserve the proper data buffers in memory and prepare the system for display.

  • stageSize: A Vector2 of the number of "tiles" in the system - default : Vector2(1,1)
  • outputSize: A Vector2 of size of the output plane in World Units - default : Vector2(1,1)
  • outputPosition: A Vector3 of position of the output plane in World Units - default : Vector3.Zero
  • outputRotation: A Vector3 of rotation of the output plane in World Units - default : Vector3.Zero
  • layerCount: An integer for the number of "layers" in the system - default : 1
  • maxAnimationFrames: The maximum number of frames in any animation on the sheet - default : 0
  • baseTile: The frame ID of the initial tile to propagate into the system - default : 0
  • flipU: A Boolean flag to trigger flipping the vertical results of the sprite after framing calculations - default : false
  • colorMultiply: A Vector3 that will multiply the final color value of the map - default : Vector3(1,1,1)
  • frameRotationDirection: SpriteMapFrameRotationDirection defines the rotation of the frames in the sprite map - default: SpriteMapFrameRotationDirection.CW

After initialization, you can change the rotation and position of the output plane by referencing the sprite map's position and rotation like a standard mesh. For any other option change (like stageSize or layerCount, etc.), it is recommended that you dispose of the map and re-initialize it with the correct options.

Examples of Option Properties

base tile used to fill whole grid: Base Tile Used To Fill Whole Grid outputSize changes size and ratio of plane: OutputSize Changes Size And Ratio Of Plane two layers individual sprites in layer 1 on top of base tile in layer 0: Two Layre Individual Sprites color multiplied by red: Color Multipled By Red usage of frameRotationDirection: Usage of frameRotationDirection