Class: CanvasRenderer

CanvasRenderer()

A class to render geometric figures from geometry.js on a canvas, and to handle the transformation and background image of the canvas.

Constructor

new CanvasRenderer()

Source:

Members

backgroundImage

Properties:
Name Type Description
backgroundImage Object | null

The background image of the scene, null if not set.

Source:

canvas

Properties:
Name Type Description
canvas Object

The canvas of the scene.

Source:

ctx

Properties:
Name Type Description
ctx Object

The context of the canvas.

Source:

ctxVirtual

Properties:
Name Type Description
ctxVirtual CanvasRenderingContext2D

The virtual context for color adjustment.

Source:

isSVG

Properties:
Name Type Description
isSVG boolean

Whether the canvas is being exported to SVG.

Source:

lengthScale

Properties:
Name Type Description
lengthScale number

The scale factor of the length units of the scene.

Source:

origin

Properties:
Name Type Description
origin Object

The origin of the scene in the viewport.

Source:

scale

Properties:
Name Type Description
scale number

The scale factor (the viewport physical pixel per internal length unit) of the scene.

Source:

Methods

applyColorTransformation()

Apply color transformation to simulate 'lighter' composition with less color saturation.

Source:

drawCircle(c, coloropt)

Draw a circle.

Parameters:
Name Type Attributes Default Description
c Circle
color String <optional>
'black'
Source:

drawLine(l, coloropt)

Draw a line.

Parameters:
Name Type Attributes Default Description
l Line
color Array.<number> <optional>
[0, 0, 0, 1]
Source:

drawPoint(p, coloropt, sizeopt)

Draw a point.

Parameters:
Name Type Attributes Default Description
p Point
color Array.<number> <optional>
[0, 0, 0, 1]
size number <optional>
5
Source:

drawRay(r, coloropt, showArrowopt, lineDashopt)

Draw a ray.

Parameters:
Name Type Attributes Default Description
r Line
color Array.<number> <optional>
[0, 0, 0, 1]
showArrow boolean <optional>
true
lineDash Array.<number> <optional>
[]
Source:

drawSegment(s, coloropt, showArrowopt, arrowPositionopt)

Draw a segment.

Parameters:
Name Type Attributes Default Description
s Line
color Array.<number> <optional>
[0, 0, 0, 1]
showArrow boolean <optional>
true
arrowPosition number <optional>
0.67

Position of arrow along line (0 to 1, where 0 is at p1 and 1 is at p2)

Source:

rgbaToCssColor(rgba) → {string}

Converts an RGBA array [R, G, B, A] with values between 0 and 1 to a CSS color string.

Parameters:
Name Type Description
rgba Array.<number>

The RGBA array.

Source:
Returns:

The CSS color string.

Type
string