new BitmapData(game, key, width, height)
A BitmapData object contains a Canvas element to which you can draw anything you like via normal Canvas context operations. A single BitmapData can be used as the texture for one or many Images/Sprites. So if you need to dynamically create a Sprite texture then they are a good choice.
Parameters:
Name | Type | Argument | Default | Description |
---|---|---|---|---|
game |
Phaser.Game | A reference to the currently running game. |
||
key |
string | Internal Phaser reference key for the render texture. |
||
width |
number |
<optional> |
256 | The width of the BitmapData in pixels. |
height |
number |
<optional> |
256 | The height of the BitmapData in pixels. |
- Source - gameobjects/BitmapData.js, line 19
Members
-
baseTexture :PIXI.BaseTexture
-
The PIXI.BaseTexture.
- Source - gameobjects/BitmapData.js, line 101
-
canvas :HTMLCanvasElement
-
The canvas to which this BitmapData draws.
- Source - gameobjects/BitmapData.js, line 48
-
context :CanvasRenderingContext2D
-
The 2d context of the canvas.
- Source - gameobjects/BitmapData.js, line 54
-
ctx :CanvasRenderingContext2D
-
A reference to BitmapData.context.
- Source - gameobjects/BitmapData.js, line 59
-
data :Uint8ClampedArray
-
A Uint8ClampedArray view into BitmapData.buffer.
- Source - gameobjects/BitmapData.js, line 69
-
dirty :boolean
-
If dirty this BitmapData will be re-rendered.
- Source - gameobjects/BitmapData.js, line 131
-
disableTextureUpload :boolean
-
If disableTextureUpload is true this BitmapData will never send its image data to the GPU when its dirty flag is true.
- Source - gameobjects/BitmapData.js, line 126
-
game :Phaser.Game
-
A reference to the currently running game.
- Source - gameobjects/BitmapData.js, line 27
-
height :number
-
The height of the BitmapData in pixels.
- Source - gameobjects/BitmapData.js, line 42
-
imageData :ImageData
-
The context image data.
- Source - gameobjects/BitmapData.js, line 64
-
key :string
-
The key of the BitmapData in the Cache, if stored there.
- Source - gameobjects/BitmapData.js, line 32
-
pixels :Uint32Array
-
An Uint32Array view into BitmapData.buffer.
- Source - gameobjects/BitmapData.js, line 74
-
texture :PIXI.Texture
-
The PIXI.Texture.
- Source - gameobjects/BitmapData.js, line 107
-
textureFrame :Phaser.Frame
-
The Frame this BitmapData uses for rendering.
- Source - gameobjects/BitmapData.js, line 113
-
type :number
-
The const type of this object.
- Source - gameobjects/BitmapData.js, line 121
-
width :number
-
The width of the BitmapData in pixels.
- Source - gameobjects/BitmapData.js, line 37
Methods
-
<static> getTransform(translateX, translateY, scaleX, scaleY, skewX, skewY) → {object}
-
Gets a JavaScript object that has 6 properties set that are used by BitmapData in a transform.
Parameters:
Name Type Description translateX
number The x translate value.
translateY
number The y translate value.
scaleX
number The scale x value.
scaleY
number The scale y value.
skewX
number The skew x value.
skewY
number The skew y value.
Returns:
object -A JavaScript object containing all of the properties BitmapData needs for transforms.
- Source - gameobjects/BitmapData.js, line 1851
-
add(object) → {Phaser.BitmapData}
-
Updates the given objects so that they use this BitmapData as their texture. This will replace any texture they will currently have set.
Parameters:
Name Type Description object
Phaser.Sprite | Array.<Phaser.Sprite> | Phaser.Image | Array.<Phaser.Image> Either a single Sprite/Image or an Array of Sprites/Images.
Returns:
This BitmapData object for method chaining.
- Source - gameobjects/BitmapData.js, line 206
-
addToWorld(x, y, anchorX, anchorY, scaleX, scaleY) → {Phaser.Image}
-
Creates a new Phaser.Image object, assigns this BitmapData to be its texture, adds it to the world then returns it.
Parameters:
Name Type Argument Default Description x
number <optional>
0 The x coordinate to place the Image at.
y
number <optional>
0 The y coordinate to place the Image at.
anchorX
number <optional>
0 Set the x anchor point of the Image. A value between 0 and 1, where 0 is the top-left and 1 is bottom-right.
anchorY
number <optional>
0 Set the y anchor point of the Image. A value between 0 and 1, where 0 is the top-left and 1 is bottom-right.
scaleX
number <optional>
1 The horizontal scale factor of the Image. A value of 1 means no scaling. 2 would be twice the size, and so on.
scaleY
number <optional>
1 The vertical scale factor of the Image. A value of 1 means no scaling. 2 would be twice the size, and so on.
Returns:
The newly added Image object.
- Source - gameobjects/BitmapData.js, line 931
-
alphaMask(source, mask, sourceRect, maskRect) → {Phaser.BitmapData}
-
Draws the image onto this BitmapData using an image as an alpha mask.
Parameters:
Name Type Argument Description source
Phaser.Sprite | Phaser.Image | Phaser.Text | Phaser.BitmapData | Image | HTMLCanvasElement | string The source to copy from. If you give a string it will try and find the Image in the Game.Cache first. This is quite expensive so try to provide the image itself.
mask
Phaser.Sprite | Phaser.Image | Phaser.Text | Phaser.BitmapData | Image | HTMLCanvasElement | string <optional>
The object to be used as the mask. If you give a string it will try and find the Image in the Game.Cache first. This is quite expensive so try to provide the image itself. If you don't provide a mask it will use this BitmapData as the mask.
sourceRect
Phaser.Rectangle <optional>
A Rectangle where x/y define the coordinates to draw the Source image to and width/height define the size.
maskRect
Phaser.Rectangle <optional>
A Rectangle where x/y define the coordinates to draw the Mask image to and width/height define the size.
Returns:
This BitmapData object for method chaining.
- Source - gameobjects/BitmapData.js, line 1246
-
blendAdd() → {Phaser.BitmapData}
-
Sets the blend mode to 'lighter'
Returns:
This BitmapData object for method chaining.
- Source - gameobjects/BitmapData.js, line 1621
-
blendColor() → {Phaser.BitmapData}
-
Sets the blend mode to 'color'
Returns:
This BitmapData object for method chaining.
- Source - gameobjects/BitmapData.js, line 1803
-
blendColorBurn() → {Phaser.BitmapData}
-
Sets the blend mode to 'color-burn'
Returns:
This BitmapData object for method chaining.
- Source - gameobjects/BitmapData.js, line 1712
-
blendColorDodge() → {Phaser.BitmapData}
-
Sets the blend mode to 'color-dodge'
Returns:
This BitmapData object for method chaining.
- Source - gameobjects/BitmapData.js, line 1699
-
blendDarken() → {Phaser.BitmapData}
-
Sets the blend mode to 'darken'
Returns:
This BitmapData object for method chaining.
- Source - gameobjects/BitmapData.js, line 1673
-
blendDestinationAtop() → {Phaser.BitmapData}
-
Sets the blend mode to 'destination-atop'
Returns:
This BitmapData object for method chaining.
- Source - gameobjects/BitmapData.js, line 1595
-
blendDestinationIn() → {Phaser.BitmapData}
-
Sets the blend mode to 'destination-in'
Returns:
This BitmapData object for method chaining.
- Source - gameobjects/BitmapData.js, line 1569
-
blendDestinationOut() → {Phaser.BitmapData}
-
Sets the blend mode to 'destination-out'
Returns:
This BitmapData object for method chaining.
- Source - gameobjects/BitmapData.js, line 1582
-
blendDestinationOver() → {Phaser.BitmapData}
-
Sets the blend mode to 'destination-over'
Returns:
This BitmapData object for method chaining.
- Source - gameobjects/BitmapData.js, line 1556
-
blendDifference() → {Phaser.BitmapData}
-
Sets the blend mode to 'difference'
Returns:
This BitmapData object for method chaining.
- Source - gameobjects/BitmapData.js, line 1751
-
blendExclusion() → {Phaser.BitmapData}
-
Sets the blend mode to 'exclusion'
Returns:
This BitmapData object for method chaining.
- Source - gameobjects/BitmapData.js, line 1764
-
blendHardLight() → {Phaser.BitmapData}
-
Sets the blend mode to 'hard-light'
Returns:
This BitmapData object for method chaining.
- Source - gameobjects/BitmapData.js, line 1725
-
blendHue() → {Phaser.BitmapData}
-
Sets the blend mode to 'hue'
Returns:
This BitmapData object for method chaining.
- Source - gameobjects/BitmapData.js, line 1777
-
blendLighten() → {Phaser.BitmapData}
-
Sets the blend mode to 'lighten'
Returns:
This BitmapData object for method chaining.
- Source - gameobjects/BitmapData.js, line 1686
-
blendLuminosity() → {Phaser.BitmapData}
-
Sets the blend mode to 'luminosity'
Returns:
This BitmapData object for method chaining.
- Source - gameobjects/BitmapData.js, line 1816
-
blendMultiply() → {Phaser.BitmapData}
-
Sets the blend mode to 'multiply'
Returns:
This BitmapData object for method chaining.
- Source - gameobjects/BitmapData.js, line 1634
-
blendOverlay() → {Phaser.BitmapData}
-
Sets the blend mode to 'overlay'
Returns:
This BitmapData object for method chaining.
- Source - gameobjects/BitmapData.js, line 1660
-
blendReset() → {Phaser.BitmapData}
-
Resets the blend mode (effectively sets it to 'source-over')
Returns:
This BitmapData object for method chaining.
- Source - gameobjects/BitmapData.js, line 1491
-
blendSaturation() → {Phaser.BitmapData}
-
Sets the blend mode to 'saturation'
Returns:
This BitmapData object for method chaining.
- Source - gameobjects/BitmapData.js, line 1790
-
blendScreen() → {Phaser.BitmapData}
-
Sets the blend mode to 'screen'
Returns:
This BitmapData object for method chaining.
- Source - gameobjects/BitmapData.js, line 1647
-
blendSoftLight() → {Phaser.BitmapData}
-
Sets the blend mode to 'soft-light'
Returns:
This BitmapData object for method chaining.
- Source - gameobjects/BitmapData.js, line 1738
-
blendSourceAtop() → {Phaser.BitmapData}
-
Sets the blend mode to 'source-atop'
Returns:
This BitmapData object for method chaining.
- Source - gameobjects/BitmapData.js, line 1543
-
blendSourceIn() → {Phaser.BitmapData}
-
Sets the blend mode to 'source-in'
Returns:
This BitmapData object for method chaining.
- Source - gameobjects/BitmapData.js, line 1517
-
blendSourceOut() → {Phaser.BitmapData}
-
Sets the blend mode to 'source-out'
Returns:
This BitmapData object for method chaining.
- Source - gameobjects/BitmapData.js, line 1530
-
blendSourceOver() → {Phaser.BitmapData}
-
Sets the blend mode to 'source-over'
Returns:
This BitmapData object for method chaining.
- Source - gameobjects/BitmapData.js, line 1504
-
blendXor() → {Phaser.BitmapData}
-
Sets the blend mode to 'xor'
Returns:
This BitmapData object for method chaining.
- Source - gameobjects/BitmapData.js, line 1608
-
circle(x, y, radius, fillStyle) → {Phaser.BitmapData}
-
Draws a filled Circle to the BitmapData at the given x, y coordinates and radius in size.
Parameters:
Name Type Argument Description x
number The x coordinate to draw the Circle at. This is the center of the circle.
y
number The y coordinate to draw the Circle at. This is the center of the circle.
radius
number The radius of the Circle in pixels. The radius is half the diameter.
fillStyle
string <optional>
If set the context fillStyle will be set to this value before the circle is drawn.
Returns:
This BitmapData object for method chaining.
- Source - gameobjects/BitmapData.js, line 1396
-
clear() → {Phaser.BitmapData}
-
Clears the BitmapData context using a clearRect.
Returns:
This BitmapData object for method chaining.
- Source - gameobjects/BitmapData.js, line 275
-
cls()
-
Clears the BitmapData context using a clearRect.
- Source - gameobjects/BitmapData.js, line 269
-
copy(source, x, y, width, height, tx, ty, newWidth, newHeight, rotate, anchorX, anchorY, scaleX, scaleY, alpha, blendMode, roundPx) → {Phaser.BitmapData}
-
Copies a rectangular area from the source object to this BitmapData. If you give
null
as the source it will copy from itself. You can optionally resize, translate, rotate, scale, alpha or blend as it's drawn. All rotation, scaling and drawing takes place around the regions center point by default, but can be changed with the anchor parameters. Note that the source image can also be this BitmapData, which can create some interesting effects.This method has a lot of parameters for maximum control. You can use the more friendly methods like
copyRect
anddraw
to avoid having to remember them all.Parameters:
Name Type Argument Default Description source
Phaser.Sprite | Phaser.Image | Phaser.Text | Phaser.BitmapData | Image | HTMLCanvasElement | string <optional>
The source to copy from. If you give a string it will try and find the Image in the Game.Cache first. This is quite expensive so try to provide the image itself.
x
number <optional>
0 The x coordinate representing the top-left of the region to copy from the source image.
y
number <optional>
0 The y coordinate representing the top-left of the region to copy from the source image.
width
number <optional>
The width of the region to copy from the source image. If not specified it will use the full source image width.
height
number <optional>
The height of the region to copy from the source image. If not specified it will use the full source image height.
tx
number <optional>
The x coordinate to translate to before drawing. If not specified it will default to the
x
parameter. Ifnull
andsource
is a Display Object, it will default tosource.x
.ty
number <optional>
The y coordinate to translate to before drawing. If not specified it will default to the
y
parameter. Ifnull
andsource
is a Display Object, it will default tosource.y
.newWidth
number <optional>
The new width of the block being copied. If not specified it will default to the
width
parameter.newHeight
number <optional>
The new height of the block being copied. If not specified it will default to the
height
parameter.rotate
number <optional>
0 The angle in radians to rotate the block to before drawing. Rotation takes place around the center by default, but can be changed with the
anchor
parameters.anchorX
number <optional>
0 The anchor point around which the block is rotated and scaled. A value between 0 and 1, where 0 is the top-left and 1 is bottom-right.
anchorY
number <optional>
0 The anchor point around which the block is rotated and scaled. A value between 0 and 1, where 0 is the top-left and 1 is bottom-right.
scaleX
number <optional>
1 The horizontal scale factor of the block. A value of 1 means no scaling. 2 would be twice the size, and so on.
scaleY
number <optional>
1 The vertical scale factor of the block. A value of 1 means no scaling. 2 would be twice the size, and so on.
alpha
number <optional>
1 The alpha that will be set on the context before drawing. A value between 0 (fully transparent) and 1, opaque.
blendMode
number <optional>
null The composite blend mode that will be used when drawing. The default is no blend mode at all.
roundPx
boolean <optional>
false Should the x and y values be rounded to integers before drawing? This prevents anti-aliasing in some instances.
Returns:
This BitmapData object for method chaining.
- Source - gameobjects/BitmapData.js, line 957
-
copyRect(source, area, x, y, alpha, blendMode, roundPx) → {Phaser.BitmapData}
-
Copies the area defined by the Rectangle parameter from the source image to this BitmapData at the given location.
Parameters:
Name Type Argument Default Description source
Phaser.Sprite | Phaser.Image | Phaser.Text | Phaser.BitmapData | Image | string The Image to copy from. If you give a string it will try and find the Image in the Game.Cache.
area
Phaser.Rectangle The Rectangle region to copy from the source image.
x
number The destination x coordinate to copy the image to.
y
number The destination y coordinate to copy the image to.
alpha
number <optional>
1 The alpha that will be set on the context before drawing. A value between 0 (fully transparent) and 1, opaque.
blendMode
number <optional>
null The composite blend mode that will be used when drawing. The default is no blend mode at all.
roundPx
boolean <optional>
false Should the x and y values be rounded to integers before drawing? This prevents anti-aliasing in some instances.
Returns:
This BitmapData object for method chaining.
- Source - gameobjects/BitmapData.js, line 1153
-
draw(source, x, y, width, height, blendMode, roundPx) → {Phaser.BitmapData}
-
Draws the given Phaser.Sprite, Phaser.Image or Phaser.Text to this BitmapData at the coordinates specified. You can use the optional width and height values to 'stretch' the sprite as it is drawn. This uses drawImage stretching, not scaling. When drawing it will take into account the Sprites rotation, scale and alpha values.
Parameters:
Name Type Argument Default Description source
Phaser.Sprite | Phaser.Image | Phaser.Text The Sprite, Image or Text object to draw onto this BitmapData.
x
number <optional>
0 The x coordinate to translate to before drawing. If not specified it will default to
source.x
.y
number <optional>
0 The y coordinate to translate to before drawing. If not specified it will default to
source.y
.width
number <optional>
The new width of the Sprite being copied. If not specified it will default to
source.width
.height
number <optional>
The new height of the Sprite being copied. If not specified it will default to
source.height
.blendMode
number <optional>
null The composite blend mode that will be used when drawing the Sprite. The default is no blend mode at all.
roundPx
boolean <optional>
false Should the x and y values be rounded to integers before drawing? This prevents anti-aliasing in some instances.
Returns:
This BitmapData object for method chaining.
- Source - gameobjects/BitmapData.js, line 1172
-
drawGroup(group, blendMode, roundPx) → {Phaser.BitmapData}
-
Draws the immediate children of a Phaser.Group to this BitmapData. Children are only drawn if they have their
exists
property set totrue
. The children will be drawn at theirx
andy
world space coordinates. If this is outside the bounds of the BitmapData they won't be drawn. When drawing it will take into account the child's rotation, scale and alpha values. No iteration takes place. Groups nested inside other Groups will not be iterated through.Parameters:
Name Type Argument Default Description group
Phaser.Group The Group to draw onto this BitmapData.
blendMode
number <optional>
null The composite blend mode that will be used when drawing the Group children. The default is no blend mode at all.
roundPx
boolean <optional>
false Should the x and y values be rounded to integers before drawing? This prevents anti-aliasing in some instances.
Returns:
This BitmapData object for method chaining.
- Source - gameobjects/BitmapData.js, line 1194
-
extract(destination, r, g, b, a, resize, r2, g2, b2) → {Phaser.BitmapData}
-
Scans this BitmapData for all pixels matching the given r,g,b values and then draws them into the given destination BitmapData. The original BitmapData remains unchanged. The destination BitmapData must be large enough to receive all of the pixels that are scanned unless the 'resize' parameter is true. Although the destination BitmapData is returned from this method, it's actually modified directly in place, meaning this call is perfectly valid:
picture.extract(mask, r, g, b)
You can specify optional r2, g2, b2 color values. If given the pixel written to the destination bitmap will be of the r2, g2, b2 color. If not given it will be written as the same color it was extracted. You can provide one or more alternative colors, allowing you to tint the color during extraction.Parameters:
Name Type Argument Default Description destination
Phaser.BitmapData The BitmapData that the extracted pixels will be drawn to.
r
number The red color component, in the range 0 - 255.
g
number The green color component, in the range 0 - 255.
b
number The blue color component, in the range 0 - 255.
a
number <optional>
255 The alpha color component, in the range 0 - 255 that the new pixel will be drawn at.
resize
boolean <optional>
false Should the destination BitmapData be resized to match this one before the pixels are copied?
r2
number <optional>
An alternative red color component to be written to the destination, in the range 0 - 255.
g2
number <optional>
An alternative green color component to be written to the destination, in the range 0 - 255.
b2
number <optional>
An alternative blue color component to be written to the destination, in the range 0 - 255.
Returns:
The BitmapData that the extract pixels were drawn on.
- Source - gameobjects/BitmapData.js, line 1280
-
fill(r, g, b, a) → {Phaser.BitmapData}
-
Fills the BitmapData with the given color.
Parameters:
Name Type Argument Default Description r
number The red color value, between 0 and 0xFF (255).
g
number The green color value, between 0 and 0xFF (255).
b
number The blue color value, between 0 and 0xFF (255).
a
number <optional>
1 The alpha color value, between 0 and 1.
Returns:
This BitmapData object for method chaining.
- Source - gameobjects/BitmapData.js, line 291
-
getBounds(rect) → {Phaser.Rectangle}
-
Scans the BitmapData and calculates the bounds. This is a rectangle that defines the extent of all non-transparent pixels. The rectangle returned will extend from the top-left of the image to the bottom-right, exluding transparent pixels.
Parameters:
Name Type Argument Description rect
Phaser.Rectangle <optional>
If provided this Rectangle object will be populated with the bounds, otherwise a new object will be created.
Returns:
A Rectangle whose dimensions encompass the full extent of non-transparent pixels in this BitmapData.
- Source - gameobjects/BitmapData.js, line 903
-
getFirstPixel(direction) → {object}
-
Scans the BitmapData, pixel by pixel, until it encounters a pixel that isn't transparent (i.e. has an alpha value > 0). It then stops scanning and returns an object containing the colour of the pixel in r, g and b properties and the location in the x and y properties.
The direction parameter controls from which direction it should start the scan:
0 = top to bottom 1 = bottom to top 2 = left to right 3 = right to left
Parameters:
Name Type Argument Default Description direction
number <optional>
0 The direction in which to scan for the first pixel. 0 = top to bottom, 1 = bottom to top, 2 = left to right and 3 = right to left.
Returns:
object -Returns an object containing the colour of the pixel in the
r
,g
andb
properties and the location in thex
andy
properties.- Source - gameobjects/BitmapData.js, line 820
-
getPixel(x, y, out) → {object}
-
Get the color of a specific pixel in the context into a color object. If you have drawn anything to the BitmapData since it was created you must call BitmapData.update to refresh the array buffer, otherwise this may return out of date color values, or worse - throw a run-time error as it tries to access an array element that doesn't exist.
Parameters:
Name Type Argument Description x
number The x coordinate of the pixel to be set. Must lay within the dimensions of this BitmapData.
y
number The y coordinate of the pixel to be set. Must lay within the dimensions of this BitmapData.
out
object <optional>
An object into which 4 properties will be created: r, g, b and a. If not provided a new object will be created.
Returns:
object -An object with the red, green, blue and alpha values set in the r, g, b and a properties.
- Source - gameobjects/BitmapData.js, line 737
-
getPixel32(x, y) → {number}
-
Get the color of a specific pixel including its alpha value. If you have drawn anything to the BitmapData since it was created you must call BitmapData.update to refresh the array buffer, otherwise this may return out of date color values, or worse - throw a run-time error as it tries to access an array element that doesn't exist. Note that on little-endian systems the format is 0xAABBGGRR and on big-endian the format is 0xRRGGBBAA.
Parameters:
Name Type Description x
number The x coordinate of the pixel to be set. Must lay within the dimensions of this BitmapData.
y
number The y coordinate of the pixel to be set. Must lay within the dimensions of this BitmapData.
Returns:
number -A native color value integer (format: 0xAARRGGBB)
- Source - gameobjects/BitmapData.js, line 768
-
getPixelRGB(x, y, out, hsl, hsv) → {object}
-
Get the color of a specific pixel including its alpha value as a color object containing r,g,b,a and rgba properties. If you have drawn anything to the BitmapData since it was created you must call BitmapData.update to refresh the array buffer, otherwise this may return out of date color values, or worse - throw a run-time error as it tries to access an array element that doesn't exist.
Parameters:
Name Type Argument Default Description x
number The x coordinate of the pixel to be set. Must lay within the dimensions of this BitmapData.
y
number The y coordinate of the pixel to be set. Must lay within the dimensions of this BitmapData.
out
object <optional>
An object into which 3 properties will be created: r, g and b. If not provided a new object will be created.
hsl
boolean <optional>
false Also convert the rgb values into hsl?
hsv
boolean <optional>
false Also convert the rgb values into hsv?
Returns:
object -An object with the red, green and blue values set in the r, g and b properties.
- Source - gameobjects/BitmapData.js, line 788
-
getPixels(rect) → {ImageData}
-
Gets all the pixels from the region specified by the given Rectangle object.
Parameters:
Name Type Description rect
Phaser.Rectangle The Rectangle region to get.
Returns:
ImageData -Returns a ImageData object containing a Uint8ClampedArray data property.
- Source - gameobjects/BitmapData.js, line 807
-
load(source) → {Phaser.BitmapData}
-
Takes the given Game Object, resizes this BitmapData to match it and then draws it into this BitmapDatas canvas, ready for further processing. The source game object is not modified by this operation. If the source object uses a texture as part of a Texture Atlas or Sprite Sheet, only the current frame will be used for sizing. If a string is given it will assume it's a cache key and look in Phaser.Cache for an image key matching the string.
Parameters:
Name Type Description source
Phaser.Sprite | Phaser.Image | Phaser.Text | Phaser.BitmapData | Image | HTMLCanvasElement | string The object that will be used to populate this BitmapData. If you give a string it will try and find the Image in the Game.Cache first.
Returns:
This BitmapData object for method chaining.
- Source - gameobjects/BitmapData.js, line 234
-
processPixel(callback, callbackContext, x, y, width, height) → {Phaser.BitmapData}
-
Scans through the area specified in this BitmapData and sends the color for every pixel to the given callback along with its x and y coordinates. Whatever value the callback returns is set as the new color for that pixel, unless it returns the same color, in which case it's skipped. Note that the format of the color received will be different depending on if the system is big or little endian. It is expected that your callback will deal with endianess. If you'd rather Phaser did it then use processPixelRGB instead. The callback will also be sent the pixels x and y coordinates respectively.
Parameters:
Name Type Argument Default Description callback
function The callback that will be sent each pixel color to be processed.
callbackContext
object The context under which the callback will be called.
x
number <optional>
0 The x coordinate of the top-left of the region to process from.
y
number <optional>
0 The y coordinate of the top-left of the region to process from.
width
number <optional>
The width of the region to process.
height
number <optional>
The height of the region to process.
Returns:
This BitmapData object for method chaining.
- Source - gameobjects/BitmapData.js, line 451
-
processPixelRGB(callback, callbackContext, x, y, width, height) → {Phaser.BitmapData}
-
Scans through the area specified in this BitmapData and sends a color object for every pixel to the given callback. The callback will be sent a color object with 6 properties:
{ r: number, g: number, b: number, a: number, color: number, rgba: string }
. Where r, g, b and a are integers between 0 and 255 representing the color component values for red, green, blue and alpha. Thecolor
property is an Int32 of the full color. Note the endianess of this will change per system. Thergba
property is a CSS style rgba() string which can be used with context.fillStyle calls, among others. The callback will also be sent the pixels x and y coordinates respectively. The callback must return eitherfalse
, in which case no change will be made to the pixel, or a new color object. If a new color object is returned the pixel will be set to the r, g, b and a color values given within it.Parameters:
Name Type Argument Default Description callback
function The callback that will be sent each pixel color object to be processed.
callbackContext
object The context under which the callback will be called.
x
number <optional>
0 The x coordinate of the top-left of the region to process from.
y
number <optional>
0 The y coordinate of the top-left of the region to process from.
width
number <optional>
The width of the region to process.
height
number <optional>
The height of the region to process.
Returns:
This BitmapData object for method chaining.
- Source - gameobjects/BitmapData.js, line 393
-
rect(x, y, width, height, fillStyle) → {Phaser.BitmapData}
-
Draws a filled Rectangle to the BitmapData at the given x, y coordinates and width / height in size.
Parameters:
Name Type Argument Description x
number The x coordinate of the top-left of the Rectangle.
y
number The y coordinate of the top-left of the Rectangle.
width
number The width of the Rectangle.
height
number The height of the Rectangle.
fillStyle
string <optional>
If set the context fillStyle will be set to this value before the rect is drawn.
Returns:
This BitmapData object for method chaining.
- Source - gameobjects/BitmapData.js, line 1333
-
render() → {Phaser.BitmapData}
-
If the game is running in WebGL this will push the texture up to the GPU if it's dirty. This is called automatically if the BitmapData is being used by a Sprite, otherwise you need to remember to call it in your render function. If you wish to suppress this functionality set BitmapData.disableTextureUpload to
true
.Returns:
This BitmapData object for method chaining.
- Source - gameobjects/BitmapData.js, line 1471
-
replaceRGB(r1, g1, b1, a1, r2, g2, b2, a2, region) → {Phaser.BitmapData}
-
Replaces all pixels matching one color with another. The color values are given as two sets of RGBA values. An optional region parameter controls if the replacement happens in just a specific area of the BitmapData or the entire thing.
Parameters:
Name Type Argument Description r1
number The red color value to be replaced. Between 0 and 255.
g1
number The green color value to be replaced. Between 0 and 255.
b1
number The blue color value to be replaced. Between 0 and 255.
a1
number The alpha color value to be replaced. Between 0 and 255.
r2
number The red color value that is the replacement color. Between 0 and 255.
g2
number The green color value that is the replacement color. Between 0 and 255.
b2
number The blue color value that is the replacement color. Between 0 and 255.
a2
number The alpha color value that is the replacement color. Between 0 and 255.
region
Phaser.Rectangle <optional>
The area to perform the search over. If not given it will replace over the whole BitmapData.
Returns:
This BitmapData object for method chaining.
- Source - gameobjects/BitmapData.js, line 505
-
resize() → {Phaser.BitmapData}
-
Resizes the BitmapData. This changes the size of the underlying canvas and refreshes the buffer.
Returns:
This BitmapData object for method chaining.
- Source - gameobjects/BitmapData.js, line 313
-
setHSL(h, s, l, region) → {Phaser.BitmapData}
-
Sets the hue, saturation and lightness values on every pixel in the given region, or the whole BitmapData if no region was specified.
Parameters:
Name Type Argument Default Description h
number <optional>
null The hue, in the range 0 - 1.
s
number <optional>
null The saturation, in the range 0 - 1.
l
number <optional>
null The lightness, in the range 0 - 1.
region
Phaser.Rectangle <optional>
The area to perform the operation on. If not given it will run over the whole BitmapData.
Returns:
This BitmapData object for method chaining.
- Source - gameobjects/BitmapData.js, line 555
-
setPixel(x, y, red, green, blue, alpha, immediate) → {Phaser.BitmapData}
-
Sets the color of the given pixel to the specified red, green and blue values.
Parameters:
Name Type Argument Default Description x
number The x coordinate of the pixel to be set. Must lay within the dimensions of this BitmapData.
y
number The y coordinate of the pixel to be set. Must lay within the dimensions of this BitmapData.
red
number The red color value, between 0 and 0xFF (255).
green
number The green color value, between 0 and 0xFF (255).
blue
number The blue color value, between 0 and 0xFF (255).
alpha
number The alpha color value, between 0 and 0xFF (255).
immediate
boolean <optional>
true If
true
the context.putImageData will be called and the dirty flag set.Returns:
This BitmapData object for method chaining.
- Source - gameobjects/BitmapData.js, line 718
-
setPixel32(x, y, red, green, blue, alpha, immediate) → {Phaser.BitmapData}
-
Sets the color of the given pixel to the specified red, green, blue and alpha values.
Parameters:
Name Type Argument Default Description x
number The x coordinate of the pixel to be set. Must lay within the dimensions of this BitmapData.
y
number The y coordinate of the pixel to be set. Must lay within the dimensions of this BitmapData.
red
number The red color value, between 0 and 0xFF (255).
green
number The green color value, between 0 and 0xFF (255).
blue
number The blue color value, between 0 and 0xFF (255).
alpha
number The alpha color value, between 0 and 0xFF (255).
immediate
boolean <optional>
true If
true
the context.putImageData will be called and the dirty flag set.Returns:
This BitmapData object for method chaining.
- Source - gameobjects/BitmapData.js, line 679
-
shadow(color, blur, x, y) → {Phaser.BitmapData}
-
Sets the shadow properties of this BitmapDatas context which will affect all draw operations made to it. You can cancel an existing shadow by calling this method and passing no parameters. Note: At the time of writing (October 2014) Chrome still doesn't support shadowBlur used with drawImage.
Parameters:
Name Type Argument Default Description color
string The color of the shadow, given in a CSS format, i.e.
#000000
orrgba(0,0,0,1)
. Ifnull
orundefined
the shadow will be reset.blur
number <optional>
5 The amount the shadow will be blurred by. Low values = a crisp shadow, high values = a softer shadow.
x
number <optional>
10 The horizontal offset of the shadow in pixels.
y
number <optional>
10 The vertical offset of the shadow in pixels.
Returns:
This BitmapData object for method chaining.
- Source - gameobjects/BitmapData.js, line 1218
-
shiftHSL(h, s, l, region) → {Phaser.BitmapData}
-
Shifts any or all of the hue, saturation and lightness values on every pixel in the given region, or the whole BitmapData if no region was specified. Shifting will add the given value onto the current h, s and l values, not replace them. The hue is wrapped to keep it within the range 0 to 1. Saturation and lightness are clamped to not exceed 1.
Parameters:
Name Type Argument Default Description h
number <optional>
null The amount to shift the hue by.
s
number <optional>
null The amount to shift the saturation by.
l
number <optional>
null The amount to shift the lightness by.
region
Phaser.Rectangle <optional>
The area to perform the operation on. If not given it will run over the whole BitmapData.
Returns:
This BitmapData object for method chaining.
- Source - gameobjects/BitmapData.js, line 616
-
text(text, x, y, font, color, shadow) → {Phaser.BitmapData}
-
Draws text to the BitmapData in the given font and color. The default font is 14px Courier, so useful for quickly drawing debug text. If you need to do a lot of font work to this BitmapData we'd recommend implementing your own text draw method.
Parameters:
Name Type Argument Default Description text
string The text to write to the BitmapData.
x
number The x coordinate of the top-left of the text string.
y
number The y coordinate of the top-left of the text string.
font
string <optional>
'14px Courier' The font. This is passed directly to Context.font, so anything that can support, this can.
color
string <optional>
'rgb(255,255,255)' The color the text will be drawn in.
shadow
boolean <optional>
true Draw a single pixel black shadow below the text (offset by text.x/y + 1)
Returns:
This BitmapData object for method chaining.
- Source - gameobjects/BitmapData.js, line 1357
-
textureLine(line, image, repeat) → {Phaser.BitmapData}
-
Takes the given Line object and image and renders it to this BitmapData as a repeating texture line.
Parameters:
Name Type Argument Default Description line
Phaser.Line A Phaser.Line object that will be used to plot the start and end of the line.
image
string | Image The key of an image in the Phaser.Cache to use as the texture for this line, or an actual Image.
repeat
string <optional>
'repeat-x' The pattern repeat mode to use when drawing the line. Either
repeat
,repeat-x
orno-repeat
.Returns:
This BitmapData object for method chaining.
- Source - gameobjects/BitmapData.js, line 1423
-
update(x, y, width, height) → {Phaser.BitmapData}
-
This re-creates the BitmapData.imageData from the current context. It then re-builds the ArrayBuffer, the data Uint8ClampedArray reference and the pixels Int32Array. If not given the dimensions defaults to the full size of the context.
Parameters:
Name Type Argument Default Description x
number <optional>
0 The x coordinate of the top-left of the image data area to grab from.
y
number <optional>
0 The y coordinate of the top-left of the image data area to grab from.
width
number <optional>
The width of the image data area.
height
number <optional>
The height of the image data area.
Returns:
This BitmapData object for method chaining.
- Source - gameobjects/BitmapData.js, line 349