Core. Graphics

Graphics Class is used to create drawing display objects. Graphics can draw multiple bitmaps or vector drawings at the same time, and can also combine save, restore, transform, scale, rotate, translate, alpha and other instructions to change the drawing effect. Graphics is stored as a command stream and can access all command streams through the CMDS property. Graphics is a more lightweight object than Sprite, and the rational use of a set of Graphics commands that can improve application performance, such as converting a large number of node drawings to a node, can reduce the amount of node creation consumption.

Constructor

new Graphics()

See:
  • display.Sprite#graphics

Methods

alpha(value)

Set transparency.
Parameters:
Name Type Description
value Number Transparency.

clear(recoverCmds)

Empty drawing commands.

Parameters:
Name Type Description
recoverCmds Boolean If the array of instruction drawings is returned to true, then the instruction array is recycled to save memory, and the recommendation is set to true for recycling. However, if the array is manually referenced, it is not recommended to recycle

clipRect(x, y, width, height)

Sets the clipping area, which does not display coordinates beyond the clipping area.
Parameters:
Name Type Description
x Number X axis offset.
y Number Y axis offset.
width Number Width.
height Number Height.

destroy()

Destroy this object.

drawCircle(x, y, radius, fillColor, lineColoropt, lineWidthopt)

Draw circles.
Parameters:
Name Type Attributes Default Description
x Number Dot X axis position.
y Number Dot Y axis position.
radius Number Radius.
fillColor Object Fill in the color or fill the gradient object of the drawing.
lineColor Object <optional>
 null lineColor (optional) border color, or the gradient object that fills the drawing.
lineWidth Number <optional>
 1 lineWidth (optional) border width.

drawCurves(x, y, points, lineColor, lineWidthopt)

Draw a series of curves.
Parameters:
Name Type Attributes Default Description
x Number Start drawing the X axis position.
y Number Start drawing the Y axis position.
points Array A set of points in a line segment [controlX, controlY, anchorX, anchorY...] .
lineColor Object Line segment color, or fill the drawing gradient object.
lineWidth Number <optional>
 1 lineWidth (optional) line width.

drawImage(tex, xopt, yopt, widthopt, heightopt)

Parameters:
Name Type Attributes Default Description
tex Texture
x Number <optional>
 0 x
y Number <optional>
 0 y
width Number <optional>
 0 width
height Number <optional>
 0 height

drawLine(fromX, fromY, toX, toY, lineColor, lineWidthopt)

Draw a line.
Parameters:
Name Type Attributes Default Description
fromX Number X axis start position.
fromY Number Y axis start position.
toX Number X axis end position.
toY Number Y axis end position.
lineColor String Colour.
lineWidth Number <optional>
 1 lineWidth (optional) line width.

drawLines(x, y, points, lineColor, lineWidthopt)

Draw a series of lines.
Parameters:
Name Type Attributes Default Description
x Number Start drawing the X axis position.
y Number Start drawing the Y axis position.
points Array A set of points of a line segment. Format: [x1,y1,x2,y2,x3,y3...] .
lineColor Object Line segment color, or fill the drawing gradient object.
lineWidth Number <optional>
 1 lineWidth (optional) line width.

drawPath(x, y, paths, brushopt, penopt)

Draw path.
Parameters:
Name Type Attributes Default Description
x Number Start drawing the X axis position.
y Number Start drawing the Y axis position.
paths Array Path collection, the path supports the following format: [["moveTo",x,y] , ["lineTo",x,y] , ["arcTo",x1,y1,x2,y2,r] , ["closePath"] ].
brush Object <optional>
 null brush (optional) a brush definition that supports the following settings {fillStyle}.
pen Object <optional>
 null pen (optional) brush definition, support the following settings {strokeStyle, lineWidth, lineJoin, lineCap, miterLimit}.

drawPie(x, y, radius, startAngle, endAngle, fillColor, lineColoropt, lineWidthopt)

Fan plotting.
Parameters:
Name Type Attributes Default Description
x Number Start drawing the X axis position.
y Number Start drawing the Y axis position.
radius Number Fan radius.
startAngle Number Starting angle.
endAngle Number End angle.
fillColor Object Fill in the color or fill the gradient object of the drawing.
lineColor Object <optional>
 null lineColor (optional) border color, or the gradient object that fills the drawing.
lineWidth Number <optional>
 1 lineWidth (optional) border width.

drawPoly(x, y, points, fillColor, lineColoropt, lineWidthopt)

Draw polygons.
Parameters:
Name Type Attributes Default Description
x Number Start drawing the X axis position.
y Number Start drawing the Y axis position.
points Array Set of points of a polygon.
fillColor Object Fill in the color or fill the gradient object of the drawing.
lineColor Object <optional>
 null lineColor (optional) border color, or the gradient object that fills the drawing.
lineWidth Number <optional>
 1 lineWidth (optional) border width.

drawRect(x, y, width, height, fillColor, lineColoropt, lineWidthopt)

Draw rectangle.
Parameters:
Name Type Attributes Default Description
x Number Start drawing the X axis position.
y Number Start drawing the Y axis position.
width Number Rectangular width.
height Number Rectangle height.
fillColor Object Fill in the color or fill the gradient object of the drawing.
lineColor Object <optional>
 null lineColor (optional) border color, or the gradient object that fills the drawing.
lineWidth Number <optional>
 1 lineWidth (optional) border width.

drawTexture(tex, xopt, yopt, widthopt, heightopt, mopt, alphaopt)

