Class RoughJsRenderer

Hierarchy

Renderer
- RoughJsRenderer

Index

Constructors

Properties

Methods

background circle clear embedDefs line pentagon rect remove size text title triangle boxToElement ngonPath roundedRectData toClassArray toClassName trianglePath

Constructors

constructor

new RoughJsRenderer(container: string | HTMLElement): RoughJsRenderer
Parameters
- container: string | HTMLElement
Returns RoughJsRenderer
Overrides Renderer.constructor
- Defined in renderer/roughjs/roughjs-renderer.ts:30

Properties

`Protected` container

container: string | HTMLElement

`Private` containerNode

containerNode: HTMLElement

`Private` rc

rc: RoughSVG

`Private` svgNode

svgNode: SVGSVGElement

Methods

background

background(color: string): void
Parameters
- color: string
Returns void
Overrides Renderer.background
- Defined in renderer/roughjs/roughjs-renderer.ts:275

circle

circle(x: number, y: number, diameter: number, strokeWidth: number, strokeColor: string, fill?: string, classes?: string | string[]): GraphcisElement
Parameters
- x: number
- y: number
- diameter: number
- strokeWidth: number
- strokeColor: string
- Optional fill: string
- Optional classes: string | string[]
Returns GraphcisElement
Overrides Renderer.circle
- Defined in renderer/roughjs/roughjs-renderer.ts:110

clear

clear(): void
Returns void
Overrides Renderer.clear
- Defined in renderer/roughjs/roughjs-renderer.ts:140

`Private` embedDefs

embedDefs(): void
This will embed all defs defined in the defs.html file. Specifically this is used to embed the base64 encoded font into the SVG so that the font always looks correct.

Returns void
- Defined in renderer/roughjs/roughjs-renderer.ts:68

line

line(x1: number, y1: number, x2: number, y2: number, strokeWidth: number, color: string, classes?: string | string[]): void
Parameters
- x1: number
- y1: number
- x2: number
- y2: number
- strokeWidth: number
- color: string
- Optional classes: string | string[]
Returns void
Overrides Renderer.line
- Defined in renderer/roughjs/roughjs-renderer.ts:153

pentagon

pentagon(x: number, y: number, size: number, strokeWidth: number, strokeColor: string, fill?: string, classes?: string | string[], spikes?: number): GraphcisElement
Parameters
- x: number
- y: number
- size: number
- strokeWidth: number
- strokeColor: string
- Optional fill: string
- Optional classes: string | string[]
- spikes: number = 5
Returns GraphcisElement
Overrides Renderer.pentagon
- Defined in renderer/roughjs/roughjs-renderer.ts:248

rect

rect(x: number, y: number, width: number, height: number, strokeWidth: number, strokeColor: string, classes?: string | string[], fill?: string, radius?: number): GraphcisElement
Parameters
- x: number
- y: number
- width: number
- height: number
- strokeWidth: number
- strokeColor: string
- Optional classes: string | string[]
- Optional fill: string
- Optional radius: number
Returns GraphcisElement
Overrides Renderer.rect
- Defined in renderer/roughjs/roughjs-renderer.ts:179

remove

remove(): void
Returns void
Overrides Renderer.remove
- Defined in renderer/roughjs/roughjs-renderer.ts:149

size

size(width: number, height: number): void
Parameters
- width: number
- height: number
Returns void
Overrides Renderer.size
- Defined in renderer/roughjs/roughjs-renderer.ts:271

text

text(text: string, x: number, y: number, fontSize: number, color: string, fontFamily: string, alignment: Alignment, classes?: string | string[], plain?: boolean): GraphcisElement
Parameters
- text: string
- x: number
- y: number
- fontSize: number
- color: string
- fontFamily: string
- alignment: Alignment
- Optional classes: string | string[]
- Optional plain: boolean
Returns GraphcisElement
Overrides Renderer.text
- Defined in renderer/roughjs/roughjs-renderer.ts:285

title

title(title: string): void
Parameters
- title: string
Returns void
Overrides Renderer.title
- Defined in renderer/roughjs/roughjs-renderer.ts:104

