Class ParticleEmitter

Particle Emitter Object.

Hierarchy (view full)

Container
- ParticleEmitter

Index

Constructors

constructor

Accessors

bottom centerX centerY depth height inViewport isFlippedX isFlippedY isFloating left parentApp right tint top width

Constructors

constructor

new ParticleEmitter(x, y, settings?): ParticleEmitter
Parameters
- x: number
  x position of the particle emitter
- y: number
  y position of the particle emitter
- Optionalsettings: {
      angle: number;
      angleVariation: number;
      blendMode: string;
      duration: number;
      floating: boolean;
      followTrajectory: boolean;
      framesToSkip: number;
      frequency: number;
      gravity: number;
      height: number;
      image: HTMLCanvasElement;
      maxEndScale: number;
      maxLife: number;
      maxParticles: number;
      maxRotation: number;
      maxStartScale: number;
      minEndScale: number;
      minLife: number;
      minRotation: number;
      minStartScale: number;
      onlyInViewport: boolean;
      speed: number;
      speedVariation: number;
      textureAdditive: boolean;
      textureSize: number;
      tint: string;
      totalParticles: number;
      width: number;
      wind: number;
  } = {}
  the settings for the particle emitter.
  - angle: number
    Start angle for particle launch in Radians
    Default
    Math.PI / 2
  - angleVariation: number
    letiation in the start angle for particle launch in Radians.
    Default
    0
  - blendMode: string
    the blend mode to be applied when rendering particles. (note: this will superseed the textureAdditive setting if different than "normal")
    Default
    normal
    
    See
    
    CanvasRenderer#setBlendMode
    
    WebGLRenderer#setBlendMode
  - duration: number
    Duration that the emitter releases particles in ms (used only if emitter is Stream). After this period, the emitter stop the launch of particles.
    Default
    Infinity
  - floating: boolean
    Render particles in screen space.
    Default
    false
  - followTrajectory: boolean
    Update the rotation of particle in accordance the particle trajectory.
    The particle sprite should aim at zero angle (draw from left to right).
    Override the particle minRotation and maxRotation.
    Default
    false
  - framesToSkip: number
    Skip n frames after updating the particle system once. This can be used to reduce the performance impact of emitters with many particles.
    Default
    0
  - frequency: number
    How often a particle is emitted in ms (used only if emitter is a Stream).
    Default
    100
  - gravity: number
    Vertical force (Gravity) for each particle
    Default
    0
    
    See
    World.gravity
  - height: number
    Height of the particle spawn area
    Default
    1
  - image: HTMLCanvasElement
    image used for particles texture (by default melonJS will create an white 8x8 texture image)
    Default
    undefined
    
    See
    textureSize
  - maxEndScale: number
    Maximum end scale ratio for particles
    Default
    0
  - maxLife: number
    Maximum time each particle lives once it is emitted in ms.
    Default
    3000
  - maxParticles: number
    Maximum number of particles launched each time in this emitter (used only if emitter is Stream).
    Default
    10
  - maxRotation: number
    Maximum start rotation for particles sprites in Radians
    Default
    0
  - maxStartScale: number
    Maximum start scale ratio for particles (1 = no scaling)
    Default
    1
  - minEndScale: number
    Minimum end scale ratio for particles
    Default
    0
  - minLife: number
    Minimum time each particle lives once it is emitted in ms.
    Default
    1000
  - minRotation: number
    Minimum start rotation for particles sprites in Radians
    Default
    0
  - minStartScale: number
    Minimum start scale ratio for particles (1 = no scaling)
    Default
    1
  - onlyInViewport: boolean
    Update particles only in the viewport, remove it when out of viewport.
    Default
    true
  - speed: number
    Start speed of particles.
    Default
    2
  - speedVariation: number
    letiation in the start speed of particles
    Default
    1
  - textureAdditive: boolean
    Enable the Texture Additive by composite operation ("additive" blendMode)
    Default
    false
    
    See
    blendMode
  - textureSize: number
    default texture size used for particles if no image is specified (by default melonJS will create an white 8x8 texture image)
    Default
    8
    
    See
    image
  - tint: string
    tint to be applied to particles
    Default
    "#fff"
  - totalParticles: number
    Total number of particles in the emitter
    Default
    50
  - width: number
    Width of the particle spawn area.
    Default
    1
  - wind: number
    Horizontal force (like a Wind) for each particle
    Default
    0
Returns ParticleEmitter
Example
```
// Create a particle emitter at position 100, 100
let emitter = new ParticleEmitter(100, 100, {
    width: 16,
    height : 16,
    tint: "#f00",
    totalParticles: 32,
    angle: 0,
    angleVariation: 6.283185307179586,
    maxLife: 5,
    speed: 3
});

// Add the emitter to the game world
me.game.world.addChild(emitter);

// Launch all particles one time and stop, like a explosion
emitter.burstParticles();

// Launch constantly the particles, like a fountain
emitter.streamParticles();

// At the end, remove emitter from the game world
// call this in onDestroyEvent function
me.game.world.removeChild(emitter);
```
Overrides Container.constructor
- Defined in packages/melonjs/src/particles/emitter.js:55

Properties

GUID

GUID: string

(G)ame (U)nique (Id)entifier"
a GUID will be allocated for any renderable object added
to an object container (including the me.game.world container)

_defaultParticle

_defaultParticle: undefined | CanvasRenderTarget

_dt

_dt: number

_updateCount

_updateCount: number

alpha

alpha: number

Define the renderable opacity
Set to zero if you do not wish an object to be drawn

See

Renderable#setOpacity
Renderable#getOpacity

Default

1.0

alwaysUpdate

alwaysUpdate: boolean

Whether the renderable object will always update, even when outside of the viewport

Default

false

ancestor

ancestor: Container | Entity

a reference to the parent object that contains this renderable

Default

undefined

anchorPoint

anchorPoint: ObservablePoint

The anchor point is used for attachment behavior, and/or when applying transformations.
The coordinate system places the origin at the top left corner of the frame (0, 0) and (1, 1) means the bottom-right corner

a Renderable's anchor point defaults to (0.5,0.5), which corresponds to the center position.

Note: Object created through Tiled will have their anchorPoint set to (0, 0) to match Tiled Level editor implementation. To specify a value through Tiled, use a json expression like json:{"x":0.5,"y":0.5}.

Default

<0.5,0.5>

autoDepth

