Skip to content

@feds01/graphika


@feds01/graphika / core/drawing

core/drawing

Classes

default

Defined in: core/drawing.ts:30

Utility class for drawing items on the canvas.

Constructors

Constructor
ts
new default(
   canvas, 
   context, 
   options): default;

Defined in: core/drawing.ts:31

Parameters
ParameterType
canvasHTMLCanvasElement
contextCanvasRenderingContext2D
optionsDrawerOptions
Returns

default

Accessors

ctx
Get Signature
ts
get ctx(): CanvasRenderingContext2D;

Defined in: core/drawing.ts:167

Returns

CanvasRenderingContext2D

height
Get Signature
ts
get height(): number;

Defined in: core/drawing.ts:163

Returns

number

width
Get Signature
ts
get width(): number;

Defined in: core/drawing.ts:159

Returns

number

Methods

_coordinateSafetyCheck()
ts
_coordinateSafetyCheck(x, y): void;

Defined in: core/drawing.ts:37

Parameters
ParameterType
xnumber
ynumber
Returns

void

circle()
ts
circle(
   x, 
   y, 
   rad): void;

Defined in: core/drawing.ts:42

Parameters
ParameterType
xnumber
ynumber
radnumber
Returns

void

horizontalLine()
ts
horizontalLine(
   x, 
   y, 
   len): void;

Defined in: core/drawing.ts:88

Parameters
ParameterType
xnumber
ynumber
lennumber
Returns

void

pointIndicator()
ts
pointIndicator(
   x, 
   y, 
   radius, 
   fillColour, 
   borderColour?, 
   borderWidth?): void;

Defined in: core/drawing.ts:62

Draw a point indicator with a filled circle and border for visibility.

Parameters
ParameterTypeDefault valueDescription
xnumberundefinedX coordinate of the center.
ynumberundefinedY coordinate of the center.
radiusnumberundefinedRadius of the indicator circle.
fillColourstringundefinedFill colour of the indicator.
borderColourstring"white"Border colour (defaults to white for visibility).
borderWidthnumber1.5Width of the border (defaults to 1.5).
Returns

void

text()
ts
text(
   text, 
   x, 
   y, 
   size, 
   colour, 
   alignment?): void;

Defined in: core/drawing.ts:147

Parameters
ParameterTypeDefault valueDescription
textstringundefinedthe actual label
xnumberundefinedx-coordinate of where to draw the string
ynumberundefinedx-coordinate of where to draw the string
sizenumberundefinedThe font size of the text
colourstringundefinedRGBA style colour string
alignmentCanvasTextAlign"center"One of the specified alignments for text
Returns

void

nothing, just changes the drawing context

Since

v0.0.1 Function to draw text on the canvas at a given location with a particular colour and alignment.

toTextMode()
ts
toTextMode(
   size, 
   colour?, 
   alignment?): void;

Defined in: core/drawing.ts:122

Parameters
ParameterTypeDefault valueDescription
sizenumberundefinedThe font size of the text
colourstringconfig.axisColourRGBA style colour string
alignmentCanvasTextAlign"center"One of the specified alignments for text
Returns

void

nothing, just changes the drawing context

Since

v0.0.1 This simply switches the canvas context to be text mode ready, set the font size and style, set text alignment to middle, and change stroke colour to the axis' colour.

verticalLine()
ts
verticalLine(
   x, 
   y, 
   len): void;

Defined in: core/drawing.ts:99

Parameters
ParameterType
xnumber
ynumber
lennumber
Returns

void

Type Aliases

BorderStyle

ts
type BorderStyle = "solid" | "dashed";

Defined in: core/drawing.ts:19

The type of border to draw.


CanvasTextAlign

ts
type CanvasTextAlign = "center" | "end" | "left" | "right" | "start";

Defined in: core/drawing.ts:25

Released under the ISC License.