triangle

triangle(x: number, y: number, size: number, strokeWidth: number, strokeColor: string, classes?: string | string[], fill?: string): GraphcisElement
Parameters
- x: number
- y: number
- size: number
- strokeWidth: number
- strokeColor: string
- Optional classes: string | string[]
- Optional fill: string
Returns GraphcisElement
Overrides Renderer.triangle
- Defined in renderer/roughjs/roughjs-renderer.ts:226

`Static` `Private` boxToElement

boxToElement(box: DOMRect, remove: (() => void)): GraphcisElement
Parameters
- box: DOMRect
- remove: (() => void)
  - - (): void
    - Returns void
Returns GraphcisElement
- Defined in renderer/roughjs/roughjs-renderer.ts:339

`Static` `Protected` ngonPath

ngonPath(x: number, y: number, size: number, edges: number): string
Parameters
- x: number
- y: number
- size: number
- edges: number
Returns string
Inherited from Renderer.ngonPath
- Defined in renderer/renderer.ts:98

`Static` `Private` roundedRectData

roundedRectData(w: number, h: number, tlr: number, trr: number, brr: number, blr: number): string
Parameters
- w: number
- h: number
- tlr: number
- trr: number
- brr: number
- blr: number
Returns string
- Defined in renderer/roughjs/roughjs-renderer.ts:349

`Static` `Private` toClassArray

toClassArray(classes?: string | string[]): string[]
Parameters
- Optional classes: string | string[]
Returns string[]
- Defined in renderer/roughjs/roughjs-renderer.ts:366

`Static` `Protected` toClassName

toClassName(classes?: string | string[]): string
Parameters
- Optional classes: string | string[]
Returns string
Inherited from Renderer.toClassName
- Defined in renderer/renderer.ts:122

`Static` `Protected` trianglePath

trianglePath(x: number, y: number, size: number): string
Parameters
- x: number
- y: number
- size: number
Returns string
Inherited from Renderer.trianglePath
- Defined in renderer/renderer.ts:94

Class RoughJsRenderer

Hierarchy

Index

Constructors

Properties

Methods

Constructors

constructor

Parameters

container: string | HTMLElement

Returns RoughJsRenderer

Properties

Protected container

Private containerNode

Private rc

Private svgNode

Methods

background

Parameters

color: string

Returns void

circle

Parameters

x: number

y: number

diameter: number

strokeWidth: number

strokeColor: string

Optional fill: string

Optional classes: string | string[]

Returns GraphcisElement

clear

Returns void

Private embedDefs

Returns void

line

Parameters

x1: number

y1: number

x2: number

y2: number

strokeWidth: number

color: string

Optional classes: string | string[]

Returns void

pentagon

Parameters

x: number

y: number

size: number

strokeWidth: number

strokeColor: string

Optional fill: string

Optional classes: string | string[]

spikes: number = 5

Returns GraphcisElement

rect

Parameters

x: number

y: number

width: number

height: number

strokeWidth: number

strokeColor: string

Optional classes: string | string[]

Optional fill: string

Optional radius: number

Returns GraphcisElement

remove

Returns void

size

Parameters

width: number

height: number

Returns void

text

Parameters

text: string

x: number

y: number

`Protected` container

`Private` containerNode

`Private` rc

`Private` svgNode

`Optional` fill: string

`Optional` classes: string | string[]

`Private` embedDefs

`Optional` classes: string | string[]

`Optional` fill: string

`Optional` classes: string | string[]

`Optional` classes: string | string[]

`Optional` fill: string

`Optional` radius: number

`Optional` classes: string | string[]

`Optional` plain: boolean

`Optional` classes: string | string[]

`Optional` fill: string

`Static` `Private` boxToElement

`Static` `Protected` ngonPath

`Static` `Private` roundedRectData

`Static` `Private` toClassArray

`Optional` classes: string | string[]

`Static` `Protected` toClassName

`Optional` classes: string | string[]

`Static` `Protected` trianglePath