Skip to content

Latest commit

 

History

History

component

Folders and files

NameName
Last commit message
Last commit date

parent directory

..
 
 
 
 
 
 
 
 

Component

Abstract class for visual component of a scene.

Examples

import { Component } from "pencil.js";

class FunnyShape extends Component {
    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
dashed Boolean or Array false Should the line be dashed, you can also specify the dash pattern (ex: [4, 4] or Component.dashes.dots)
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