Phaser Class: Debug

new Debug(game)

A collection of methods for displaying debug information about game objects. Phaser.Debug requires a CANVAS game type in order to render, so if you've got your game set to use Phaser.AUTO then swap it for Phaser.CANVAS to ensure WebGL doesn't kick in, then the Debug functions will all display.

Parameters:

Name	Type	Description
`game`	Phaser.Game	A reference to the currently running game.

Source:

utils/Debug.js, line 15

Members

columnWidth

Properties:

Name	Type	Description
`columnWidth`	number	The spacing between columns.

Source:

utils/Debug.js, line 36

context

Properties:

Name	Type	Description
`context`	Context	The canvas context on which to render the debug information.

Source:

utils/Debug.js, line 25

currentAlpha

Properties:

Name	Type	Description
`currentAlpha`	number	The current alpha the debug information will be rendered at.

Default Value:

Source:

utils/Debug.js, line 64

currentX

Properties:

Name	Type	Description
`currentX`	Context	The current X position the debug information will be rendered at.

Default Value:

Source:

utils/Debug.js, line 52

currentY

Properties:

Name	Type	Description
`currentY`	number	The current Y position the debug information will be rendered at.

Default Value:

Source:

utils/Debug.js, line 58

font

Properties:

Name	Type	Description
`font`	string	The font that the debug information is rendered in.

Default Value:

'14px Courier'

Source:

utils/Debug.js, line 31

game

Properties:

Name	Type	Description
`game`	Phaser.Game	A reference to the currently running Game.

Source:

utils/Debug.js, line 20

lineHeight

Properties:

Name	Type	Description
`lineHeight`	number	The line height between the debug text.

Source:

utils/Debug.js, line 41

renderShadow

Properties:

Name	Type	Description
`renderShadow`	boolean	Should the text be rendered with a slight shadow? Makes it easier to read on different types of background.

Source:

utils/Debug.js, line 46

Methods

line(text, x, y)

Internal method that outputs a single line of text.

Parameters:

Name	Type	Argument	Description
`text`	string		The line of text to draw.
`x`	number	<optional>	The X value the debug info will start from.
`y`	number	<optional>	The Y value the debug info will start from.

Source:

utils/Debug.js, line 116

renderBodyInfo(sprite, x, y, color)

Render Sprite Body Physics Data as text.

Parameters:

Name	Type	Argument	Default	Description
`sprite`	Phaser.Sprite			The sprite to be rendered.
`x`	number			X position of the debug info to be rendered.
`y`	number			Y position of the debug info to be rendered.
`color`	string	<optional>	'rgb(255,255,255)'	color of the debug info to be rendered. (format is css color string).

Source:

utils/Debug.js, line 421

renderCameraInfo(camera, x, y, color)

Render camera information including dimensions and location.

Parameters:

Name	Type	Argument	Default	Description
`camera`	Phaser.Camera			Description.
`x`	number			X position of the debug info to be rendered.
`y`	number			Y position of the debug info to be rendered.
`color`	string	<optional>	'rgb(255,255,255)'	color of the debug info to be rendered. (format is css color string).

Source:

utils/Debug.js, line 313

renderCircle(circle, color)

Renders a Circle.

Parameters:

Name	Type	Argument	Description
`circle`	Phaser.Circle		The Circle to render.
`color`	string	<optional>	Color of the debug info to be rendered (format is css color string).

Source:

utils/Debug.js, line 778

renderInputInfo(x, y, color)

Render debug information about the Input object.

Parameters:

Name	Type	Argument	Default	Description
`x`	number			X position of the debug info to be rendered.
`y`	number			Y position of the debug info to be rendered.
`color`	string	<optional>	'rgb(255,255,255)'	color of the debug info to be rendered. (format is css color string).

Source:

utils/Debug.js, line 447

renderLine(line, color)

Renders a Line object in the given color.

Parameters:

Name	Type	Argument	Default	Description
`line`	Phaser.Line			The Line to render.
`color`	string	<optional>	'rgb(255,255,255)'	color of the debug info to be rendered. (format is css color string).