autoDepth: boolean

Specify if the children z index should automatically be managed by the parent container

Default

true

autoSort

autoSort: boolean

Specify if the children list should be automatically sorted when adding a new child

Default

true

autoTransform

autoTransform: boolean

When enabled, an object container will automatically apply any defined transformation before calling the child draw method.

Default

true

Example

// enable "automatic" transformation when the object is activated
onActivateEvent: function () {
    // reset the transformation matrix
    this.currentTransform.identity();
    // ensure the anchor point is the renderable center
    this.anchorPoint.set(0.5, 0.5);
    // enable auto transform
    this.autoTransform = true;
    ....
}

backgroundColor

backgroundColor: Color

define a background color for this container

Default

(0, 0, 0, 0.0)

Example

// add a red background color to this container
this.backgroundColor.setColor(255, 0, 0);

blendMode

blendMode: string

the blend mode to be applied to this renderable (see renderer setBlendMode for available blend mode)

Default

"normal"

See

CanvasRenderer#setBlendMode
WebGLRenderer#setBlendMode

body

body: Body

the renderable physic body

Example

// define a new Player Class
 class PlayerEntity extends me.Sprite {
     // constructor
     constructor(x, y, settings) {
         // call the parent constructor
         super(x, y , settings);

         // define a basic walking animation
         this.addAnimation("walk",  [...]);
         // define a standing animation (using the first frame)
         this.addAnimation("stand",  [...]);
         // set the standing animation as default
         this.setCurrentAnimation("stand");

         // add a physic body
         this.body = new me.Body(this);
         // add a default collision shape
         this.body.addShape(new me.Rect(0, 0, this.width, this.height));
         // configure max speed, friction, and initial force to be applied
         this.body.setMaxVelocity(3, 15);
         this.body.setFriction(0.4, 0);
         this.body.force.set(3, 0);
         this.isKinematic = false;

         // set the display to follow our position on both axis
         me.game.viewport.follow(this.pos, me.game.viewport.AXIS.BOTH);
     }

     ...

}

clipping

clipping: boolean

Specify if the container draw operation should clip his children to its own bounds

Default

false

currentTransform

currentTransform: Matrix2d

the renderable default transformation matrix

edges

edges: Vector2d[]

The edges here are the direction of the nth edge of the polygon, relative to the nth point. If you want to draw a given edge from the edge value, you must first translate to the position of the starting point.

enableChildBoundsUpdate

enableChildBoundsUpdate: boolean

Specify if the container bounds should automatically take in account all child bounds when updated (this is expensive and disabled by default, only enable if necessary)

Default

false

floating

floating: boolean

If true, this renderable will be rendered using screen coordinates, as opposed to world coordinates. Use this, for example, to define UI elements.

Default

false

indices

indices: number[]

a list of indices for all vertices composing this polygon

isDirty

isDirty: boolean

when true the renderable will be redrawn during the next update cycle

Default

true

isKinematic

isKinematic: boolean

If true then physic collision and input events will not impact this renderable

Default

true

isPersistent

isPersistent: boolean

make the renderable object persistent over level changes

Default

false

mask

A mask limits rendering elements to the shape and position of the given mask object. So, if the renderable is larger than the mask, only the intersecting part of the renderable will be visible.

Default

undefined

Example

// apply a mask in the shape of a Star
myNPCSprite.mask = new me.Polygon(myNPCSprite.width / 2, 0, [
   // draw a star
   {x: 0, y: 0},
   {x: 14, y: 30},
   {x: 47, y: 35},
   {x: 23, y: 57},
   {x: 44, y: 90},
   {x: 0, y: 62},
   {x: -44, y: 90},
   {x: -23, y: 57},
   {x: -47, y: 35},
   {x: -14, y: 30}
]);

name

name: string

The name of the renderable

Default

""

onChildChange

onChildChange: (() => void)

a callback to be extended, triggered after a child has been added or removed

onVisibilityChange

onVisibilityChange: Function

an event handler that is called when the renderable leave or enter a camera viewport

Default

undefined

Example

this.onVisibilityChange = function(inViewport) {
    if (inViewport === true) {
        console.log("object has entered the in a camera viewport!");
    }
};

points

points: Vector2d[]

Array of points defining the Polygon
Note: If you manually change points, you must call recalcafterwards so that the changes get applied correctly.

pos

pos: Vector2d

origin point of the Polygon

root

root: boolean

whether the container is the root of the scene

Default

false

settings

settings: {
    angle: number;
    angleVariation: number;
    blendMode: string;
    duration: number;
    floating: boolean;
    followTrajectory: boolean;
    framesToSkip: number;
    frequency: number;
    gravity: number;
    height: number;
    image: HTMLCanvasElement;
    maxEndScale: number;
    maxLife: number;
    maxParticles: number;
    maxRotation: number;
    maxStartScale: number;
    minEndScale: number;
    minLife: number;
    minRotation: number;
    minStartScale: number;
    onlyInViewport: boolean;
    speed: number;
    speedVariation: number;
    textureAdditive: boolean;
    textureSize: number;
    tint: string;
    totalParticles: number;
    width: number;
    wind: number;
}

the current (active) emitter settings

Type declaration

