Ellipse
Ellipse
Extends
Constructors
new Ellipse()
new Ellipse():
Ellipse
Returns
Overrides
Source
Properties
anchorAngle
anchorAngle:
number
Anchor angle (in degree)
Inherited from
Source
anchorLength
anchorLength:
number
Anchor length
Inherited from
Source
anchorPosition
anchorPosition:
number
Anchor position (0~1). 0 is on tail, 1 is on head
Inherited from
Source
anchored
anchored:
boolean
Anchored
Inherited from
Source
children
children:
Obj
[]
Inherited from
Source
connectable
connectable:
boolean
Connectable flag
Inherited from
Source
constraints
constraints:
Constraint
[]
Shape’s constraints
Inherited from
Source
containable
containable:
boolean
Containable flag
Inherited from
Source
containableFilter
containableFilter:
string
Containable filter
Inherited from
Source
corners
corners:
number
[]
Corner radius [top-left, top-right, bottom-right, bottom-left] (same with CSS)
Inherited from
Source
description
description:
string
Description of the shape
Inherited from
Source
enable
enable:
boolean
Enable flag
Inherited from
Source
fillColor
fillColor:
string
Fill color
Inherited from
Source
fillStyle
fillStyle:
string
Fill style
Inherited from
Source
fontColor
fontColor:
string
Font color
Inherited from
Source
fontFamily
fontFamily:
string
Font family
Inherited from
Source
fontSize
fontSize:
number
Font size
Inherited from
Source
fontStyle
fontStyle:
string
Font style
Inherited from
Source
fontWeight
fontWeight:
number
Font weight
Inherited from
Source
height
height:
number
Shape’s height
Inherited from
Source
horzAlign
horzAlign:
HorzAlignEnum
Text horizontal alignment
Inherited from
Source
id
id:
string
Inherited from
Source
left
left:
number
Shape’s left position
Inherited from
Source
lineHeight
lineHeight:
number
Text line height
Inherited from
Source
link
link:
string
Link
Inherited from
Source
movable
movable:
MovableEnum
Indicate how this shape can be moved
Inherited from
Source
name
name:
string
Name of the shape
Inherited from
Source
opacity
opacity:
number
Opacity
Inherited from
Source
padding
padding:
number
[]
Padding spaces [top, right, bottom, left] (same with CSS)
Inherited from
Source
paragraphSpacing
paragraphSpacing:
number
Text paragraph spacing
Inherited from
Source
parent
parent:
null
|Obj
Inherited from
Source
properties
properties:
Property
[]
Shape’s properties
Inherited from
Source
proto
proto:
boolean
The flag to indicate this shape is a prototype or not
Inherited from
Source
reference
reference:
null
|Shape
A reference to shape
Inherited from
Source
rotatable
rotatable:
boolean
Rotatable flag
Inherited from
Source
rotate
rotate:
number
Shape’s rotation angle (in degree)
Inherited from
Source
roughness
roughness:
number
Roughness
Inherited from
Source
scripts
scripts:
Script
[]
Shape’s scripts
Inherited from
Source
shadow
shadow:
boolean
Shadow
Inherited from
Source
shadowColor
shadowColor:
string
Shadow color
Inherited from
Source
shadowOffset
shadowOffset:
number
[]
Shadow offset
Inherited from
Source
sizable
sizable:
SizableEnum
Indicate how this shape can be resized
Inherited from
Source
strokeColor
strokeColor:
string
Stroke color
Inherited from
Source
strokePattern
strokePattern:
number
[]
Stroke pattern
Inherited from
Source
strokeWidth
strokeWidth:
number
Stroke width
Inherited from
Source
tags
tags:
string
[]
Tags
Inherited from
Source
text
text:
any
Text could a string or document object
Rich text document content grammar (BNF):
doc = (paragraph | bulletList | orderedList)*
bulletList = listItem*
orderedList = listItem*
paragraph = (text | hardBreak)*
listItem = paragraph
text =
Rich text document content (this.text) look like: { “type”: “doc”, “content”: [ { “type”: “paragraph”, “content”: [ { “type”: “text”, “text”: “asdf asdf” }, { “type”: “text”, “marks”: [{ “type”: “strong” }], “text”: “sadflkj” }, … ] } … ] }
Inherited from
Source
textEditable
textEditable:
boolean
Text editable
Inherited from
Source
top
top:
number
Shape’s top position
Inherited from
Source
type
type:
string
Inherited from
Source
vertAlign
vertAlign:
VertAlignEnum
Text vertical alignment
Inherited from
Source
visible
visible:
boolean
Visible flag
Inherited from
Source
width
width:
number
Shape’s width
Inherited from
Source
wordWrap
wordWrap:
boolean
Word wrap
Inherited from
Source
Accessors
bottom
get
bottom():number
Returns
number
Source
innerBottom
get
innerBottom():number
Returns
number
Source
innerHeight
get
innerHeight():number
Returns
number
Source
innerLeft
get
innerLeft():number
Returns
number
Source
innerRight
get
innerRight():number
Returns
number
Source
innerTop
get
innerTop():number
Returns
number
Source
innerWidth
get
innerWidth():number
Returns
number
Source
right
get
right():number
Returns
number
Source
Methods
assignStyles()
assignStyles(
canvas
):void
Assign styles to memoization canvas.
Parameters
• canvas: MemoizationCanvas
Returns
void
Inherited from
Source
canContain()
canContain(
shape
):boolean
Determine a given shape can be contained in this shape
Parameters
• shape: Shape
Returns
boolean
Inherited from
Source
computeOpacity()
computeOpacity():
number
Returns
number
Inherited from
Source
containsPoint()
containsPoint(
canvas
,point
):boolean
Determines whether this shape contains a point in GCS
Parameters
• canvas: Canvas
• point: number
[]
Returns
boolean
Inherited from
Source
draw()
draw(
canvas
,showDOM
):void
Draw this shape
Render vs Draw
- Render: computing geometries how to draw the shape
- Draw: actual drawing the computed geometries of the shape on the canvas
Parameters
• canvas: Canvas
• showDOM: boolean
= false
Returns
void
Inherited from
Source
drawLink()
drawLink(
canvas
,showDOM
):void
Draw link
Parameters
• canvas: Canvas
• showDOM: boolean
= false
Returns
void
Inherited from
Source
finalize()
finalize(
canvas
):void
Finalize shape
Parameters
• canvas: Canvas
Returns
void
Inherited from
Source
find()
find(
pred
):null
|Obj
Find an shape in breath-first order
Parameters
• pred
Returns
null
| Obj
Inherited from
Source
findAllByQuery()
findAllByQuery(
queryString
):Shape
[]
Find all shapes matched with the query string
Parameters
• queryString: string
Returns
Shape
[]
Inherited from
Source
findByQuery()
findByQuery(
queryString
):null
|Shape
Find a shape first matched with the query string
Parameters
• queryString: any
Returns
null
| Shape
Inherited from
Source
findDepthFirst()
findDepthFirst(
pred
):null
|Obj
Find an shape in depth-first order
Parameters
• pred
Returns
null
| Obj
Inherited from
Source
findParent()
findParent(
pred
):null
|Obj
Find a shape along with the parent-chain
Parameters
• pred
Returns
null
| Obj
Inherited from
Source
fromJSON()
fromJSON(
json
):void
Import shape from JSON
Parameters
• json: any
Returns
void
Inherited from
Source
getAnchorVector()
getAnchorVector(
canvas
):number
[][]
Return the anchor vector based on this.anchorPosition. The anchor vector provides the start point and end point to derive the base angle. The shape will be rotated as the angle of (base angle + anchor angle) at start point.
(shape)
\ <— anchorLength
o --------------------> o
| (anchor vector) |
| |
vector[0] vector[1]
Parameters
• canvas: Canvas
Returns
number
[][]
Inherited from
Source
getBoundingRect()
getBoundingRect(
includeAnchorPoints
):number
[][]
Return a bounding rect.
Parameters
• includeAnchorPoints: boolean
= false
Returns
number
[][]
Inherited from
Source
getCenter()
getCenter():
number
[]
Returns the center point
Returns
number
[]
Inherited from
Source
getChildrenBoundingRect()
getChildrenBoundingRect():
number
[][]
Return a bounding box embracing children shapes
Returns
number
[][]
Inherited from
Source
getEnclosure()
getEnclosure():
number
[][]
Return a enclosure
Returns
number
[][]
Inherited from
Source
getOutline()
getOutline():
number
[][]
Return outline polygon.
Returns
number
[][]
Inherited from
Source
getPage()
getPage():
null
|Page
Return the page that contains this shape
Returns
null
| Page
Inherited from
Source
getProperty()
getProperty(
name
):any
Get a property object
Parameters
• name: string
Returns
any
Inherited from
Source
getPropertyValue()
getPropertyValue(
name
):any
Get a property value
Parameters
• name: string
Returns
any
Inherited from
Source
getRectInDCS()
getRectInDCS(
canvas
,includeAnchorPoints
):number
[][]
Return a bounding box in DOM coord.
[Note] If you want to place DOM elements over the canvas, use this method. and don’t forget to apply transform scale to the DOM element.
Parameters
• canvas: Canvas
• includeAnchorPoints: boolean
= false
Returns
number
[][]
Inherited from
Source
getScript()
getScript(
id
):undefined
|string
Get a property object
Parameters
• id: string
Returns
undefined
| string
Inherited from
Source
getSeed()
getSeed():
number
Return the seed number
Returns
number
Inherited from
Source
getShapeAt()
getShapeAt(
canvas
,point
,exceptions
,allowDisabledAndInvisible
):null
|Shape
Pick a shape at specific position (x, y)
Parameters
• canvas: Canvas
• point: number
[]
• exceptions: Shape
[]= []
• allowDisabledAndInvisible: boolean
= false
Returns
null
| Shape
Inherited from
Source
getViewport()
getViewport(
canvas
):number
[][]
Return a viewport in GCS. Viewport is a rect that includes actually drawn area which includes stroke width, arrowheads, etc. So viewport is mostly larger than bounding rect.
Parameters
• canvas: Canvas
Returns
number
[][]
Inherited from
Source
initialze()
initialze(
canvas
):void
Initialize shape
Parameters
• canvas: Canvas
Returns
void
Inherited from
Source
isDescendant()
isDescendant(
obj
):boolean
Test whether the given shape is a descendant
Parameters
• obj: Obj
Returns
boolean
Inherited from
Source
localCoordTransform()
localCoordTransform(
canvas
,point
,recursive
):number
[]
Transform local coord to parent’s coord (LCS —> parent’s LCS) if recursive=true, transform to GCS (Global coord-system).
Parameters
• canvas: Canvas
• point: number
[]
• recursive: boolean
= false
Returns
number
[]
Inherited from
Source
localCoordTransformRev()
localCoordTransformRev(
canvas
,point
,recursive
):number
[]
Transform parent’s coord to local coord (parent’s LCS —> LCS) if recursive=true, transform GCS (Global coord-system) —> LCS.
Parameters
• canvas: Canvas
• point: number
[]
• recursive: boolean
= false
Returns
number
[]
Inherited from
Source
localTransform()
localTransform(
canvas
,recursive
):void
Transform local context to parent’s context
Parameters
• canvas: Canvas
• recursive: boolean
= false
Returns
void
Inherited from
Source
match()
match(
query
):boolean
Returns true if query matches this shape
Parameters
• query: object
[]
Returns
boolean
Inherited from
Source
overlapClippingArea()
overlapClippingArea(
canvas
,rect
):boolean
Determines whether the given rect overlaps this shape’s clipping area. If the shape don’t have clipping area, return true. If the shape has clipping area, return true if the rect overlaps the clipping area. (e.g. Frame)
Parameters
• canvas: Canvas
• rect: number
[][]
Returns
boolean
Inherited from
Source
overlapRect()
overlapRect(
canvas
,rect
):boolean
Determines whether this shape overlaps a given rect
Parameters
• canvas: Canvas
• rect: number
[][]
Returns
boolean
Inherited from
Source
parseQueryString()
parseQueryString(
queryString
):any
[]
Parse the query-string and returns a query object (JSON)
Query syntax:
e.g.) parseQuery(“@Box|NameText|@Text&#compartment”) —> [{_type: “Box”},{name: “NameText”},{_type: “Text”, tag:“compartment”}]
Parameters
• queryString: string
Returns
any
[]
query object
Inherited from
Source
preprocess()
preprocess(
doc
,wordWrap
,width
,listIndent
):void
Preprocess document (handle wordWrap and hardBreak) options: wordWrap: boolean width: number listIndent: number
Preprocessed document content grammar (BNF):
doc = (paragraph | bulletList | orderedList)*
orderedList [width, height] = listItem*
bulletList [width, height] = listItem*
listItem [width, height] = paragraph
paragraph [width, height] = line*
line [width, height] = text*
text [width, height] =
Parameters
• doc: any
• wordWrap: boolean
• width: number
• listIndent: number
Returns
void
Inherited from
Source
render()
render(
canvas
):void
Render this shape
Render vs Draw
- Render: computing geometries how to draw the shape
- Draw: actual drawing the computed geometries of the shape on the canvas
Parameters
• canvas: MemoizationCanvas
Returns
void
Inherited from
Source
renderDefault()
renderDefault(
canvas
):void
Default render this shape
Parameters
• canvas: MemoizationCanvas
Returns
void
Overrides
Source
renderOutline()
renderOutline(
canvas
):void
Render this shape’s outline
Parameters
• canvas: MemoizationCanvas
Returns
void
Inherited from
Source
renderOutlineDefault()
renderOutlineDefault(
canvas
):number
[][]
Return outline polygon
Parameters
• canvas: MemoizationCanvas
Returns
number
[][]
Overrides
Source
renderShadow()
renderShadow(
canvas
):void
Render shadow
Parameters
• canvas: MemoizationCanvas
Returns
void
Overrides
Source
renderText()
renderText(
canvas
):void
Render text
Parameters
• canvas: MemoizationCanvas
Returns
void
Inherited from
Source
renderViewport()
renderViewport(
canvas
):void
Return this shape’s viewport
Parameters
• canvas: MemoizationCanvas
Returns
void
Inherited from
Source
renderViewportDefault()
renderViewportDefault(
canvas
):number
[][]
Render default viewport
Parameters
• canvas: MemoizationCanvas
Returns
number
[][]
Inherited from
Source
resolveRefs()
resolveRefs(
idMap
,nullIfNotFound
):void
Resolve references
Parameters
• idMap: Record
<string
, Shape
>
id to object map
• nullIfNotFound: boolean
= false
assign null if not found
Returns
void
Inherited from
Source
toJSON()
toJSON(
recursive
,keepRefs
):any
Export shape to JSON
Parameters
• recursive: boolean
= false
• keepRefs: boolean
= false
Returns
any
Inherited from
Source
traverse()
traverse(
fun
,parent
):void
Traverse all objects in breath-first order
Parameters
• fun
• parent: null
| Obj
= null
Returns
void
Inherited from
Source
traverseDepthFirst()
traverseDepthFirst(
fun
,parent
):void
Traverse all shapes in depth-first order
Parameters
• fun
• parent: null
| Obj
= null
Returns
void
Inherited from
Source
traverseDepthFirstSequence()
traverseDepthFirstSequence():
Obj
[]
Returns an array of shapes in order of traverse sequence.
Returns
Obj
[]
Inherited from
Box
.traverseDepthFirstSequence
Source
traverseSequence()
traverseSequence():
Obj
[]
Returns an array of shapes in order of traverse sequence.
Returns
Obj
[]
Inherited from
Source
update()
update(
canvas
):void
Update shape
Parameters
• canvas: Canvas
Returns
void
Inherited from
Source
visit()
visit(
fun
,parent
):void
Visit all shapes in breath-first order. The difference from traverse() is that each shape determine visit into children or not. (e.g. Group and Frame doens’t visit into children)
Parameters
• fun
• parent: null
| Shape
= null
Returns
void
Inherited from
Source
wordWrapTextSize()
wordWrapTextSize(
canvas
,wordWrap
,width
):number
[]
Compute size of text with word-wrap and new line chars
Parameters
• canvas: Canvas
• wordWrap: boolean
• width: number
Returns
number
[]