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 673

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 254

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 621

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 362

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 467

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 493

renderPhysicsBody(body, color)

Parameters:

Name	Type	Argument	Default	Description
`body`	Phaser.Body			The Phaser.Body instance to render all shapes from.
`color`	string	<optional>	'rgb(255,255,255)'	The color the polygon is stroked in.

Source:

utils/Debug.js, line 699

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 541

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 564

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 280

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 518

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 586

renderShape(shape, x, y, angle)

Parameters:

Name	Type	Description
`shape`	p2.Shape	The shape to render.
`x`	number	The x coordinate of the Body to translate to.
`y`	number	The y coordinate of the Body to translate to.
`angle`	number	The angle of the Body to rotate to.

Source:

utils/Debug.js, line 745

renderShape(x, y, shape, offset, angle)

Parameters:

Name	Type	Description
`x`	number	The x coordinate of the Body to translate to.
`y`	number	The y coordinate of the Body to translate to.
`shape`	p2.Shape	The shape to render.
`offset`	number	-
`angle`	number	-

Source:

utils/Debug.js, line 776

renderShape(shape, x, y, angle)

Parameters:

Name	Type	Description
`shape`	p2.Shape	The shape to render.
`x`	number	The x coordinate of the Body to translate to.
`y`	number	The y coordinate of the Body to translate to.
`angle`	number	The angle of the Body to rotate to.

Source:

utils/Debug.js, line 799

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 217

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 435

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 388

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 340

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 646

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