Source:

utils/Debug.js, line 552

renderLineInfo(line, x, y, color)

Renders Line information in the given color.

Parameters:

Name	Type	Argument	Default	Description
`line`	Phaser.Line			The Line to render.
`x`	number			X position of the debug info to be rendered.
`y`	number			Y position of the debug info to be rendered.
`color`	string	<optional>	'rgb(255,255,255)'	color of the debug info to be rendered. (format is css color string).

Source:

utils/Debug.js, line 578

renderPhysicsBody(body, color)

Parameters:

Name	Type	Argument	Default	Description
`body`	array
`color`	string	<optional>	'rgb(255,255,255)'	The color the polygon is stroked in.

Source:

utils/Debug.js, line 830

renderPixel(x, y, color)

Renders a single pixel.

Parameters:

Name	Type	Argument	Description
`x`	number		X position of the debug info to be rendered.
`y`	number		Y position of the debug info to be rendered.
`color`	string	<optional>	Color of the debug info to be rendered (format is css color string).

Source:

utils/Debug.js, line 698

renderPoint(point, color)

Renders a Point object.

Parameters:

Name	Type	Argument	Description
`point`	Phaser.Point		The Point to render.
`color`	string	<optional>	Color of the debug info to be rendered (format is css color string).

Source:

utils/Debug.js, line 721

renderPointer(pointer, hideIfUp, downColor, upColor, color)

Renders the Pointer.circle object onto the stage in green if down or red if up along with debug text.

Parameters:

Name	Type	Argument	Default	Description
`pointer`	Phaser.Pointer			Description.
`hideIfUp`	boolean	<optional>	false	Doesn't render the circle if the pointer is up.
`downColor`	string	<optional>	'rgba(0,255,0,0.5)'	The color the circle is rendered in if down.
`upColor`	string	<optional>	'rgba(255,0,0,0.5)'	The color the circle is rendered in if up (and hideIfUp is false).
`color`	string	<optional>	'rgb(255,255,255)'	color of the debug info to be rendered. (format is css color string).

Source:

utils/Debug.js, line 339

renderPointInfo(sprite, x, y, color)

Renders Point coordinates in the given color.

Parameters:

Name	Type	Argument	Default	Description
`sprite`	Phaser.Point			Description.
`x`	number			X position of the debug info to be rendered.
`y`	number			Y position of the debug info to be rendered.
`color`	string	<optional>	'rgb(255,255,255)'	color of the debug info to be rendered. (format is css color string).

Source:

utils/Debug.js, line 603

renderPolygon(polygon, color)

Parameters:

Name	Type	Argument	Default	Description
`polygon`	array
`color`	string	<optional>	'rgb(255,255,255)'	The color the polygon is stroked in.

Source:

utils/Debug.js, line 896

renderQuadTree(quadtree, color)

Visually renders a QuadTree to the display.

Parameters:

Name	Type	Description
`quadtree`	Phaser.QuadTree	The quadtree to render.
`color`	string	The color of the lines in the quadtree.

Source:

utils/Debug.js, line 177

renderRectangle(rect, color, filled)

Renders a Rectangle.

Parameters:

Name	Type	Argument	Default	Description
`rect`	Phaser.Rectangle			The Rectangle to render.
`color`	string	<optional>		Color of the debug info to be rendered (format is css color string).
`filled`	boolean	<optional>	true	Render the rectangle as a fillRect (default, true) or a strokeRect (false)

Source:

utils/Debug.js, line 743

renderSoundInfo(sound, x, y, color)

Render Sound information, including decoded state, duration, volume and more.

Parameters:

Name	Type	Argument	Default	Description
`sound`	Phaser.Sound			The sound object to debug.
`x`	number			X position of the debug info to be rendered.
`y`	number			Y position of the debug info to be rendered.
`color`	string	<optional>	'rgb(255,255,255)'	color of the debug info to be rendered. (format is css color string).

Source:

utils/Debug.js, line 276

renderSpriteBounds(sprite, color, fill)