Draw texture.
Parameters:
Name Type Attributes Default Description
tex Texture Grain.
x Number <optional>
 0 x (optional) X axis offset.
y Number <optional>
 0 y (optional) Y axis offset.
width Number <optional>
 0 width Width (optional).
height Number <optional>
 0 height (optional) height.
m Matrix <optional>
 null m (optional) matrix information.
alpha Number <optional>
 1 alpha (optional) transparency.

drawTextures(tex, pos)

Batch render the same texture.
Parameters:
Name Type Description
tex Texture Grain.
pos Array Draw times and coordinates.

drawTriangles(tex, x, y, vertices, indices, uvData, matrixopt)

Draw a set of triangles
Parameters:
Name Type Attributes Default Description
tex Texture Grain.
x Number X axis offset.
y Number Y axis offset.
vertices Float32Array Vertex array.
indices Float32Array Vertex index.
uvData Uint16Array UV data
matrix Matrix <optional>
 null matrix Scaling matrix.

fillBorderText(text, x, y, font, fillColor, borderColor, lineWidth, textAlign)

Draw "filled and edged" text on canvas.
Parameters:
Name Type Description
text Object Text that is output on canvas.
x Number Start drawing the X coordinates of the text (relative to the canvas).
y Number Start drawing the Y coordinates of the text (relative to the canvas).
font String Define fonts and font sizes, such as "20px Arial"".
fillColor String Define text colors, such as "#ff0000"".
borderColor String Defines border text colors.
lineWidth Number Border line width.
textAlign String Text alignment, optional values: 'left', 'center', 'right'".

fillText(text, x, y, font, color, textAlign)

Draw text on canvas.
Parameters:
Name Type Description
text String Text that is output on canvas.
x Number Start drawing the X coordinates of the text (relative to the canvas).
y Number Start drawing the Y coordinates of the text (relative to the canvas).
font String Define the font size and font, such as "20px Arial"".
color String Define text colors, such as "#ff0000"".
textAlign String Text alignment, optional values: 'left', 'center', 'right'".

fillTexture(tex, x, y, widthopt, heightopt, typeopt, offsetopt)

Fill it with texture.
Parameters:
Name Type Attributes Default Description
tex Texture Grain.
x Number X axis offset.
y Number Y axis offset.
width Number <optional>
 0 width Width (optional).
height Number <optional>
 0 height (optional) height.
type String <optional>
 "repeat" type (optional) fill type repeat|repeat-x|repeat-y|no-repeat
offset Point <optional>
 null offset (optional) texture texture offset

getBounds(realSize) → {Rectangle}

To get the position and width of the information matrix (high consumption compared with CPU, frequent use will cause Carlton, with as little as possible).
Parameters:
Name Type Description
realSize Boolean (optional) use the true size of the picture, and defaults to false
Returns:
Type:
Rectangle
A Rectangle object consisting of position and width.

loadImage(url, xopt, yopt, widthopt, heightopt, completeopt)

Load and display a picture.
Parameters:
Name Type Attributes Default Description
url String Picture address.
x Number <optional>
 0 x (optional) displays the x position of the picture.
y Number <optional>
 0 y (optional) displays the Y position of the picture.
width Number <optional>
 0 width (optional) display the width of the picture, set to 0, which indicates the default width of the picture.
height Number <optional>
 0 height (optional) display the height of the picture, set to 0, which indicates the default height to use the picture.
complete function <optional>
 null complete (optional) the load completes the callback.

restore()

The path state and properties that have been saved before returning.

rotate(angle, pivotXopt, pivotYopt)

Rotate current drawing. (recommend using transform, higher performance)
Parameters:
Name Type Attributes Default Description
angle Number Angle of rotation, in radians.
pivotX Number <optional>
 0 pivotX (optional) horizontal axis point coordinates.
pivotY Number <optional>
 0 pivotY (optional) vertical axis point coordinates.

save()

Save the status of the current environment.

scale(scaleX, scaleY, pivotXopt, pivotYopt)

Zoom current drawing to larger or smaller. (recommend using transform, higher performance)
Parameters:
Name Type Attributes Default Description
scaleX Number Horizontal scaling.
scaleY Number Vertical scaling.
pivotX Number <optional>
 0 pivotX (optional) horizontal axis point coordinates.
pivotY Number <optional>
 0 pivotY (optional) vertical axis point coordinates.

strokeText(text, x, y, font, color, lineWidth, textAlign)

The text is drawn on the canvas (no coloring). The default color for the text is black.
Parameters:
Name Type Description
text Object Text that is output on canvas.
x Number Start drawing the X coordinates of the text (relative to the canvas).
y Number Start drawing the Y coordinates of the text (relative to the canvas).
font String Define fonts and font sizes, such as "20px Arial"".
color String Define text colors, such as "#ff0000"".
lineWidth Number Line width.
textAlign String Text alignment, optional values: 'left', 'center', 'right'".

transform(mat, pivotXopt, pivotYopt)

Replace the current transformation matrix of the drawing.
Parameters:
Name Type Attributes Default Description
mat Matrix Matrix.
pivotX Number <optional>
 0 pivotX (optional) horizontal axis point coordinates.
pivotY Number <optional>
 0 pivotY (optional) vertical axis point coordinates.

translate(x, y)

Remapping the (0,0) position on the canvas.
Parameters:
Name Type Description
x Number The value added to the horizontal coordinate (x).
y Number The value added to the vertical coordinate (Y).