PixiJS

Class: GraphicsGeometry

PIXI.GraphicsGeometry

The Graphics class contains methods used to draw primitive shapes such as lines, circles and rectangles to the display, and to color and fill them.

GraphicsGeometry is designed to not be continually updating the geometry since it's expensive to re-tesselate using earcut. Consider using PIXI.Mesh for this use-case, it's much faster.

new PIXI.GraphicsGeometry ()

GraphicsGeometry.js:23

Extends

Members

PIXI.GraphicsGeometry.BATCHABLE_SIZE number static

The maximum number of points to consider an object "batchable", able to be batched by the renderer's batch system.

Default Value:
  • 100

_bounds PIXI.Bounds protected

Cached bounds.

_buffer PIXI.Buffer protected inherited

Buffer used for position, color, texture IDs

_indexBuffer PIXI.Buffer protected inherited

Index buffer data

batchDirty number protected

Batches need to regenerated if the geometry is updated.

batches Array.<PIXI.graphicsUtils.BatchPart> protected

Intermediate abstract format sent to batch system. Can be converted to drawCalls or to batchable objects.

bounds PIXI.Bounds readonly

Get the current bounds of the graphic geometry.

boundsDirty number protected

The bounds dirty flag.

boundsPadding number

Padding to add to the bounds.

Default Value:
  • 0

cacheDirty number protected

Used to check if the cache is dirty.

clearDirty number protected

Used to detect if we cleared the graphicsData.

Default Value:
  • 0

closePointEps number

Minimal distance between points that are considered different. Affects line tesselation.

colors Array.<number> protected

The collection of colors

dirty number protected

Used to detect if the graphics object has changed.

drawCalls Array.<object> protected

List of current draw calls drived from the batches.

graphicsData Array.<PIXI.GraphicsData> protected

The collection of drawn shapes.

indices Array.<number> protected

The indices of the vertices

points Array.<number> protected

An array of points to draw, 2 numbers per point

shapeIndex number protected

Index of the last batched shape in the stack of calls.

textureIds Array.<number> protected

Reference to the texture IDs.

uvs Array.<number> protected

The UVs collection

Methods

_compareStyles (styleA, styleB)

GraphicsGeometry.js:463

Affinity check

Name Type Description
styleA PIXI.FillStyle | PIXI.LineStyle
styleB PIXI.FillStyle | PIXI.LineStyle

addColors (colors, color, alpha, size) protected

GraphicsGeometry.js:829

Add colors.

Name Type Description
colors Array.<number>

List of colors to add to
color number

Color to add
alpha number

Alpha to use
size number

Number of colors to add

addTextureIds (textureIds, id, size) protected

GraphicsGeometry.js:848

Add texture id that the shader/fragment wants to use.

Name Type Description
textureIds Array.<number>
id number
size number

addUvs (verts, uvs, texture, start, size, matrix) protected

GraphicsGeometry.js:866

Generates the UVs for a shape.

Name Type Description
verts Array.<number>

Vertices
uvs Array.<number>

UVs
texture PIXI.Texture

Reference to Texture
start number

Index buffer start index.
size number

The size/length for index buffer.
matrix PIXI.Matrix optional

Optional transform for all points.

adjustUvs (uvs, texture, start, size)

GraphicsGeometry.js:904

Modify uvs array according to position of texture region Does not work with rotated or trimmed textures

Name Type Description
uvs Array.<number>

array
texture PIXI.Texture

region
start number

starting index for uvs
size number

how many points to adjust

buildDrawCalls () protected

GraphicsGeometry.js:557

Converts intermediate batches data to drawCalls.

calculateBounds () protected

GraphicsGeometry.js:738

Update the local bounds of the object. Expensive to use performance-wise.

clear ()PIXI.GraphicsGeometry

GraphicsGeometry.js:204

Clears the graphics that were drawn to this Graphics object, and resets fill and line style settings.

Returns:
Type Description
PIXI.GraphicsGeometry This GraphicsGeometry object. Good for chaining method calls

containsPoint (point)Boolean

GraphicsGeometry.js:299

Check to see if a point is contained within this geometry.

Name Type Description
point PIXI.Point

Point to check if it's contained.
Returns:
Type Description
Boolean true if the point is contained within geometry.

destroy (options)

GraphicsGeometry.js:267

Destroys the Graphics object.

Name Type Description
options object | boolean optional

Options parameter. A boolean will act as if all options have been set to that value

Name Type Default Description
children boolean false optional

if set to true, all the children will have their destroy method called as well. 'options' will be passed on to those calls.
texture boolean false optional

Only used for child Sprites if options.children is set to true Should it destroy the texture of the child sprite
baseTexture boolean false optional

Only used for child Sprites if options.children is set to true Should it destroy the base texture of the child sprite

drawHole (shape, matrix)PIXI.GraphicsGeometry

GraphicsGeometry.js:240

Draws the given shape to this Graphics object. Can be any of Circle, Rectangle, Ellipse, Line or Polygon.

Name Type Description
shape PIXI.Circle | PIXI.Ellipse | PIXI.Polygon | PIXI.Rectangle | PIXI.RoundedRectangle

The shape object to draw.
matrix PIXI.Matrix

Transform applied to the points of the shape.
Returns:
Type Description
PIXI.GraphicsGeometry Returns geometry for chaining.

drawShape (shape, fillStyle, lineStyle, matrix)PIXI.GraphicsGeometry

GraphicsGeometry.js:224

Draws the given shape to this Graphics object. Can be any of Circle, Rectangle, Ellipse, Line or Polygon.

Name Type Description
shape PIXI.Circle | PIXI.Ellipse | PIXI.Polygon | PIXI.Rectangle | PIXI.RoundedRectangle

The shape object to draw.
fillStyle PIXI.FillStyle

Defines style of the fill.
lineStyle PIXI.LineStyle

Defines style of the lines.
matrix PIXI.Matrix

Transform applied to the points of the shape.
Returns:
Type Description
PIXI.GraphicsGeometry Returns geometry for chaining.

invalidate ()

GraphicsGeometry.js:173

Call if you changed graphicsData manually. Empties all batch buffers.

isBatchable () protected

GraphicsGeometry.js:538

Checks to see if this graphics geometry can be batched. Currently it needs to be small enough and not contain any native lines.

packAttributes () protected

GraphicsGeometry.js:655

Packs attributes to single buffer.

packBatches () protected

GraphicsGeometry.js:514

Offset the indices so that it works with the batcher.

processFill (data) protected

GraphicsGeometry.js:685

Process fill part of Graphics.

Name Type Description
data PIXI.GraphicsData

processHoles (holes) protected

GraphicsGeometry.js:719

Process the holes data.

Name Type Description
holes Array.<PIXI.GraphicsData>

Holes to render

processLine (data) protected

GraphicsGeometry.js:705

Process line part of Graphics.

Name Type Description
data PIXI.GraphicsData

transformPoints (points, matrix) protected

GraphicsGeometry.js:809

Transform points using matrix.

Name Type Description
points Array.<number>

Points to transform
matrix PIXI.Matrix

Transform matrix

updateBatches ()

GraphicsGeometry.js:353

Generates intermediate batch data. Either gets converted to drawCalls or used to convert to batch objects directly by the Graphics object.

validateBatching () protected

GraphicsGeometry.js:489

Test geometry for batching process.