# DrawingContext

## Content

# Abstract Class: DrawingContext

Represents an abstract drawing surface.

## Extends

- [`ObjectBase`](ObjectBase)

## Extended by

- [`BmpContext`](BmpContext)
- [`SvgContext`](SvgContext)
- [`PdfContext`](PdfContext)

## Accessors

### drawTextAsPath

#### Get Signature

```ts
get drawTextAsPath(): boolean;
```

Gets or sets a value indicating if text is rendered using the graphic paths instead of the specialized text drawing services.
Assigning a null value resets the property to a default value that depends on context type.
This property does not affect drawing to [BmpContext](BmpContext).

##### Returns

`boolean`

#### Set Signature

```ts
set drawTextAsPath(value): void;
```

Gets or sets a value indicating if text is rendered using the graphic paths instead of the specialized text drawing services.
Assigning a null value resets the property to a default value that depends on context type.
This property does not affect drawing to [BmpContext](BmpContext).

##### Parameters

###### value

`boolean`

##### Returns

`void`

***

### fontCollection

#### Get Signature

```ts
get fontCollection(): FontCollection;
```

Gets or sets the [FontCollection](FontCollection) used by measureText and [DrawingContext#drawText](#drawtext)/[DrawingContext#drawLayout](#drawlayout) methods.

##### Returns

[`FontCollection`](FontCollection)

#### Set Signature

```ts
set fontCollection(coll): void;
```

Gets or sets the [FontCollection](FontCollection) used by measureText and [DrawingContext#drawText](#drawtext)/[DrawingContext#drawLayout](#drawlayout) methods.

##### Parameters

###### coll

[`FontCollection`](FontCollection)

##### Returns

`void`

***

### height

#### Get Signature

```ts
get abstract height(): number;
```

Gets the height of the DrawingContext, in context graphic units.

##### Returns

`number`

***

### id

#### Get Signature

```ts
get id(): number;
```

Gets the reference to the object.

##### Returns

`number`

#### Inherited from

[`ObjectBase`](ObjectBase).[`id`](ObjectBase#id)

***

### matrix

#### Get Signature

```ts
get matrix(): number[];
```

Gets or sets the transformation matrix.
The matrix consists of six numbers (their meaning is simplified for clarity):
m11 - scales the drawing horizontally
m12 - skew the the drawing horizontally
m21 - skew the the drawing vertically
m22 - scales the drawing vertically
m31 - moves the the drawing horizontally
m32 - moves the the drawing vertically

##### Returns

`number`[]

#### Set Signature

```ts
set matrix(matrix): void;
```

Gets or sets the transformation matrix.
The matrix consists of six numbers (their meaning is simplified for clarity):
m11 - scales the drawing horizontally
m12 - skew the the drawing horizontally
m21 - skew the the drawing vertically
m22 - scales the drawing vertically
m31 - moves the the drawing horizontally
m32 - moves the the drawing vertically

##### Parameters

###### matrix

`number`[]

##### Returns

`void`

***

### om

#### Get Signature

```ts
get om(): ObjectManager;
```

Gets the owner [ObjectManager](ObjectManager) instance.

##### Returns

[`ObjectManager`](ObjectManager)

#### Inherited from

[`ObjectBase`](ObjectBase).[`om`](ObjectBase#om)

***

### resolution

#### Get Signature

```ts
get abstract resolution(): number;
```

Gets the resolution of the DrawingContext, in dots per Inch.

##### Returns

`number`

***

### transform

#### Get Signature

```ts
get transform(): Transform;
```

Gets or sets the current transformation of the drawing surface.

##### Returns

[`Transform`](Transform)

#### Set Signature

```ts
set transform(transform): void;
```

Gets or sets the current transformation of the drawing surface.

##### Parameters

###### transform

[`Transform`](Transform)

##### Returns

`void`

***

### type

#### Get Signature

```ts
get abstract type(): ContextType;
```

Gets the type of DrawingContext.

##### Returns

[`ContextType`](../enumerations/ContextType)

***

### width

#### Get Signature

```ts
get abstract width(): number;
```

Gets the width of the DrawingContext, in context graphic units.

##### Returns

`number`

## Methods

### applyTransform()

```ts
applyTransform(transform): void;
```

Applies a new transformation to the current transformation matrix.

#### Parameters

##### transform

[`Transform`](Transform)

The [Transform](Transform) object to be multiplied by the current transformation matrix.

#### Returns

`void`

***

### createPath()

```ts
createPath(): GraphicsPath;
```

Creates a new [GraphicsPath](GraphicsPath).

#### Returns

[`GraphicsPath`](GraphicsPath)

A new instance of the [GraphicsPath](GraphicsPath).

***

### drawEllipse()

#### Call Signature

```ts
drawEllipse(
   x, 
   y, 
   width, 
   height, 
   drawEllipseOptions): void;
```

Draws and fills an ellipse.

##### Parameters

###### x

`number`

The X coordinate of the rectangle enclosing an ellipse.

###### y

`number`

The Y coordinate of the rectangle enclosing an ellipse.

###### width

`number`

The width of the rectangle enclosing an ellipse.

###### height

`number`

The height of the rectangle enclosing an ellipse.

###### drawEllipseOptions

[`DrawEllipseOptions`](../type-aliases/DrawEllipseOptions)

The options for drawing and filling an ellipse.

##### Returns

`void`

#### Call Signature

```ts
drawEllipse(bounds, drawEllipseOptions): void;
```

Draws and fills an ellipse.

##### Parameters

###### bounds

[`Bounds`](../type-aliases/Bounds)

The rectangle enclosing an ellipse.

###### drawEllipseOptions

[`DrawEllipseOptions`](../type-aliases/DrawEllipseOptions)

The options for drawing and filling an ellipse.

##### Returns

`void`

***

### drawImage()

#### Call Signature

```ts
drawImage(
   image, 
   x, 
   y, 
   width, 
   height, 
   drawImageOptions?): void;
```

Draws an image or bitmap with specified size, location, and opacity.

##### Parameters

###### image

[`ImageOrBitmap`](../type-aliases/ImageOrBitmap)

The image object to draw.

###### x

`number`

The X coordinate of the destination rectangle.

###### y

`number`

The Y coordinate of the destination rectangle.

###### width

`number`

The width of the destination rectangle.

###### height

`number`

The height of the destination rectangle.

###### drawImageOptions?

[`DrawImageOptions`](../type-aliases/DrawImageOptions)

The options for drawing an image.

##### Returns

`void`

#### Call Signature

```ts
drawImage(
   image, 
   bounds, 
   drawImageOptions?): void;
```

Draws an image or bitmap with specified size, location, and opacity.

##### Parameters

###### image

[`ImageOrBitmap`](../type-aliases/ImageOrBitmap)

The image object to draw.

###### bounds

[`Bounds`](../type-aliases/Bounds)

The destination rectangle.

###### drawImageOptions?

[`DrawImageOptions`](../type-aliases/DrawImageOptions)

The options for drawing an image.

##### Returns

`void`

***

### drawLayout()

```ts
drawLayout(
   layout, 
   x, 
   y): void;
```

Draws a [Layout](Layout) at the specified position.

#### Parameters

##### layout

  \| [`Layout`](Layout)
  \| [`LayoutProperties`](../type-aliases/LayoutProperties)

An existing Layout object or the properties describing a new Layout settings.

##### x

`number`

The X coordinate at which to draw the Layout.

##### y

`number`

The Y coordinate at which to draw the Layout.

#### Returns

`void`

#### Example

```ts
const font = Font.getPdfFont(StandardPdfFont.CourierBold);
const sb = new SolidBrush("CadetBlue");
const lgb = new LinearGradientBrush({
    startColor: "Red", startPoint: { x: 0, y: 0 },
    gradientStops: [{ offset: 0.5, color: "Green" }],
    endColor: "Blue", endPoint: { x: 1, y: 0 }
});
const rgb = new RadialGradientBrush({ startColor: "Red", endColor: "Green" });

const bitmap = new Bitmap(600, 420);
const ctx = bitmap.newContext({ backColor: "Yellow" });
const tf = new Format({ font: font, fontSize: 40 });

ctx.drawLayout({
    maxWidth: 600,
    firstLineIndent: 50,
    runs: [
      { text: "test font Solid fill brush in DsPdfJS\n", format: tf,
        fillBrush: sb },
      { text: "test Linear Gradient fill in DsPdfJS\n", format: tf,
        fillBrush: lgb },
      { text: "test Radial Gradient fill that spans multiple lines in DsPdfJS",
        format: tf, fillBrush: rgb }
    ]
}, 0, 0);

const res: Uint8Array = bitmap.saveAsPng();
```

***

### drawLine()

```ts
drawLine(
   x1, 
   y1, 
   x2, 
   y2, 
   pen): void;
```

Draws a line between two points, using the specified pen.

#### Parameters

##### x1

`number`

The X coordinate of the first point.

##### y1

`number`

The Y coordinate of the first point.

##### x2

`number`

The X coordinate of the second point.

##### y2

`number`

The Y coordinate of the second point.

##### pen

[`Pen`](Pen) \| [`PenProperties`](../type-aliases/PenProperties)

The [Pen](Pen) object or settings for creating a pen.

#### Returns

`void`

***

### drawLines()

```ts
drawLines(points, pen): void;
```

Draws a series of connected lines, using a specified pen.

#### Parameters

##### points

[`Point`](../type-aliases/Point)[]

The array of points to connect.

##### pen

[`Pen`](Pen) \| [`PenProperties`](../type-aliases/PenProperties)

The [Pen](Pen) object or settings for creating a pen.

#### Returns

`void`

***

### drawPath()

```ts
drawPath(path, drawPathOptions): void;
```

Draws and fills a graphics path.

#### Parameters

##### path

[`GraphicsPath`](GraphicsPath)

The [GraphicsPath](GraphicsPath) object to draw.

##### drawPathOptions

[`DrawPathOptions`](../type-aliases/DrawPathOptions)

The options for drawing and filling the [GraphicsPath](GraphicsPath).

#### Returns

`void`

#### Example

```ts
const ctx = new BmpContext(800, 600, 0.5, "Honeydew");

const path = ctx.createPath();

path.beginFigure(100, 350);
path.addLine(210, 310);
path.addArc({
    size: { width: 183, height: 173 },
    sweepDirection: SweepDirection.Clockwise,
    point: { x: 550, y: 205 }
});
path.addLine(650, 170);
path.addLine(680, 250);
path.addLine(575, 285);
path.addArc({
    size: { width: 183, height: 173 },
    sweepDirection: SweepDirection.Clockwise,
    point: { x: 240, y: 390 }
});
path.addLine(130, 430);
path.endFigure(true);
path.addEllipse({ x: 295, y: 197, width: 200, height: 190 });

ctx.drawPath(path, {
    fillColor: "MediumAquamarine",
    lineColor: "Green",
    lineWidth: 20
});

const res: Uint8Array = ctx.bitmap.saveAsPng();
```

***

### drawPolygon()

```ts
drawPolygon(points, drawPolygonOptions): void;
```

Draws and fills a polygon.

#### Parameters

##### points

  \| [`Point`](../type-aliases/Point)[]
  \| [`Quadrilateral`](../type-aliases/Quadrilateral)

The array of points or a quadrilateral specifying the polygon.

##### drawPolygonOptions

[`DrawPolygonOptions`](../type-aliases/DrawPolygonOptions)

The options for drawing and filling a polygon.

#### Returns

`void`

***

### drawRect()

#### Call Signature

```ts
drawRect(
   x, 
   y, 
   width, 
   height, 
   drawRectangleOptions): void;
```

Draws and fills a rectangle or rounded rectangle.

##### Parameters

###### x

`number`

The X coordinate of the rectangle.

###### y

`number`

The Y coordinate of the rectangle.

###### width

`number`

The width of the rectangle.

###### height

`number`

The height of the rectangle.

###### drawRectangleOptions

[`DrawRectangleOptions`](../type-aliases/DrawRectangleOptions)

The options for drawing and filling a rectangle.

##### Returns

`void`

#### Call Signature

```ts
drawRect(bounds, drawRectangleOptions): void;
```

Draws and fills a rectangle or rounded rectangle.

##### Parameters

###### bounds

[`Bounds`](../type-aliases/Bounds)

The rectangle bounds.

###### drawRectangleOptions

[`DrawRectangleOptions`](../type-aliases/DrawRectangleOptions)

The options for drawing and filling a rectangle.

##### Returns

`void`

***

### drawSvg()

```ts
drawSvg(
   svgDocument, 
   x, 
   y, 
   opacity?): void;
```

Draws a [SvgDocument](SvgDocument) at a point specifying the position of SVG viewport.
To specify the position of SVG content rather than viewport, see the drawSvgContent method.

#### Parameters

##### svgDocument

[`SvgDocument`](SvgDocument)

The [SvgDocument](SvgDocument) to draw.

##### x

`number`

The X coordinate of SVG viewport.

##### y

`number`

The Y coordinate of SVG viewport.

##### opacity?

`number`

The opacity factor to be applied to SVG content, between 0.0 (fully transparent) and 1.0 (fully opaque).
The default is 1.0.

#### Returns

`void`

#### Example

```ts
const svgDoc = SvgDocument.load(svgData);
const margin = 50;

const rect = svgDoc.measure(0, 0);
const ctx = new BmpContext(
    rect.width + margin * 2,
    rect.height + margin * 2,
    0.7,
    "Linen"
});
ctx.slowAntialiasing = true;
ctx.drawSvg(svgDoc, -rect.x + margin, -rect.y + margin);

const res: Uint8Array = ctx.bitmap.saveAsPng();
```

***

### drawSvgContent()

```ts
drawSvgContent(
   svgDocument, 
   x, 
   y, 
   opacity?): void;
```

Draws the content of a specified [SvgDocument](SvgDocument) at a point specifying the top-left corner of SVG content.
To specify the position of SVG viewport rather than content, see the drawSvg method.

#### Parameters

##### svgDocument

[`SvgDocument`](SvgDocument)

The [SvgDocument](SvgDocument) to draw.

##### x

`number`

The X coordinate of SVG content.

##### y

`number`

The Y coordinate of SVG content.

##### opacity?

`number`

The opacity factor to be applied to SVG content, between 0.0 (fully transparent) and 1.0 (fully opaque).
The default is 1.0.

#### Returns

`void`

***

### drawSvgToContentRect()

#### Call Signature

```ts
drawSvgToContentRect(
   svgDocument, 
   contentX, 
   contentY, 
   contentWidth, 
   contentHeight, 
   opacity?): void;
```

Draws the content of a specified [SvgDocument](SvgDocument), resizing the content to fit into a specified rectangle.
To draw the SVG resizing its viewport rather than just the content, see the drawSvgToRect method.

##### Parameters

###### svgDocument

[`SvgDocument`](SvgDocument)

The [SvgDocument](SvgDocument) to draw.

###### contentX

`number`

The X coordinate of the target rectangle for SVG content.

###### contentY

`number`

The Y coordinate of the target rectangle for SVG content.

###### contentWidth

`number`

The width of the target rectangle for SVG content.

###### contentHeight

`number`

The height of the target rectangle for SVG content.

###### opacity?

`number`

The opacity factor to be applied to SVG content, between 0.0 (fully transparent) and 1.0 (fully opaque).
The default is 1.0.

##### Returns

`void`

#### Call Signature

```ts
drawSvgToContentRect(
   svgDocument, 
   contentBounds, 
   opacity?): void;
```

Draws the content of a specified [SvgDocument](SvgDocument), resizing the content to fit into a specified rectangle.
To draw the SVG resizing its viewport rather than just the content, see the drawSvgToRect method.

##### Parameters

###### svgDocument

[`SvgDocument`](SvgDocument)

The [SvgDocument](SvgDocument) to draw.

###### contentBounds

[`Bounds`](../type-aliases/Bounds)

The target rectangle for SVG content.

###### opacity?

`number`

The opacity factor to be applied to SVG content, between 0.0 (fully transparent) and 1.0 (fully opaque).
The default is 1.0.

##### Returns

`void`

***

### drawSvgToRect()

#### Call Signature

```ts
drawSvgToRect(
   svgDocument, 
   x, 
   y, 
   width, 
   height, 
   opacity?): void;
```

Draws a [SvgDocument](SvgDocument), resizing its viewport to fit into the specified rectangle.
To draw just the content of the SVG ignoring viewport position, see the drawSvgToContentRect method.

##### Parameters

###### svgDocument

[`SvgDocument`](SvgDocument)

The [SvgDocument](SvgDocument) to draw.

###### x

`number`

The X coordinate of the target rectangle for SVG viewport.

###### y

`number`

The Y coordinate of the target rectangle for SVG viewport.

###### width

`number`

The width of the target rectangle for SVG viewport.

###### height

`number`

The height of the target rectangle for SVG viewport.

###### opacity?

`number`

The opacity factor to be applied to SVG content, between 0.0 (fully transparent) and 1.0 (fully opaque).
The default is 1.0.

##### Returns

`void`

#### Call Signature

```ts
drawSvgToRect(
   svgDocument, 
   bounds, 
   opacity?): void;
```

Draws a [SvgDocument](SvgDocument), resizing its viewport to fit into the specified rectangle.
To draw just the content of the SVG ignoring viewport position, see the drawSvgToContentRect method.

##### Parameters

###### svgDocument

[`SvgDocument`](SvgDocument)

The [SvgDocument](SvgDocument) to draw.

###### bounds

[`Bounds`](../type-aliases/Bounds)

The target rectangle for SVG viewport.

###### opacity?

`number`

The opacity factor to be applied to the SVG content, between 0.0 (fully transparent) and 1.0 (fully opaque).
The default is 1.0.

##### Returns

`void`

***

### drawText()

#### Call Signature

```ts
drawText(
   text, 
   format, 
   x, 
   y, 
   maxWidth?): void;
```

Draws text using a specified format at the specified position.

##### Parameters

###### text

`string`

The text to draw.

###### format

[`Format`](Format)

The text format to use.

###### x

`number`

The X coordinate at which to draw the text.

###### y

`number`

The Y coordinate at which to draw the text.

###### maxWidth?

`number`

If provided, specifies the maximum width of text.

##### Returns

`void`

#### Call Signature

```ts
drawText(
   text, 
   font, 
   fontSize, 
   foreColor, 
   x, 
   y, 
   maxWidth?): void;
```

Draws text using specified format attributes at a specified location.

##### Parameters

###### text

`string`

The text to draw.

###### font

[`Font`](Font)

The font to use.

###### fontSize

`number`

The font size.

###### foreColor

[`Color`](../type-aliases/Color)

The text color.

###### x

`number`

The X coordinate at which to draw the text.

###### y

`number`

The Y coordinate at which to draw the text.

###### maxWidth?

`number`

If provided, specifies the maximum width of text.

##### Returns

`void`

#### Call Signature

```ts
drawText(
   textRun, 
   x, 
   y, 
   maxWidth?): void;
```

Draws a text run at the specified position.

##### Parameters

###### textRun

[`RunProperties`](../type-aliases/RunProperties)

The formatted text section to draw.

###### x

`number`

The X coordinate at which to draw the text.

###### y

`number`

The Y coordinate at which to draw the text.

###### maxWidth?

`number`

If provided, specifies the maximum width of text.

##### Returns

`void`

##### Example

```ts
const pericFont = Font.load(await Util.loadFontAsArray("peric.ttf"));
const emojiFont = Font.load(await Util.loadFontAsArray("seguiemj.ttf"));

const fontColl = new FontCollection();
fontColl.loadFont(await Util.loadFontAsArray("arial.ttf"));

const g = new BmpContext(540, 320, 2, "FloralWhite");
g.fontCollection = fontColl;

g.drawText("Peric Font", pericFont, 40, "Black", 4, 90);
g.drawText({ text: "Arial Font", fontFamily: "Arial", fontSize: 20 }, 300, 110);
g.drawText({
    text: "Emoji: " + String.fromCodePoint(0x1F433, 0x1F349, 0x1F367),
    font: emojiFont,
    fontSize: 40,
    paletteIndex: 0
}, 4, 140);

const res: Uint8Array = g.bitmap.saveAsPng();
```

***

### free()

```ts
free(): void;
```

Detaches the object from the [ObjectManager](ObjectManager) and deallocates its memory, if possible.

#### Returns

`void`

#### Inherited from

[`ObjectBase`](ObjectBase).[`free`](ObjectBase#free)

***

### measureText()

#### Call Signature

```ts
measureText(
   text, 
   format, 
   maxWidth?): Size;
```

Measures text using a specified [Format](Format).

##### Parameters

###### text

`string`

The string to measure.

###### format

[`Format`](Format)

The text format to use.

###### maxWidth?

`number`

If provided, specifies the maximum width of text.

##### Returns

[`Size`](../type-aliases/Size)

The actual size needed to draw the text.

#### Call Signature

```ts
measureText(
   text, 
   font, 
   fontSize, 
   maxWidth?): Size;
```

Measures text using a specified font, font size and layout width.

##### Parameters

###### text

`string`

The string to measure.

###### font

[`Font`](Font)

The font to use.

###### fontSize

`number`

The font size to use.

###### maxWidth?

`number`

If provided, specifies the maximum width of text.

##### Returns

[`Size`](../type-aliases/Size)

The actual size needed to draw the text.

#### Call Signature

```ts
measureText(textRun, maxWidth?): Size;
```

Measures the size of the given text run.

##### Parameters

###### textRun

[`RunProperties`](../type-aliases/RunProperties)

The formatted text section to measure.

###### maxWidth?

`number`

If provided, specifies the maximum width of text.

##### Returns

[`Size`](../type-aliases/Size)

The actual size needed to draw the text.

***

### popClip()

```ts
popClip(): void;
```

Removes the last clip. After this method is called, the last clip is no longer applied to subsequent drawing operations.

#### Returns

`void`

***

### popLayer()

```ts
popLayer(): void;
```

Stops redirecting drawing operations to the transparency layer that was created by the last pushLayer call.

#### Returns

`void`

***

### popTransform()

```ts
popTransform(): void;
```

Restores the previously pushed transformation from the stack.

#### Returns

`void`

***

### pushClip()

#### Call Signature

```ts
pushClip(
   x, 
   y, 
   width, 
   height): void;
```

Specifies a rectangle to which all subsequent drawing operations are clipped.

##### Parameters

###### x

`number`

The X coordinate of the clipping rectangle.

###### y

`number`

The Y coordinate of the clipping rectangle.

###### width

`number`

The width of the clipping rectangle.

###### height

`number`

The height of the clipping rectangle.

##### Returns

`void`

#### Call Signature

```ts
pushClip(bounds): void;
```

Specifies a rectangle to which all subsequent drawing operations are clipped.

##### Parameters

###### bounds

[`Bounds`](../type-aliases/Bounds)

The clipping rectangle.

##### Returns

`void`

#### Call Signature

```ts
pushClip(path): void;
```

Specifies a path to which all subsequent drawing operations are clipped.

##### Parameters

###### path

[`GraphicsPath`](GraphicsPath)

The [GraphicsPath](GraphicsPath) object defining clipping area.

##### Returns

`void`

***

### pushLayer()

```ts
pushLayer(opacity, contentBounds?): void;
```

Adds a transparency layer to the target surface. That layer receives all subsequent drawing operations until popLayer is called.

#### Parameters

##### opacity

`number`

An opacity value that is applied uniformly to all drawings in the layer when compositing to the backplate.
The value is between 0.0 and 1.0.

##### contentBounds?

[`Bounds`](../type-aliases/Bounds)

The content bounds of the transparency layer. Content won't render outside these bounds.
If not set, the content bounds are effectively taken to be the bounds of the target surface.

#### Returns

`void`

***

### pushTransform()

```ts
pushTransform(): void;
```

Saves the current transformation to the stack.

#### Returns

`void`

***

### rebind()

```ts
rebind(omTo): void;
```

Rebinds the object from the current [ObjectManager](ObjectManager) to the specified one.

#### Parameters

##### omTo

[`ObjectManager`](ObjectManager)

The new [ObjectManager](ObjectManager) for the object.

#### Returns

`void`

#### Inherited from

[`ObjectBase`](ObjectBase).[`rebind`](ObjectBase#rebind)

***

### resetTransform()

```ts
resetTransform(): void;
```

Resets the transformation to the identity matrix.

#### Returns

`void`

***

### rotate()

```ts
rotate(
   angle, 
   angleUnits?, 
   cx?, 
   cy?): void;
```

Applies the rotation transformation.

#### Parameters

##### angle

`number`

The rotation angle.

##### angleUnits?

[`AngleUnits`](../enumerations/AngleUnits)

The angle units. The default is Radians.

##### cx?

`number`

The optional center point X offset.

##### cy?

`number`

The optional center point Y offset.

#### Returns

`void`

***

### scale()

```ts
scale(
   scaleFactor, 
   cx?, 
   cy?): void;
```

Applies the scaling transformation.

#### Parameters

##### scaleFactor

`number`

The value to scale by on the X and Y axes.

##### cx?

`number`

The optional center point X offset.

##### cy?

`number`

The optional center point Y offset.

#### Returns

`void`

***

### scaleXY()

```ts
scaleXY(
   scaleX, 
   scaleY, 
   cx?, 
   cy?): void;
```

Applies the scaling transformation.

#### Parameters

##### scaleX

`number`

The value to scale by on the X axis.

##### scaleY

`number`

The value to scale by on the Y axis.

##### cx?

`number`

The optional center point X offset.

##### cy?

`number`

The optional center point Y offset.

#### Returns

`void`

***

### skew()

```ts
skew(
   angleX, 
   angleY, 
   angleUnits?, 
   cx?, 
   cy?): void;
```

Applies the skew transformation.

#### Parameters

##### angleX

`number`

The X angle.

##### angleY

`number`

The Y angle.

##### angleUnits?

[`AngleUnits`](../enumerations/AngleUnits)

The angle units. The default is Radians.

##### cx?

`number`

The optional center point X offset.

##### cy?

`number`

The optional center point Y offset.

#### Returns

`void`

***

### skewX()

```ts
skewX(angle, angleUnits?): void;
```

Applies the skew transformation along the X axis.

#### Parameters

##### angle

`number`

The X angle.

##### angleUnits?

[`AngleUnits`](../enumerations/AngleUnits)

The angle units. The default is Radians.

#### Returns

`void`

***

### skewY()

```ts
skewY(angle, angleUnits?): void;
```

Applies the skew transformation along the Y axis.

#### Parameters

##### angle

`number`

The Y angle.

##### angleUnits?

[`AngleUnits`](../enumerations/AngleUnits)

The angle units. The default is Radians.

#### Returns

`void`

***

### translate()

```ts
translate(offsetX, offsetY): void;
```

Applies the translation transformation.

#### Parameters

##### offsetX

`number`

The horizontal offset.

##### offsetY

`number`

The vertical offset.

#### Returns

`void`