Skip to content

DebugContext

Under Construction

This documentation is auto-generated, and is a work in progress. Please see the source code at https://github.com/phetsims/scenery/blob/main/js/debug/DebugContext.js for the most up-to-date information.

Overview

A debugging version of the CanvasRenderingContext2D that will output all commands issued, but can also forward them to a real context

See the spec at http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html#2dcontext Wrapping of the CanvasRenderingContext2D interface as of January 27th, 2013 (but not other interfaces like TextMetrics and Path)

Shortcut to create: var context = new phet.scenery.DebugContext( document.createElement( 'canvas' ).getContext( '2d' ) );

@author Jonathan Olson <jonathan.olson@colorado.edu>

Class DebugContext

import { DebugContext } from 'scenerystack/scenery';

Constructor

new DebugContext( context )

Instance Methods

commit()

@public

save()

@public

restore()

@public

scale( x, y )

@public

@param {number} x @param {number} y

rotate( angle )

@public

@param {number} angle

translate( x, y )

@public

@param {number} x @param {number} y

transform( a, b, c, d, e, f )

@public

@param {number} a @param {number} b @param {number} c @param {number} d @param {number} e @param {number} f

setTransform( a, b, c, d, e, f )

@public

@param {number} a @param {number} b @param {number} c @param {number} d @param {number} e @param {number} f

resetTransform()

@public

createLinearGradient( x0, y0, x1, y1 )

@public

@param {number} x0 @param {number} y0 @param {number} x1 @param {number} y1 @returns {*}

createRadialGradient( x0, y0, r0, x1, y1, r1 )

@public

@param {number} x0 @param {number} y0 @param {number} r0 @param {number} x1 @param {number} y1 @param {number} r1 @returns {*}

createPattern( image, repetition )

@public

@param {} image @param {string} repetition @returns {}

clearRect( x, y, w, h )

@public

@param {number} x @param {number} y @param {number} w @param {number} h

fillRect( x, y, w, h )

@public

@param {number} x @param {number} y @param {number} w @param {number} h

strokeRect( x, y, w, h )

@public

@param {number} x @param {number} y @param {number} w @param {number} h

beginPath()

@public

fill( path )

@public

@param {Path2D} path

stroke( path )

@public

@param {Path2D} path

scrollPathIntoView( path )

@public

@param {Path2D} path

clip( path )

@public

@param {Path2D} path

resetClip()

@public

isPointInPath( a, b, c )

@public

@param {} a @param {} b @param {} c @returns {}

fillText( text, x, y, maxWidth )

@public

@param {} text @param {number} x @param {number} y @param {} maxWidth

strokeText( text, x, y, maxWidth )

@public

@param {} text @param {number} x @param {number} y @param {} maxWidth

measureText( text )

@public

@param {} text @returns {}

drawImage( image, a, b, c, d, e, f, g, h )

@public

@param {} image @param {} a @param {} b @param {} c @param {} d @param {} e @param {} f @param {} g @param {number} h

addHitRegion( options )

@public

@param {[Object]} options

removeHitRegion( options )

@public

@param {[Object]} options

createImageData( a, b )

@public

@param {} a @param {} b @returns {*}

createImageDataHD( a, b )

@public

@param {} a @param {} b @returns {*}

getImageData( sx, sy, sw, sh )

@public

@param {} sx @param {} sy @param {} sw @param {} sh @returns {*}

getImageDataHD( sx, sy, sw, sh )

@public

@param {} sx @param {} sy @param {} sw @param {} sh @returns {*}

putImageData( imageData, dx, dy, dirtyX, dirtyY, dirtyWidth, dirtyHeight )

@public

@param {} imageData @param {} dx @param {} dy @param {} dirtyX @param {} dirtyY @param {} dirtyWidth @param {*} dirtyHeight

putImageDataHD( imageData, dx, dy, dirtyX, dirtyY, dirtyWidth, dirtyHeight )

@public

@param {} imageData @param {} dx @param {} dy @param {} dirtyX @param {} dirtyY @param {} dirtyWidth @param {*} dirtyHeight

setLineDash( segments )

@public

@param {*} segments

getLineDash()

@public @returns {*}

closePath()

@public

moveTo( x, y )

@public

@param {number} x @param {number} y

lineTo( x, y )

@public

@param {number} x @param {number} y

quadraticCurveTo( cpx, cpy, x, y )

@public

@param {} cpx @param {} cpy @param {number} x @param {number} y

bezierCurveTo( cp1x, cp1y, cp2x, cp2y, x, y )

@public

@param {} cp1x @param {} cp1y @param {} cp2x @param {} cp2y @param {number} x @param {number} y

arcTo( x1, y1, x2, y2, radiusX, radiusY, rotation )

@public

@param {number} x1 @param {number} y1 @param {number} x2 @param {number} y2 @param {number} radiusX @param {number} radiusY @param {number} rotation

rect( x, y, w, h )

@public

@param {number} x @param {number} y @param {number} w @param {number} h

arc( x, y, radius, startAngle, endAngle, anticlockwise )

@public

@param {number} x @param {number} y @param {number} radius @param {number} startAngle @param {number} endAngle @param {boolean} anticlockwise

ellipse( x, y, radiusX, radiusY, rotation, startAngle, endAngle, anticlockwise )

@public

@param {number} x @param {number} y @param {number} radiusX @param {number} radiusY @param {number} rotation @param {number} startAngle @param {number} endAngle @param {boolean} anticlockwise

Source Code

See the source for DebugContext.js in the scenery repository.