Class RoughJsRenderer

Hierarchy

Renderer
- RoughJsRenderer

Index

Constructors

Properties

Methods

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

Constructors

constructor

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

Properties

`Protected` `Optional` container

container?: string | HTMLElement

`Private` containerNode

containerNode: HTMLElement

`Private` rc

rc: RoughSVG

`Private` svgNode

svgNode: SVGSVGElement

Methods

arc

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

background

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

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:117

clear

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

`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:75

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:170

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:291

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:196

remove

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

size

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

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:328

title

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

toSvgString

toSvgString(): string
Serialize the current state of the diagram to an SVG string. The returned string is a standalone <svg> document (including the xmlns attribute) and can be written to a file or used without ever attaching it to the DOM.

Returns string
Overrides Renderer.toSvgString
- Defined in renderer/roughjs/roughjs-renderer.ts:160

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:269

`Static` `Protected` arcBarrePath

arcBarrePath(x: number, y: number, width: number, height: number, direction: ArcDirection): string
Parameters
- x: number
- y: number
- width: number
- height: number
- direction: ArcDirection
Returns string
Inherited from Renderer.arcBarrePath
- Defined in renderer/renderer.ts:146

`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:382

`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:122

`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:392

`Static` `Private` toClassArray

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

`Static` `Protected` toClassName

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

`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:118

Class RoughJsRenderer

Hierarchy

Index

Constructors

Properties

Methods

Constructors

constructor

Parameters

Optional container: string | HTMLElement

Returns RoughJsRenderer

Properties

Protected Optional container

Private containerNode

Private rc

Private svgNode

Methods

arc

Parameters

x: number

y: number

width: number

height: number

direction: ArcDirection

strokeWidth: number

strokeColor: string

Optional classes: string | string[]

Optional fill: string

Returns GraphcisElement

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

`Optional` container: string | HTMLElement

`Protected` `Optional` container

`Private` containerNode

`Private` rc

`Private` svgNode

`Optional` classes: string | string[]

`Optional` fill: string

`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` `Protected` arcBarrePath

`Static` `Private` boxToElement

`Static` `Protected` ngonPath

`Static` `Private` roundedRectData

`Static` `Private` toClassArray

`Optional` classes: string | string[]

`Static` `Protected` toClassName