angle: number
Start angle for particle launch in Radians
Default
```
Math.PI / 2
```
angleVariation: number
letiation in the start angle for particle launch in Radians.
Default
```
0
```
blendMode: string
the blend mode to be applied when rendering particles. (note: this will superseed the textureAdditive setting if different than "normal")
Default
```
normal
```
See
- CanvasRenderer#setBlendMode
- WebGLRenderer#setBlendMode
duration: number
Duration that the emitter releases particles in ms (used only if emitter is Stream). After this period, the emitter stop the launch of particles.
Default
```
Infinity
```
floating: boolean
Render particles in screen space.
Default
```
false
```
followTrajectory: boolean
Update the rotation of particle in accordance the particle trajectory.
The particle sprite should aim at zero angle (draw from left to right).
Override the particle minRotation and maxRotation.
Default
```
false
```
framesToSkip: number
Skip n frames after updating the particle system once. This can be used to reduce the performance impact of emitters with many particles.
Default
```
0
```
frequency: number
How often a particle is emitted in ms (used only if emitter is a Stream).
Default
```
100
```
gravity: number
Vertical force (Gravity) for each particle
Default
```
0
```
See
World.gravity
height: number
Height of the particle spawn area
Default
```
1
```
image: HTMLCanvasElement
image used for particles texture (by default melonJS will create an white 8x8 texture image)
Default
```
undefined
```
See
textureSize
maxEndScale: number
Maximum end scale ratio for particles
Default
```
0
```
maxLife: number
Maximum time each particle lives once it is emitted in ms.
Default
```
3000
```
maxParticles: number
Maximum number of particles launched each time in this emitter (used only if emitter is Stream).
Default
```
10
```
maxRotation: number
Maximum start rotation for particles sprites in Radians
Default
```
0
```
maxStartScale: number
Maximum start scale ratio for particles (1 = no scaling)
Default
```
1
```
minEndScale: number
Minimum end scale ratio for particles
Default
```
0
```
minLife: number
Minimum time each particle lives once it is emitted in ms.
Default
```
1000
```
minRotation: number
Minimum start rotation for particles sprites in Radians
Default
```
0
```
minStartScale: number
Minimum start scale ratio for particles (1 = no scaling)
Default
```
1
```
onlyInViewport: boolean
Update particles only in the viewport, remove it when out of viewport.
Default
```
true
```
speed: number
Start speed of particles.
Default
```
2
```
speedVariation: number
letiation in the start speed of particles
Default
```
1
```
textureAdditive: boolean
Enable the Texture Additive by composite operation ("additive" blendMode)
Default
```
false
```
See
blendMode
textureSize: number
default texture size used for particles if no image is specified (by default melonJS will create an white 8x8 texture image)
Default
```
8
```
See
image
tint: string
tint to be applied to particles
Default
```
"#fff"
```
totalParticles: number
Total number of particles in the emitter
Default
```
50
```
width: number
Width of the particle spawn area.
Default
```
1
```
wind: number
Horizontal force (like a Wind) for each particle
Default
```
0
```

shader

shader: GLShader

(Experimental) an optional shader, to be used instead of the default built-in one, when drawing this renderable (WebGL only)

Default

undefined

sortOn

sortOn: string

The property of the child object that should be used to sort on this container value : "x", "y", "z"

Default

"z"

type

type: string = "Rectangle"

The shape type (used internally).

updateWhenPaused

updateWhenPaused: boolean

Whether to update this object when the game is paused.

Default

false

Accessors

bottom

get bottom(): number
bottom coordinate of the Rectangle

Returns number
Inherited from Container.bottom
- Defined in packages/melonjs/src/geometries/rectangle.ts:68

centerX

get centerX(): number
absolute center of this rectangle on the horizontal axis

Returns number
Inherited from Container.centerX
- Defined in packages/melonjs/src/geometries/rectangle.ts:100
set centerX(value): void
Parameters
- value: number
Returns void
Inherited from Container.centerX
- Defined in packages/melonjs/src/geometries/rectangle.ts:107

centerY

get centerY(): number
absolute center of this rectangle on the vertical axis

Returns number
Inherited from Container.centerY
- Defined in packages/melonjs/src/geometries/rectangle.ts:116
set centerY(value): void
Parameters
- value: number
Returns void
Inherited from Container.centerY
- Defined in packages/melonjs/src/geometries/rectangle.ts:123

depth

get depth(): number
the depth of this renderable on the z axis

Returns number
Inherited from Container.depth
- Defined in packages/melonjs/src/renderable/renderable.js:357
set depth(value): void
Parameters
- value: number
Returns void
Inherited from Container.depth
- Defined in packages/melonjs/src/renderable/renderable.js:360

height

get height(): number
height of the Rectangle

Returns number
Inherited from Container.height
- Defined in packages/melonjs/src/geometries/rectangle.ts:88
set height(value): void
Parameters
- value: number
Returns void
Inherited from Container.height
- Defined in packages/melonjs/src/geometries/rectangle.ts:91

inViewport

get inViewport(): boolean
Whether the renderable object is visible and within the viewport

Returns boolean
Default
```
false
```
Inherited from Container.inViewport
- Defined in packages/melonjs/src/renderable/renderable.js:370
set inViewport(value): void
Parameters
- value: boolean
Returns void
Inherited from Container.inViewport
- Defined in packages/melonjs/src/renderable/renderable.js:373

isFlippedX

get isFlippedX(): boolean
returns true if this renderable is flipped on the horizontal axis

Returns boolean
See
Renderable#flipX
Inherited from Container.isFlippedX
- Defined in packages/melonjs/src/renderable/renderable.js:388

isFlippedY

get isFlippedY(): boolean
returns true if this renderable is flipped on the vertical axis

Returns boolean
See
Renderable#flipY
Inherited from Container.isFlippedY
- Defined in packages/melonjs/src/renderable/renderable.js:398

isFloating

get isFloating(): boolean
Whether the renderable object is floating (i.e. used screen coordinates), or contained in a floating parent container

Returns boolean
See
Renderable#floating
Inherited from Container.isFloating
- Defined in packages/melonjs/src/renderable/renderable.js:327

left

get left(): number
The left coordinate of the Rectangle.

Returns number
Inherited from Container.left
- Defined in packages/melonjs/src/geometries/rectangle.ts:46

parentApp

get parentApp(): Application
returns the parent application (or game) to which this renderable is attached to

Returns Application
the parent application or undefined if not attached to any container/app
Inherited from Container.parentApp
- Defined in packages/melonjs/src/renderable/renderable.js:309

right

get right(): number
right coordinate of the Rectangle

Returns number
Inherited from Container.right
- Defined in packages/melonjs/src/geometries/rectangle.ts:53

tint

get tint(): Color
define a tint for this renderable. a (255, 255, 255) r, g, b value will remove the tint effect.

Returns Color
Default
```
(255, 255, 255)
```
Example
```
// add a red tint to this renderable
this.tint.setColor(255, 128, 128);
// remove the tint
this.tint.setColor(255, 255, 255);
```
Inherited from Container.tint
- Defined in packages/melonjs/src/renderable/renderable.js:345
set tint(value): void
Parameters
- value: Color
Returns void
Inherited from Container.tint
- Defined in packages/melonjs/src/renderable/renderable.js:348

top

get top(): number
top coordinate of the Rectangle

Returns number
Inherited from Container.top
- Defined in packages/melonjs/src/geometries/rectangle.ts:61

width

get width(): number
width of the Rectangle

