Class R.rendercontexts.CanvasContext
Extends
R.rendercontexts.RenderContext2D.
A canvas element represented within the engine. A canvas
is a 2D context which can render lines, images, and polygons. Transformations
can be saved and restored, allowing for complex, stacked transformations.
Defined in: canvascontext.js.
Constructor Attributes | Constructor Name and Description |
---|---|
R.rendercontexts.CanvasContext(name, width, height)
Create a new instance of a canvas context.
|
- Fields borrowed from class R.rendercontexts.RenderContext2D:
- FONT_ALIGN_CENTER, FONT_ALIGN_END, FONT_ALIGN_LEFT, FONT_ALIGN_RIGHT, FONT_ALIGN_START, FONT_BASELINE_ALPHABETIC, FONT_BASELINE_BOTTOM, FONT_BASELINE_HANGING, FONT_BASELINE_IDEOGRAPHIC, FONT_BASELINE_MIDDLE, FONT_BASELINE_TOP, FONT_STYLE_ITALIC, FONT_STYLE_NORMAL, FONT_STYLE_OBLIQUE, FONT_WEIGHT_BOLD, FONT_WEIGHT_LIGHT, FONT_WEIGHT_NORMAL
- Fields borrowed from class R.struct.Container:
- EMPTY
Method Attributes | Method Name and Description |
---|---|
arcTo(point1, point2, radius)
Draw an arc from the current point to the specified point.
|
|
bezierCurveTo(cPoint1, cPoint2, point)
Draw a bezier curve from the current point to the specified point.
|
|
captureBin(bin, itr)
Capture the dirty rectangles for the bin
|
|
drawArc(point, radius, startAngle, endAngle)
Draw an un-filled arc on the context.
|
|
drawFilledArc(point, radius, startAngle, endAngle)
Draw a filled arc on the context.
|
|
drawFilledRectangle(rect)
Draw a filled rectangle on the context.
|
|
drawImage(rect, image, srcRect)
Draw an image on the context.
|
|
drawLine(point1, point2)
Draw a line on the context.
|
|
drawPoint(point)
Draw a point on the context.
|
|
drawRectangle(rect)
Draw an un-filled rectangle on the context.
|
|
drawSprite(sprite, time, dt)
Draw a sprite on the context.
|
|
drawText(point, text)
Draw filled text on the context.
|
|
endPath()
End a path.
|
|
fillPath()
Fill a path using the current fill style.
|
|
Gets the surface context upon which all objects are drawn.
|
|
Get the class name of this object
|
|
getDataURL(format)
Useful method which returns a data URL which represents the
current state of the canvas context.
|
|
getImage(rect)
Capture an image from the context.
|
|
getTextMetrics(text)
Get a rectangle that will approximately enclose the text drawn by the render context.
|
|
lineTo(point)
Draw a line from the current point to the point specified.
|
|
moveTo(point)
Move the current path to the point sepcified.
|
|
Pop a transform state off the stack.
|
|
Push a transform state onto the stack.
|
|
putImage(imageData, point)
Draw an image, captured with #getImage, to
the context.
|
|
quadraticCurveTo(cPoint, point)
Draw a quadratic curve from the current point to the specified point.
|
|
release()
Releases the context back into the object pool.
|
|
renderBin(bin, itr, time, dt)
Render all of the objects in a single bin, grouped by z-index.
|
|
reset(rect)
Reset the entire context, clearing it and preparing it for drawing.
|
|
resetBin(bin)
Reset the bin's dirty rectangles before drawing the dirty objects
in the bin.
|
|
setBackgroundColor(color)
Set the background color of the context.
|
|
setDivisions(divisions)
Set the number of divisions along the X and Y axis used to determine the
number of dirty rectangles for the current viewport.
|
|
setFillStyle(fillStyle)
Set the fill style of the context.
|
|
setLineStyle(lineStyle)
Set the line style for the context.
|
|
setLineWidth(width)
Set the line width for drawing paths.
|
|
setPosition(point)
Set the current transform position (translation).
|
|
setRotation(angle)
Set the rotation angle of the current transform
|
|
setScale(scaleX, scaleY)
Set the scale of the current transform.
|
|
setTransform(matrix)
Set the transformation using a matrix.
|
|
setupWorld(time, dt)
Set up the world for the given time before any rendering is dont.
|
|
setWorldScale(scaleX, scaleY)
Set the scale of the world
|
|
Start a path.
|
|
Stroke a path using the current line style and width.
|
|
strokeText(point, text)
Draw stroked (outline) text on the context.
|
- Methods borrowed from class R.rendercontexts.RenderContext2D:
- add, cleanUp, drawCircle, drawElement, drawFilledCircle, drawFilledPolygon, drawFilledRegularPolygon, drawPolygon, drawPolyline, drawRegularPolygon, getBackgroundColor, getBoundingBox, getFillStyle, getFont, getFontAlign, getFontBaseline, getFontSize, getFontStyle, getFontWeight, getHeight, getLineStyle, getLineWidth, getNormalizedFont, getPosition, getRenderPosition, getRenderRotation, getRenderScale, getRotation, getScaleX, getScaleY, getTransform, getWidth, lineSeg, postRender, remove, render, setFont, setFontAlign, setFontBaseline, setFontSize, setFontStyle, setFontWeight, setHeight, setRenderTransform, setWidth, sort, sortFn, swapBins
- Methods borrowed from class R.rendercontexts.AbstractRenderContext:
- captureMouse, captureTouch, destroy, getContextData, getExpandedViewport, getMouseInfo, getSurface, getTouchInfo, getViewport, getWorldBoundary, getWorldPosition, getWorldRotation, getWorldScale, isStatic, removeAtIndex, renderObject, resetTransformStack, setStatic, setSurface, setViewport, setWorldBoundary, setWorldPosition, setWorldRotation, uncaptureMouse, uncaptureTouch, update
- Methods borrowed from class R.struct.Container:
- addAll, append, clear, clone, concat, contains, filter, forEach, fromArray, get, getAll, getObjects, getProperties, insert, iterator, reduce, replace, replaceAt, size, subset, toXML
- Methods borrowed from class R.engine.BaseObject:
- addEvent, addEvents, getElement, jQ, removeEvent, setElement, triggerEvent
- Methods borrowed from class R.engine.PooledObject:
- clearObjectDataModel, getId, getName, getObjectDataModel, isDestroyed, setName, setObjectDataModel, toString
Class Detail
R.rendercontexts.CanvasContext(name, width, height)
Create a new instance of a canvas context.
- Parameters:
- name
- {String} The name of the context
- width
- {Number} The width (in pixels) of the canvas context.
- height
- {Number} The height (in pixels) of the canvas context.
Method Detail
arcTo(point1, point2, radius)
Draw an arc from the current point to the specified point.
- Parameters:
- point1
- {R.math.Point2D} Arc point 1
- point2
- {R.math.Point2D} Arc point 2
- radius
- {Number} The radius of the arc
bezierCurveTo(cPoint1, cPoint2, point)
Draw a bezier curve from the current point to the specified point.
- Parameters:
- cPoint1
- {R.math.Point2D} Control point 1
- cPoint2
- {R.math.Point2D} Control point 2
- point
- {R.math.Point2D} The point to draw to
captureBin(bin, itr)
Capture the dirty rectangles for the bin
- Parameters:
- {Object} bin
- {Object} itr
drawArc(point, radius, startAngle, endAngle)
Draw an un-filled arc on the context. Arcs are drawn in clockwise
order.
- Parameters:
- point
- {R.math.Point2D} The point around which the arc will be drawn
- radius
- {Number} The radius of the arc in pixels
- startAngle
- {Number} The starting angle of the arc in degrees
- endAngle
- {Number} The end angle of the arc in degrees
drawFilledArc(point, radius, startAngle, endAngle)
Draw a filled arc on the context. Arcs are drawn in clockwise
order.
- Parameters:
- point
- {R.math.Point2D} The point around which the arc will be drawn
- radius
- {Number} The radius of the arc in pixels
- startAngle
- {Number} The starting angle of the arc in degrees
- endAngle
- {Number} The end angle of the arc in degrees
drawFilledRectangle(rect)
Draw a filled rectangle on the context.
- Parameters:
- rect
- {R.math.Rectangle2D} The rectangle to draw
drawImage(rect, image, srcRect)
Draw an image on the context.
- Parameters:
- rect
- {R.math.Rectangle2D} The rectangle that specifies the position and dimensions of the image rectangle.
- image
- {Object} The image to draw onto the context
- srcRect Optional
- {R.math.Rectangle2D} [optional] The source rectangle within the image, if null the entire image is used
drawLine(point1, point2)
Draw a line on the context.
- Parameters:
- point1
- {R.math.Point2D} The start of the line
- point2
- {R.math.Point2D} The end of the line
drawPoint(point)
Draw a point on the context.
- Parameters:
- point
- {R.math.Point2D} The position to draw the point
drawRectangle(rect)
Draw an un-filled rectangle on the context.
- Parameters:
- rect
- {R.math.Rectangle2D} The rectangle to draw
drawSprite(sprite, time, dt)
Draw a sprite on the context.
- Parameters:
- sprite
- {R.resources.types.Sprite} The sprite to draw
- time
- {Number} The current world time
- dt
- {Number} The delta between the world time and the last time the world was updated in milliseconds.
drawText(point, text)
Draw filled text on the context.
- Parameters:
- point
- {R.math.Point2D} The top-left position to draw the image.
- text
- {String} The text to draw
endPath()
End a path.
fillPath()
Fill a path using the current fill style.
{Object}
get2DContext()
Gets the surface context upon which all objects are drawn.
- Returns:
- {Object}
{String}
getClassName()
Get the class name of this object
- Returns:
- {String} "R.rendercontexts.CanvasContext"
{String}
getDataURL(format)
Useful method which returns a data URL which represents the
current state of the canvas context. The URL can be passed to
an image element. Note: Only works in Firefox and Opera!
- Parameters:
- {String} format
- The mime-type of the output, or null for the PNG default. (unsupported)
- Returns:
- {String} The data URL
{Array}
getImage(rect)
Capture an image from the context.
- Parameters:
- rect
- {R.math.Rectangle2D} The area to capture
- Returns:
- {Array} Image data capture
{R.math.Rectangle2D}
getTextMetrics(text)
Get a rectangle that will approximately enclose the text drawn by the render context.
- Parameters:
- text
- {String} The text to measure
- Returns:
- {R.math.Rectangle2D}
lineTo(point)
Draw a line from the current point to the point specified.
- Parameters:
- point
- {R.math.Point2D} The point to draw a line to
moveTo(point)
Move the current path to the point sepcified.
- Parameters:
- point
- {R.math.Point2D} The point to move to
popTransform()
Pop a transform state off the stack.
pushTransform()
Push a transform state onto the stack.
putImage(imageData, point)
Draw an image, captured with #getImage, to
the context.
- Parameters:
- imageData
- {Array} Image data captured
- point
- {R.math.Point2D} The poisition at which to draw the image
quadraticCurveTo(cPoint, point)
Draw a quadratic curve from the current point to the specified point.
- Parameters:
- cPoint
- {R.math.Point2D} The control point
- point
- {R.math.Point2D} The point to draw to
release()
Releases the context back into the object pool. See PooledObject#release
for more information.
renderBin(bin, itr, time, dt)
Render all of the objects in a single bin, grouped by z-index.
- Parameters:
- bin
- {Number} The bin number being rendered
- itr
- {R.lang.Iterator} The iterator over all the objects in the bin
- time
- {Number} The current render time in milliseconds from the engine.
- dt
- {Number} The delta between the world time and the last time the world was updated in milliseconds.
reset(rect)
Reset the entire context, clearing it and preparing it for drawing.
- Parameters:
- rect
resetBin(bin)
Reset the bin's dirty rectangles before drawing the dirty objects
in the bin.
- Parameters:
- {Object} bin
setBackgroundColor(color)
Set the background color of the context.
- Parameters:
- color
- {String} An HTML color
setDivisions(divisions)
Set the number of divisions along the X and Y axis used to determine the
number of dirty rectangles for the current viewport.
- Parameters:
- divisions
- {Number} The number of divisions along X and Y. Defaults to 5.
setFillStyle(fillStyle)
Set the fill style of the context.
- Parameters:
- fillStyle
- {String} An HTML color, or null.
setLineStyle(lineStyle)
Set the line style for the context.
- Parameters:
- lineStyle
- {String} An HTML color or null
setLineWidth(width)
Set the line width for drawing paths.
- Parameters:
- width Optional, Default: 1
- {Number} The width of lines in pixels
setPosition(point)
Set the current transform position (translation).
- Parameters:
- point
- {R.math.Point2D} The translation
setRotation(angle)
Set the rotation angle of the current transform
- Parameters:
- angle
- {Number} An angle in degrees
setScale(scaleX, scaleY)
Set the scale of the current transform. Specifying
only the first parameter implies a uniform scale.
- Parameters:
- scaleX
- {Number} The X scaling factor, with 1 being 100%
- scaleY
- {Number} The Y scaling factor
setTransform(matrix)
Set the transformation using a matrix.
- Parameters:
- matrix
- {Matrix} The transformation matrix
setupWorld(time, dt)
Set up the world for the given time before any rendering is dont.
- Parameters:
- time
- {Number} The render time
- dt
- {Number} The delta between the world time and the last time the world was updated in milliseconds.
setWorldScale(scaleX, scaleY)
Set the scale of the world
- Parameters:
- scaleX
- {Number} The scale of the world along the X axis
- scaleY
- {Number} The scale of the world along the y axis
startPath()
Start a path.
strokePath()
Stroke a path using the current line style and width.
strokeText(point, text)
Draw stroked (outline) text on the context.
- Parameters:
- point
- {R.math.Point2D}
- text
- {String} The text to draw