new CanvasHelper(canvas)
A wrapper helper for drawing to HTML canvases.
Parameters:
Name | Type | Description |
---|---|---|
canvas |
HTMLCanvasElement | CanvasRenderingContext2D | The canvas or canvas context to draw to |
Methods
-
clear()
-
Clears the canvas.
Returns:
The current instance- Type
- CanvasHelper
-
drawCircle(rect [, drawingParameters])
-
Draws a circle in the provided rectangle on the canvas.
Parameters:
Name Type Argument Description rect
CoreControls.Math.Rect The rect where the circle will be drawn drawingParameters
object <optional>
Additional drawing parameters. Values are acceptable HTML canvas values Properties
Name Type Argument Description fillColor
Annotations.Color <optional>
Fill color borderColor
Annotations.Color <optional>
Border or stroke color borderStyle
string <optional>
Either 'solid' or 'dash'. Default: solid borderWidth
number <optional>
The border width dashes
Array.<number> <optional>
Array of dash size and spacing ex. [4, 3]. Default: [3] opacity
number <optional>
Opacity value. Default: 1 clipPath
boolean <optional>
Whether to clip the path. Default: false transform
CoreControls.Math.Matrix <optional>
Drawing transformation isStateful
boolean <optional>
Whether to undo canvas context changes after rendering. Default: true Returns:
The current instance- Type
- CanvasHelper
-
drawCircleXY(cx, cy, radius [, drawingParameters])
-
Draws a circle in the provided rectangle on the canvas.
Parameters:
Name Type Argument Description cx
number The x-coordinate of the circles center cy
number The rect where the circle will be drawn radius
number The radius of the circle drawingParameters
object <optional>
Additional drawing parameters. Values are acceptable HTML canvas values Properties
Name Type Argument Description fillColor
Annotations.Color <optional>
Fill color borderColor
Annotations.Color <optional>
Border or stroke color borderStyle
string <optional>
Either 'solid' or 'dash'. Default: solid borderWidth
number <optional>
The border width dashes
Array.<number> <optional>
Array of dash size and spacing ex. [4, 3]. Default: [3] opacity
number <optional>
Opacity value. Default: 1 clipPath
boolean <optional>
Whether to clip the path. Default: false transform
CoreControls.Math.Matrix <optional>
Drawing transformation isStateful
boolean <optional>
Whether to undo canvas context changes after rendering. Default: true Returns:
The current instance- Type
- CanvasHelper
-
drawClouds(annot, points [, drawingParameters])
-
Draws a cloud shape provided by the points on the canvas.
Parameters:
Name Type Argument Description annot
Annotations.Annotation The annotation being drawn points
Array.<CoreControls.Math.Point> An array of points that represents a shape drawingParameters
object <optional>
Additional drawing parameters. Values are acceptable HTML canvas values Properties
Name Type Argument Description fillColor
Annotations.Color <optional>
Fill color borderColor
Annotations.Color <optional>
Border or stroke color borderStyle
string <optional>
Either 'solid' or 'dash'. Default: solid borderWidth
number <optional>
The border width dashes
Array.<number> <optional>
Array of dash size and spacing ex. [4, 3]. Default: [3] opacity
number <optional>
Opacity value. Default: 1 closePath
boolean <optional>
Whether automatically close the path between the first and last points. Default: true clipPath
boolean <optional>
Whether to clip the path. Default: false transform
CoreControls.Math.Matrix <optional>
Drawing transformation isStateful
boolean <optional>
Whether to undo canvas context changes after rendering. Default: true Returns:
The current instance- Type
- CanvasHelper
-
drawLine(start, end [, drawingParameters])
-
Draws a line using two points on the canvas.
Parameters:
Name Type Argument Description start
CoreControls.Math.Point The start point end
CoreControls.Math.Point The end point drawingParameters
object <optional>
Additional drawing parameters. Values are acceptable HTML canvas values Properties
Name Type Argument Description color
Annotations.Color <optional>
The line color borderStyle
string <optional>
Either 'solid' or 'dash'. Default: solid borderWidth
number <optional>
The border width dashes
Array.<number> <optional>
Array of dash size and spacing ex. [4, 3]. Default: [3] transform
CoreControls.Math.Matrix <optional>
Drawing transformation isStateful
boolean <optional>
Whether to undo canvas context changes after rendering. Default: true Returns:
The current instance- Type
- CanvasHelper
-
drawLineXY(sx, sy, dx, dy [, drawingParameters])
-
Draws a line using two points on the canvas.
Parameters:
Name Type Argument Description sx
number The start x-coordinate sy
number The start y-coordinate dx
number The end x-coordinate dy
number The end y-coordinate drawingParameters
object <optional>
Additional drawing parameters. Values are acceptable HTML canvas values Properties
Name Type Argument Description color
Annotations.Color <optional>
The line color borderStyle
string <optional>
Either 'solid' or 'dash'. Default: solid borderWidth
number <optional>
The border width dashes
Array.<number> <optional>
Array of dash size and spacing ex. [4, 3]. Default: [3] transform
CoreControls.Math.Matrix <optional>
Drawing transformation isStateful
boolean <optional>
Whether to undo canvas context changes after rendering. Default: true Returns:
The current instance- Type
- CanvasHelper
-
drawPolygon(points [, drawingParameters])
-
Draws a shape provided by the points on the canvas.
Parameters:
Name Type Argument Description points
Array.<CoreControls.Math.Point> An array of points that represents a shape drawingParameters
object <optional>
Additional drawing parameters. Values are acceptable HTML canvas values Properties
Name Type Argument Description fillColor
Annotations.Color <optional>
Fill color borderColor
Annotations.Color <optional>
Border or stroke color borderStyle
string <optional>
Either 'solid' or 'dash'. Default: solid borderWidth
number <optional>
The border width dashes
Array.<number> <optional>
Array of dash size and spacing ex. [4, 3]. Default: [3] opacity
number <optional>
Opacity value. Default: 1 closePath
boolean <optional>
Whether automatically close the path between the first and last points. Default: true clipPath
boolean <optional>
Whether to clip the path. Default: false transform
CoreControls.Math.Matrix <optional>
Drawing transformation isStateful
boolean <optional>
Whether to undo canvas context changes after rendering. Default: true Returns:
The current instance- Type
- CanvasHelper
-
drawRectangle(rect [, drawingParameters])
-
Draws the rectangle to a location on the canvas.
Parameters:
Name Type Argument Description rect
CoreControls.Math.Rect The rect to be drawn drawingParameters
object <optional>
Additional drawing parameters. Values are acceptable HTML canvas values Properties
Name Type Argument Description fillColor
Annotations.Color <optional>
Fill color borderColor
Annotations.Color <optional>
Border or stroke color borderStyle
string <optional>
Either 'solid' or 'dash'. Default: solid borderWidth
number <optional>
The border width dashes
Array.<number> <optional>
Array of dash size and spacing ex. [4, 3]. Default: [3] opacity
number <optional>
Opacity value. Default: 1 clipPath
boolean <optional>
Whether to clip the path. Default: false transform
CoreControls.Math.Matrix <optional>
Drawing transformation isStateful
boolean <optional>
Whether to undo canvas context changes after rendering. Default: true Returns:
The current instance- Type
- CanvasHelper
-
drawText(text, x, y [, drawingParameters])
-
Draws the text to a location on the canvas.
Parameters:
Name Type Argument Description text
string The text to be drawn x
number The x-coordinate y
number The y-coordinate drawingParameters
object <optional>
Additional drawing parameters. Values are acceptable HTML canvas values Properties
Name Type Argument Description fillColor
Annotations.Color <optional>
Fill color borderColor
Annotations.Color <optional>
Border or stroke color borderStyle
string <optional>
Either 'solid' or 'dash'. Default: solid borderWidth
number <optional>
The border width dashes
Array.<number> <optional>
Array of dash size and spacing ex. [4, 3]. Default: [3] fontSize
number <optional>
Size of font. Default: 10 fontSizeUnits
string <optional>
Font units. Default: pt fontWeight
string <optional>
Font boldness. Default: normal fontStyle
string <optional>
Font style. Default: normal fontFamily
string <optional>
List of font-families. Default: sans-serif opacity
number <optional>
Opacity value. Default: 1 transform
CoreControls.Math.Matrix <optional>
Drawing transformation isStateful
boolean <optional>
Whether to undo canvas context changes after rendering. Default: true Returns:
The current instance- Type
- CanvasHelper
-
measureText(text [, options])
-
Measures the width of the text given the string and additional information.
Parameters:
Name Type Argument Description text
string The text to be drawn options
object <optional>
Additional drawing parameters. Values are acceptable HTML canvas values Properties
Name Type Argument Description fontSize
number <optional>
Size of font. Default: 10 fontSizeUnits
string <optional>
Font units. Default: pt fontWeight
string <optional>
Font boldness. Default: normal fontStyle
string <optional>
Font style. Default: normal fontFamily
string <optional>
List of font-families. Default: sans-serif Returns:
The measured text info- Type
- TextMetrics