@pencil.js/component

Component

Abstract class for visual component of a scene.

Installation

npm install @pencil.js/component

Examples

import Component from "@pencil.js/component";

class FunnyShape extends Component {
    /**
     * @override Component.prototype.render
     */
    render (ctx) {
        // Do crazy stuff here
    }
}

ComponentOptions

Inherit from ContainerOptions.

Name	Type	Default	Comment
fill	Color or String	"#000"	Background Color used to fill, set to null for transparent
stroke	Color or String	null	Color used to stroke, set to null for transparent
strokeWidth	Number	2	Stroke line thickness in pixels
cursor	String	Component.cursors.default	Cursor to use when hover
join	String	Component.joins.miter	How lines join between them
origin	Position	new Position()	Relative offset
shadow	ShadowOptions	(see below)	Set of options to set a shadow

ShadowOptions

Name	Type	Default	Comment
blur	Number	0	Spread of the shadow around the component
position	Position	new Position()	Position of the shadow relative to the component
color	Color or String	null	Color of the shadow