Renders just the full Sprite bounds.

Parameters:

Name	Type	Argument	Default	Description
`sprite`	Phaser.Sprite			Description.
`color`	string	<optional>		Color of the debug info to be rendered (format is css color string).
`fill`	boolean	<optional>	false	If false the bounds outline is rendered, if true the whole rectangle is rendered.

Source:

utils/Debug.js, line 626

renderSpriteBounds(sprite, color, fill)

Renders just the full Sprite bounds.

Parameters:

Name	Type	Argument	Default	Description
`sprite`	Phaser.Sprite			Description.
`color`	string	<optional>		Color of the debug info to be rendered (format is css color string).
`fill`	boolean	<optional>	false	If false the bounds outline is rendered, if true the whole rectangle is rendered.

Source:

utils/Debug.js, line 662

renderSpriteCoords(line, x, y, color)

Renders the sprite coordinates in local, positional and world space.

Parameters:

Name	Type	Argument	Default	Description
`line`	Phaser.Sprite			The sprite to inspect.
`x`	number			X position of the debug info to be rendered.
`y`	number			Y position of the debug info to be rendered.
`color`	string	<optional>	'rgb(255,255,255)'	color of the debug info to be rendered. (format is css color string).

Source:

utils/Debug.js, line 520

renderSpriteCorners(sprite, showText, showBounds, color)

Renders the corners and point information of the given Sprite.

Parameters:

Name	Type	Argument	Default	Description
`sprite`	Phaser.Sprite			The sprite to be rendered.
`showText`	boolean	<optional>	false	If true the x/y coordinates of each point will be rendered.
`showBounds`	boolean	<optional>	false	If true the bounds will be rendered over the top of the sprite.
`color`	string	<optional>	'rgb(255,0,255)'	The color the text is rendered in.

Source:

utils/Debug.js, line 217

renderSpriteInfo(sprite, x, y, color)

Render debug infos (including name, bounds info, position and some other properties) about the Sprite.

Parameters:

Name	Type	Argument	Default	Description
`sprite`	Phaser.Sprite			Description.
`x`	number			X position of the debug info to be rendered.
`y`	number			Y position of the debug info to be rendered.
`color`	string	<optional>	'rgb(255,255,255)'	color of the debug info to be rendered. (format is css color string).

Source:

utils/Debug.js, line 473

renderSpriteInputInfo(sprite, x, y, color)

Render Sprite Input Debug information.

Parameters:

Name	Type	Argument	Default	Description
`sprite`	Phaser.Sprite			The sprite to be rendered.
`x`	number			X position of the debug info to be rendered.
`y`	number			Y position of the debug info to be rendered.
`color`	string	<optional>	'rgb(255,255,255)'	color of the debug info to be rendered. (format is css color string).

Source:

utils/Debug.js, line 399

renderText(text, x, y, color, font)

Render text.

Parameters:

Name	Type	Argument	Description
`text`	string		The line of text to draw.
`x`	number		X position of the debug info to be rendered.
`y`	number		Y position of the debug info to be rendered.
`color`	string	<optional>	Color of the debug info to be rendered (format is css color string).
`font`	string		The font of text to draw.

Source:

utils/Debug.js, line 803

splitline(text)

Internal method that outputs a single line of text split over as many columns as needed, one per parameter.

Parameters:

Name	Type	Description
`text`	string	The text to render. You can have as many columns of text as you want, just pass them as additional parameters.

Source:

utils/Debug.js, line 145

start(x, y, color, columnWidth)

Internal method that resets and starts the debug output values.

Parameters:

Name	Type	Argument	Default	Description
`x`	number	<optional>	0	The X value the debug info will start from.
`y`	number	<optional>	0	The Y value the debug info will start from.
`color`	string	<optional>	'rgb(255,255,255)'	The color the debug text will drawn in.
`columnWidth`	number	<optional>	0	The spacing between columns.

Source:

utils/Debug.js, line 70

stop()

Internal method that stops the debug output.

Source:

utils/Debug.js, line 105