Returns number
Inherited from Container.width
- Defined in packages/melonjs/src/geometries/rectangle.ts:76
set width(value): void
Parameters
- value: number
Returns void
Inherited from Container.width
- Defined in packages/melonjs/src/geometries/rectangle.ts:79

Methods

addChild

addChild(child, z?): Renderable
Add a child to the container
if auto-sort is disable, the object will be appended at the bottom of the list. Adding a child to the container will automatically remove it from its other container. Meaning a child can only have one parent. This is important if you add a renderable to a container then add it to the World container it will move it out of the orginal container. Then when the World container reset() method is called the renderable will not be in any container.
if the given child implements a onActivateEvent method, that method will be called once the child is added to this container.
Parameters
- child: any
  Child to be added
- Optionalz: number
  forces the z index of the child to the specified value
Returns Renderable
the added child
Inherited from Container.addChild
- Defined in packages/melonjs/src/renderable/container.js:214

addChildAt

addChildAt(child, index): Renderable
Add a child to the container at the specified index
(the list won't be sorted after insertion)
Parameters
- child:
      | Draggable
      | Renderable
      | Entity
      | Sprite
      | Collectable
      | Trigger
      | DropTarget
      | NineSliceSprite
      | ImageLayer
      | ColorLayer
      | Light2d
      | UIBaseElement
      | UISpriteElement
      | UITextButton
      | Text
      | BitmapText
  Child to be added
- index: number
  The index at which to insert the child
Returns Renderable
the added child
Inherited from Container.addChildAt
- Defined in packages/melonjs/src/renderable/container.js:298

angleTo

angleTo(target): number
return the angle to the specified target
Parameters
- target: any
Returns number
angle in radians
Inherited from Container.angleTo
- Defined in packages/melonjs/src/renderable/renderable.js:484

burstParticles

burstParticles(total?): void
Launch all particles from emitter and stop (e.g. for explosion)
Parameters
- Optionaltotal: number
  number of particles to launch
Returns void
- Defined in packages/melonjs/src/particles/emitter.js:181

centerOn

centerOn(x, y): ParticleEmitter
center the rectangle position around the given coordinates
Parameters
- x: number
  the x coordinate around which to center this rectangle
- y: number
  the y coordinate around which to center this rectangle
Returns ParticleEmitter
this rectangle
Inherited from Container.centerOn
- Defined in packages/melonjs/src/geometries/rectangle.ts:135

clone

clone(): Rect
clone this rectangle

Returns Rect
new rectangle
Inherited from Container.clone
- Defined in packages/melonjs/src/geometries/rectangle.ts:169

contains

contains(x, y): boolean
Returns true if the polygon contains the given point.
(Note: it is highly recommended to first do a hit test on the corresponding
bounding rect, as the function can be highly consuming with complex shapes)
Parameters
- x: number
  x coordinate or a vector point to check
- y: number
  y coordinate
Returns boolean
True if the polygon contain the point, otherwise false
Example
```
if (polygon.contains(10, 10)) {
  // do something
}
// or
if (polygon.contains(myVector2d)) {
  // do something
}
```
Inherited from Container.contains
- Defined in packages/melonjs/src/geometries/rectangle.ts:217
contains(vector): boolean
Returns true if the polygon contains the given point.
(Note: it is highly recommended to first do a hit test on the corresponding
bounding rect, as the function can be highly consuming with complex shapes)
Parameters
- vector: Vector2d
Returns boolean
True if the polygon contain the point, otherwise false
Example
```
if (polygon.contains(10, 10)) {
  // do something
}
// or
if (polygon.contains(myVector2d)) {
  // do something
}
```
Inherited from Container.contains
- Defined in packages/melonjs/src/geometries/rectangle.ts:218

containsRectangle

containsRectangle(rectangle): boolean
Returns true if the rectangle contains the given rectangle
Parameters
- rectangle: Rect
  rectangle to test
Returns boolean
True if the rectangle contain the given rectangle, otherwise false
Example
```
if (rect.containsRectangle(myRect)) {
  // do something
}
```
Inherited from Container.containsRectangle
- Defined in packages/melonjs/src/geometries/rectangle.ts:249

copy

copy(rect): ParticleEmitter
copy the position and size of the given rectangle into this one
Parameters
- rect: Rect
  Source rectangle
Returns ParticleEmitter
new rectangle
Inherited from Container.copy
- Defined in packages/melonjs/src/geometries/rectangle.ts:178

distanceTo

distanceTo(target): number
return the distance to the specified target
Parameters
- target: any
Returns number
distance
Inherited from Container.distanceTo
- Defined in packages/melonjs/src/renderable/renderable.js:507

draw

draw(renderer, viewport?): void
draw this renderable (automatically called by melonJS)
Parameters
- renderer: CanvasRenderer | WebGLRenderer
  a renderer instance
- Optionalviewport: any
  the viewport to (re)draw
Returns void
Inherited from Container.draw
- Defined in packages/melonjs/src/renderable/container.js:941

equals

equals(rect): boolean
Check if this rectangle is identical to the specified one.
Parameters
- rect: Rect
  Other rectangle.
Returns boolean
true if equals
Inherited from Container.equals
- Defined in packages/melonjs/src/geometries/rectangle.ts:263

flipX

flipX(flip?): Renderable
flip the renderable on the horizontal axis (around the center of the renderable)
Parameters
- Optionalflip: boolean = true
  true to flip this renderable.
Returns Renderable
Reference to this object for method chaining

See
Matrix2d#scaleX
Inherited from Container.flipX
- Defined in packages/melonjs/src/renderable/renderable.js:448

flipY

flipY(flip?): Renderable
flip the renderable on the vertical axis (around the center of the renderable)
Parameters
- Optionalflip: boolean = true
  true to flip this renderable.
Returns Renderable
Reference to this object for method chaining

See
Matrix2d#scaleY
Inherited from Container.flipY
- Defined in packages/melonjs/src/renderable/renderable.js:460

forEach

forEach(callback, thisArg?): void
The forEach() method executes a provided function once per child element.
the callback function is invoked with three arguments:
- The current element being processed in the array
- The index of element in the array.
- The array forEach() was called upon.
Parameters
- callback: Function
  fnction to execute on each element
- OptionalthisArg: object
  value to use as this(i.e reference Object) when executing callback.
Returns void
Example
```
// iterate through all children of this container
container.forEach((child) => {
   // do something with the child
   child.doSomething();
});
container.forEach((child, index) => { ... });
container.forEach((child, index, array) => { ... });
container.forEach((child, index, array) => { ... }, thisArg);
```
Inherited from Container.forEach
- Defined in packages/melonjs/src/renderable/container.js:384

getAbsolutePosition

getAbsolutePosition(): Vector2d
return the renderable absolute position in the game world

Returns Vector2d
Inherited from Container.getAbsolutePosition
- Defined in packages/melonjs/src/renderable/renderable.js:647

getBounds

getBounds(): Bounds
returns the bounding box for this renderable

Returns Bounds
bounding box Rectangle object
Inherited from Container.getBounds
- Defined in packages/melonjs/src/renderable/renderable.js:406

getChildAt

getChildAt(index): Renderable
Returns the Child at the specified index
Parameters
- index: number
  The index of the child
Returns Renderable
the child at the specified index
Inherited from Container.getChildAt
- Defined in packages/melonjs/src/renderable/container.js:433

getChildByGUID

getChildByGUID(guid): Renderable
return the child corresponding to the specified GUID
note : avoid calling this function every frame since it parses the whole object list each time
Parameters
- guid:
      | string
      | number
      | boolean
      | RegExp
  child GUID
Returns Renderable
corresponding child or null
Inherited from Container.getChildByGUID
- Defined in packages/melonjs/src/renderable/container.js:560

getChildByName

getChildByName(name): Renderable[]
returns the list of childs with the specified name
as defined in Tiled (Name field of the Object Properties)
note : avoid calling this function every frame since it parses the whole object list each time
Parameters
- name:
      | string
      | number
      | boolean
      | RegExp
  child name
Returns Renderable[]
Array of children
Inherited from Container.getChildByName
- Defined in packages/melonjs/src/renderable/container.js:549

getChildByProp

getChildByProp(prop, value): Renderable[]

return the child corresponding to the given property and value.
note : avoid calling this function every frame since it parses the whole object tree each time

Parameters

prop: string
Property name
value:
    | string
    | number
    | boolean
    | RegExp
Value of the property

Returns Renderable[]

Array of childs

Example

// get the first child object called "mainPlayer" in a specific container :
let ent = myContainer.getChildByProp("name", "mainPlayer");

// or query the whole world :
let ent = container.getChildByProp("name", "mainPlayer");

// partial property matches are also allowed by using a RegExp.
// the following matches "redCOIN", "bluecoin", "bagOfCoins", etc :
let allCoins = container.getChildByProp("name", /coin/i);

// searching for numbers or other data types :
let zIndex10 = container.getChildByProp("z", 10);
let inViewport = container.getChildByProp("inViewport", true);

getChildByType

getChildByType(classType): Renderable[]
returns the list of childs with the specified class type
Parameters
- classType: object
  Class type
Returns Renderable[]
Array of children
Inherited from Container.getChildByType
- Defined in packages/melonjs/src/renderable/container.js:526

getChildIndex

getChildIndex(child): number
Returns the index of the given Child
Parameters
- child:
      | Draggable
      | Renderable
      | Entity
      | Sprite
      | Collectable
      | Trigger
      | DropTarget
      | NineSliceSprite
      | ImageLayer
      | ColorLayer
      | Light2d
      | UIBaseElement
      | UISpriteElement
      | UITextButton
      | Text
      | BitmapText
  The child object
Returns number
index
Inherited from Container.getChildIndex
- Defined in packages/melonjs/src/renderable/container.js:446

getChildren

getChildren(): Renderable[]
return all child in this container

Returns Renderable[]
an array of renderable object
Inherited from Container.getChildren
- Defined in packages/melonjs/src/renderable/container.js:569

getIndices

getIndices(): number[]
returns a list of indices for all triangles defined in this polygon

Returns number[]
an array of vertex indices for all triangles forming this polygon.
Inherited from Container.getIndices
- Defined in packages/melonjs/src/geometries/polygon.ts:266

getNextChild

getNextChild(child): Renderable
Returns the next child within the container or undefined if none
Parameters
- child:
      | Draggable
      | Renderable
      | Entity
      | Sprite
      | Collectable
      | Trigger
      | DropTarget
      | NineSliceSprite
      | ImageLayer
      | ColorLayer
      | Light2d
      | UIBaseElement
      | UISpriteElement
      | UITextButton
      | Text
      | BitmapText
  The child object
Returns Renderable
child
Inherited from Container.getNextChild
- Defined in packages/melonjs/src/renderable/container.js:455

getOpacity

getOpacity(): number
get the renderable alpha channel value

Returns number
current opacity value between 0 and 1
Inherited from Container.getOpacity
- Defined in packages/melonjs/src/renderable/renderable.js:423

getRandomPointX

getRandomPointX(): number
returns a random point on the x axis within the bounds of this emitter

Returns number
- Defined in packages/melonjs/src/particles/emitter.js:128

getRandomPointY

getRandomPointY(): number
returns a random point on the y axis within the bounds this emitter

Returns number
- Defined in packages/melonjs/src/particles/emitter.js:136

getRootAncestor

getRootAncestor(): Container
Returns the instance of the root container (i.e. the current application World container).

Returns Container
root container
Inherited from Container.getRootAncestor
- Defined in packages/melonjs/src/renderable/container.js:624

hasChild

hasChild(child): boolean
Returns true if contains the specified Child
Parameters
- child:
      | Draggable
      | Renderable
      | Entity
      | Sprite
      | Collectable
      | Trigger
      | DropTarget
      | NineSliceSprite
      | ImageLayer
      | ColorLayer
      | Light2d
      | UIBaseElement
      | UISpriteElement
      | UITextButton
      | Text
      | BitmapText
  The child object
Returns boolean
Inherited from Container.hasChild
- Defined in packages/melonjs/src/renderable/container.js:468

isAttachedToRoot

isAttachedToRoot(): boolean
Checks if this container is root or if it's attached to the root container.

Returns boolean
true if this container is root or if it's attached to the root container
Inherited from Container.isAttachedToRoot
- Defined in packages/melonjs/src/renderable/container.js:605

isConvex

isConvex(): null | boolean
Returns true if the vertices composing this polygon form a convex shape (vertices must be in clockwise order).

Returns null | boolean
true if the vertices are convex, false if not, null if not computable
Inherited from Container.isConvex
- Defined in packages/melonjs/src/geometries/polygon.ts:281

isFinite

isFinite(): boolean
Determines whether all coordinates of this rectangle are finite numbers.

Returns boolean
false if all coordinates are positive or negative Infinity or NaN; otherwise, true.
Inherited from Container.isFinite
- Defined in packages/melonjs/src/geometries/rectangle.ts:276

isRunning

isRunning(): boolean
Emitter is of type stream and is launching particles

Returns boolean
Emitter is Stream and is launching particles
- Defined in packages/melonjs/src/particles/emitter.js:154

lookAt

lookAt(target): Renderable
Rotate this renderable towards the given target.
Parameters
- target: any
  the renderable or position to look at
Returns Renderable
Reference to this object for method chaining
Inherited from Container.lookAt
- Defined in packages/melonjs/src/renderable/renderable.js:530

moveDown

moveDown(child): void
Move the child in the group one step backward (z depth).
Parameters
- child:
      | Draggable
      | Renderable
      | Entity
      | Sprite
      | Collectable
      | Trigger
      | DropTarget
      | NineSliceSprite
      | ImageLayer
      | ColorLayer
      | Light2d
      | UIBaseElement
      | UISpriteElement
      | UITextButton
      | Text
      | BitmapText
  Child to be moved
Returns void
Inherited from Container.moveDown
- Defined in packages/melonjs/src/renderable/container.js:747

moveToBottom

moveToBottom(child): void
Move the specified child the bottom (z depth).
Parameters
- child:
      | Draggable
      | Renderable
      | Entity
      | Sprite
      | Collectable
      | Trigger
      | DropTarget
      | NineSliceSprite
      | ImageLayer
      | ColorLayer
      | Light2d
      | UIBaseElement
      | UISpriteElement
      | UITextButton
      | Text
      | BitmapText
  Child to be moved
Returns void
Inherited from Container.moveToBottom
- Defined in packages/melonjs/src/renderable/container.js:778

moveToTop

moveToTop(child): void
Move the specified child to the top(z depth).
Parameters
- child:
      | Draggable
      | Renderable
      | Entity
      | Sprite
      | Collectable
      | Trigger
      | DropTarget
      | NineSliceSprite
      | ImageLayer
      | ColorLayer
      | Light2d
      | UIBaseElement
      | UISpriteElement
      | UITextButton
      | Text
      | BitmapText
  Child to be moved
Returns void
Inherited from Container.moveToTop
- Defined in packages/melonjs/src/renderable/container.js:761

moveUp

moveUp(child): void
Move the child in the group one step forward (z depth).
Parameters
- child:
      | Draggable
      | Renderable
      | Entity
      | Sprite
      | Collectable
      | Trigger
      | DropTarget
      | NineSliceSprite
      | ImageLayer
      | ColorLayer
      | Light2d
      | UIBaseElement
      | UISpriteElement
      | UITextButton
      | Text
      | BitmapText
  Child to be moved
Returns void
Inherited from Container.moveUp
- Defined in packages/melonjs/src/renderable/container.js:733

onCollision

onCollision(): boolean

onCollision callback, triggered in case of collision, when this renderable body is colliding with another one

Returns boolean

true if the object should respond to the collision (its position and velocity will be corrected)

Example

// colision handler
onCollision(response) {
    if (response.b.body.collisionType === me.collision.types.ENEMY_OBJECT) {
        // makes the other object solid, by substracting the overlap vector to the current position
        this.pos.sub(response.overlapV);
        this.hurt();
        // not solid
        return false;
    }
    // Make the object solid
    return true;
},

onDestroyEvent

onDestroyEvent(): void
OnDestroy Notification function
Called by engine before deleting the object

Returns void
Inherited from Container.onDestroyEvent
- Defined in packages/melonjs/src/renderable/renderable.js:859

overlaps

overlaps(rect): boolean
check if this rectangle is intersecting with the specified one
Parameters
- rect: Rect
  Other rectangle.
Returns boolean
true if overlaps
Inherited from Container.overlaps
- Defined in packages/melonjs/src/geometries/rectangle.ts:208

postDraw

postDraw(renderer): void
restore the rendering context after drawing (automatically called by melonJS).
Parameters
- renderer: CanvasRenderer | WebGLRenderer
  a renderer object
Returns void
See
- Renderable#preDraw
- Renderable#draw
Inherited from Container.postDraw
- Defined in packages/melonjs/src/renderable/renderable.js:745

preDraw

preDraw(renderer): void
Prepare the rendering context before drawing (automatically called by melonJS). This will apply any defined transforms, anchor point, tint or blend mode and translate the context accordingly to this renderable position.
Parameters
- renderer: CanvasRenderer | WebGLRenderer
  a renderer object
Returns void
See
- Renderable#draw
- Renderable#postDraw
Inherited from Container.preDraw
- Defined in packages/melonjs/src/renderable/renderable.js:670

recalc

recalc(): ParticleEmitter
Computes the calculated collision polygon. This must be called if the points array, angle, or offset is modified manually.

Returns ParticleEmitter
Reference to this object for method chaining
Inherited from Container.recalc
- Defined in packages/melonjs/src/geometries/polygon.ts:217

removeChild

removeChild(child, keepalive?): void
Invokes the removeChildNow in a defer, to ensure the child is removed safely after the update & draw stack has completed.
if the given child implements a onDeactivateEvent() method, that method will be called once the child is removed from this container.
Parameters
- child:
      | Draggable
      | Renderable
      | Sprite
      | Collectable
      | Trigger
      | DropTarget
      | NineSliceSprite
      | ImageLayer
      | ColorLayer
      | Light2d
      | UIBaseElement
      | UISpriteElement
      | UITextButton
      | Text
      | BitmapText
  Child to be removed
- Optionalkeepalive: boolean
  true to prevent calling child.destroy()
Returns void
Inherited from Container.removeChild
- Defined in packages/melonjs/src/renderable/container.js:656

removeChildNow

removeChildNow(child, keepalive?): void
Removes (and optionally destroys) a child from the container.
(removal is immediate and unconditional)
Never use keepalive=true with objects from pool. Doing so will create a memory leak.
Parameters
- child: any
  Child to be removed
- Optionalkeepalive: boolean
  True to prevent calling child.destroy()
Returns void
Inherited from Container.removeChildNow
- Defined in packages/melonjs/src/renderable/container.js:671

reset

reset(settings?): void
Reset the emitter with particle emitter settings.
Parameters
- settings: {
      angle: number;
      angleVariation: number;
      blendMode: string;
      duration: number;
      floating: boolean;
      followTrajectory: boolean;
      framesToSkip: number;
      frequency: number;
      gravity: number;
      height: number;
      image: HTMLCanvasElement;
      maxEndScale: number;
      maxLife: number;
      maxParticles: number;
      maxRotation: number;
      maxStartScale: number;
      minEndScale: number;
      minLife: number;
      minRotation: number;
      minStartScale: number;
      onlyInViewport: boolean;
      speed: number;
      speedVariation: number;
      textureAdditive: boolean;
      textureSize: number;
      tint: string;
      totalParticles: number;
      width: number;
      wind: number;
  } = {}
  [optional] object with emitter settings. See ParticleEmitterSettings
  - angle: number
    Start angle for particle launch in Radians
    Default
    Math.PI / 2
  - angleVariation: number
    letiation in the start angle for particle launch in Radians.
    Default
    0
  - blendMode: string
    the blend mode to be applied when rendering particles. (note: this will superseed the textureAdditive setting if different than "normal")
    Default
    normal
    
    See
    
    CanvasRenderer#setBlendMode
    
    WebGLRenderer#setBlendMode
  - duration: number
    Duration that the emitter releases particles in ms (used only if emitter is Stream). After this period, the emitter stop the launch of particles.
    Default
    Infinity
  - floating: boolean
    Render particles in screen space.
    Default
    false
  - followTrajectory: boolean
    Update the rotation of particle in accordance the particle trajectory.
    The particle sprite should aim at zero angle (draw from left to right).
    Override the particle minRotation and maxRotation.
    Default
    false
  - framesToSkip: number
    Skip n frames after updating the particle system once. This can be used to reduce the performance impact of emitters with many particles.
    Default
    0
  - frequency: number
    How often a particle is emitted in ms (used only if emitter is a Stream).
    Default
    100
  - gravity: number
    Vertical force (Gravity) for each particle
    Default
    0
    
    See
    World.gravity
  - height: number
    Height of the particle spawn area
    Default
    1
  - image: HTMLCanvasElement
    image used for particles texture (by default melonJS will create an white 8x8 texture image)
    Default
    undefined
    
    See
    textureSize
  - maxEndScale: number
    Maximum end scale ratio for particles
    Default
    0
  - maxLife: number
    Maximum time each particle lives once it is emitted in ms.
    Default
    3000
  - maxParticles: number
    Maximum number of particles launched each time in this emitter (used only if emitter is Stream).
    Default
    10
  - maxRotation: number
    Maximum start rotation for particles sprites in Radians
    Default
    0
  - maxStartScale: number
    Maximum start scale ratio for particles (1 = no scaling)
    Default
    1
  - minEndScale: number
    Minimum end scale ratio for particles
    Default
    0
  - minLife: number
    Minimum time each particle lives once it is emitted in ms.
    Default
    1000
  - minRotation: number
    Minimum start rotation for particles sprites in Radians
    Default
    0
  - minStartScale: number
    Minimum start scale ratio for particles (1 = no scaling)
    Default
    1
  - onlyInViewport: boolean
    Update particles only in the viewport, remove it when out of viewport.
    Default
    true
  - speed: number
    Start speed of particles.
    Default
    2
  - speedVariation: number
    letiation in the start speed of particles
    Default
    1
  - textureAdditive: boolean
    Enable the Texture Additive by composite operation ("additive" blendMode)
    Default
    false
    
    See
    blendMode
  - textureSize: number
    default texture size used for particles if no image is specified (by default melonJS will create an white 8x8 texture image)
    Default
    8
    
    See
    image
  - tint: string
    tint to be applied to particles
    Default
    "#fff"
  - totalParticles: number
    Total number of particles in the emitter
    Default
    50
  - width: number
    Width of the particle spawn area.
    Default
    1
  - wind: number
    Horizontal force (like a Wind) for each particle
    Default
    0
Returns void
Overrides Container.reset
- Defined in packages/melonjs/src/particles/emitter.js:108

resize

resize(w, h): ParticleEmitter
resize the rectangle
Parameters
- w: number
  new width of the rectangle
- h: number
  new height of the rectangle
Returns ParticleEmitter
this rectangle
Inherited from Container.resize
- Defined in packages/melonjs/src/geometries/rectangle.ts:147

rotate

rotate(angle, v?): Renderable
Rotate this renderable by the specified angle (in radians).
Parameters
- angle: number
  The angle to rotate (in radians)
- Optionalv: any
  an optional point to rotate around
Returns Renderable
Reference to this object for method chaining
Inherited from Container.rotate
- Defined in packages/melonjs/src/renderable/renderable.js:552

scale

scale(x, y?): Renderable
scale the renderable around his anchor point. Scaling actually applies changes to the currentTransform member wich is used by the renderer to scale the object when rendering. It does not scale the object itself. For example if the renderable is an image, the image.width and image.height properties are unaltered but the currentTransform member will be changed.
Parameters
- x: number
  a number representing the abscissa of the scaling vector.
- Optionaly: number = x
  a number representing the ordinate of the scaling vector.
Returns Renderable
Reference to this object for method chaining
Inherited from Container.scale
- Defined in packages/melonjs/src/renderable/renderable.js:571

scaleV

scaleV(v): Renderable
scale the renderable around his anchor point
Parameters
- v: Vector2d
  scaling vector
Returns Renderable
Reference to this object for method chaining
Inherited from Container.scaleV
- Defined in packages/melonjs/src/renderable/renderable.js:583

setChildsProperty

setChildsProperty(prop, value, recursive?): void
Automatically set the specified property of all childs to the given value
Parameters
- prop: string
  property name
- value: object
  property value
- Optionalrecursive: boolean
  recursively apply the value to child containers if true
Returns void
Inherited from Container.setChildsProperty
- Defined in packages/melonjs/src/renderable/container.js:720

setOpacity

setOpacity(alpha): void
set the renderable alpha channel value
Parameters
- alpha: number
  opacity value between 0.0 and 1.0
Returns void
Inherited from Container.setOpacity
- Defined in packages/melonjs/src/renderable/renderable.js:431

setShape

setShape(x, y, points): ParticleEmitter
set new value to the Polygon
Parameters
- x: number
  position of the Polygon
- y: number
  position of the Polygon
- points: PolygonVertices | LineVertices
  array of vector or vertice defining the Polygon
Returns ParticleEmitter
this instance for objecf chaining
Inherited from Container.setShape
- Defined in packages/melonjs/src/geometries/polygon.ts:91

setSize

setSize(width, height): ParticleEmitter
Set new dimensions for the rectangle.
Parameters
- width: number
  The new width of the rectangle.
- height: number
  The new height of the rectangle.
Returns ParticleEmitter
Inherited from Container.setSize
- Defined in packages/melonjs/src/geometries/rectangle.ts:35

setVertices

setVertices(vertices): ParticleEmitter
set the vertices defining this Polygon
Parameters
- vertices: PolygonVertices | LineVertices
  array of vector or vertice defining the Polygon
Returns ParticleEmitter
this instance for objecf chaining
Inherited from Container.setVertices
- Defined in packages/melonjs/src/geometries/polygon.ts:102

shift

shift(x, y?): void
Shifts the Polygon to the given position vector.
Parameters
- x: number
  The x coordinate or a vector point to shift to.
- Optionaly: number
  The y coordinate. This parameter is required if the first parameter is a number.
Returns void
Example
```
polygon.shift(10, 10);
// or
polygon.shift(myVector2d);
```
Inherited from Container.shift
- Defined in packages/melonjs/src/geometries/polygon.ts:357
shift(vector): void
Parameters
- vector: Vector2d
Returns void
Inherited from Container.shift
- Defined in packages/melonjs/src/geometries/polygon.ts:358

sort

sort(recursive?): void
Manually trigger the sort of all the childs in the container
Parameters
- Optionalrecursive: boolean
  recursively sort all containers if true
Returns void
Inherited from Container.sort
- Defined in packages/melonjs/src/renderable/container.js:799

stopStream

stopStream(): void
Stop the emitter from generating new particles (used only if emitter is Stream)

Returns void
- Defined in packages/melonjs/src/particles/emitter.js:173

streamParticles

streamParticles(duration?): void
Launch particles from emitter constantly (e.g. for stream)
Parameters
- Optionalduration: number
  time that the emitter releases particles in ms
Returns void
- Defined in packages/melonjs/src/particles/emitter.js:162

swapChildren

swapChildren(child, child2): void
Swaps the position (z-index) of 2 children
Parameters
- child:
      | Draggable
      | Renderable
      | Entity
      | Sprite
      | Collectable
      | Trigger
      | DropTarget
      | NineSliceSprite
      | ImageLayer
      | ColorLayer
      | Light2d
      | UIBaseElement
      | UISpriteElement
      | UITextButton
      | Text
      | BitmapText
  Child to be added
- child2:
      | Draggable
      | Renderable
      | Entity
      | Sprite
      | Collectable
      | Trigger
      | DropTarget
      | NineSliceSprite
      | ImageLayer
      | ColorLayer
      | Light2d
      | UIBaseElement
      | UISpriteElement
      | UITextButton
      | Text
      | BitmapText
  Child to be added
Returns void
Inherited from Container.swapChildren
- Defined in packages/melonjs/src/renderable/container.js:405

to2d

to2d(): ParticleEmitter
apply a 2d projection to this shapen

Returns ParticleEmitter
Reference to this object for method chaining
Inherited from Container.to2d
- Defined in packages/melonjs/src/geometries/polygon.ts:163

toIso

toIso(): ParticleEmitter
apply an isometric projection to this shape

Returns ParticleEmitter
Reference to this object for method chaining
Inherited from Container.toIso
- Defined in packages/melonjs/src/geometries/polygon.ts:155

toPolygon

toPolygon(): Polygon
Returns a polygon whose edges are the same as this box.

Returns Polygon
a new Polygon that represents this rectangle.
Inherited from Container.toPolygon
- Defined in packages/melonjs/src/geometries/rectangle.ts:289

transform

transform(m): Renderable
multiply the renderable currentTransform with the given matrix
Parameters
- m: Matrix2d
  the transformation matrix
Returns Renderable
Reference to this object for method chaining

See
Renderable#currentTransform
Inherited from Container.transform
- Defined in packages/melonjs/src/renderable/renderable.js:472

translate

translate(x, y?): Polygon
Translates the Polygon by the specified offset.
Parameters
- x: number
  The x offset or a vector point to translate by.
- Optionaly: number
  The y offset. This parameter is required if the first parameter is a number.
Returns Polygon
Reference to this object for method chaining
Example
```
polygon.translate(10, 10);
// or
polygon.translate(myVector2d);
```
Inherited from Container.translate
- Defined in packages/melonjs/src/geometries/polygon.ts:327
translate(vector): Polygon
Parameters
- vector: Vector2d
Returns Polygon
Inherited from Container.translate
- Defined in packages/melonjs/src/geometries/polygon.ts:328

union

union(rect): ParticleEmitter
merge this rectangle with another one
Parameters
- rect: Rect
  other rectangle to union with
Returns ParticleEmitter
the union(ed) rectangle
Inherited from Container.union
- Defined in packages/melonjs/src/geometries/rectangle.ts:189

updateBounds

updateBounds(absolute?): Bounds
update the bounding box for this container.
Parameters
- Optionalabsolute: boolean = true
  update the bounds size and position in (world) absolute coordinates
Returns Bounds
this container bounding box Rectangle object
Inherited from Container.updateBounds
- Defined in packages/melonjs/src/renderable/container.js:581

Class ParticleEmitter

Hierarchy (view full)

Index

Constructors

Properties

Accessors

Methods

Constructors

constructor

Parameters

angle: number

Default

angleVariation: number

Default

blendMode: string

Default

See

duration: number

Default

floating: boolean

Default

followTrajectory: boolean

Default

framesToSkip: number

Default

frequency: number

Default

gravity: number

Default

See

height: number

Default

image: HTMLCanvasElement

Default

See

maxEndScale: number

Default

maxLife: number

Default

maxParticles: number

Default

maxRotation: number

Default

maxStartScale: number

Default

minEndScale: number

Default

minLife: number

Default

minRotation: number

Default

minStartScale: number

Default

onlyInViewport: boolean

Default

speed: number

Default

speedVariation: number

Default

textureAdditive: boolean

Default

See

textureSize: number

Default

See

tint: string

Default

totalParticles: number

Default

width: number

Default

wind: number

Default

Returns ParticleEmitter

Example

Properties

GUID

_defaultParticle

_dt

_updateCount