Pen
像绘画一样，快速画出不同样式的路径组合。
关键属性
pathElement：Path
当前子路径元素，setStyle() 自动创建。
关键方法
setStyle ( data: IPathInputData)
设置画笔的样式，实际上是创建了一条 子路径 待用。
先为画笔设置样式，再绘制路径，支持 Path 和 UI 的所有属性样式。
paint ( )
渲染路径。
如果在 setStyle()之后异步绘制路径，需要调用此方法渲染，同步绘制可省略。
add ( ui: UI)
添加图形元素。
clear ( )
清空所有绘制的内容（移除 + 销毁）。
绘制路径
与 canvas 绘制路径的方法一致， 涉及到角度单位，统一使用度数 -180 ～ 180（0 ～
clearPath ( )
用于清空当前的路径数据（Pen 只清空最近一次 setStyle() 之后的路径数据，之前的路径不受影响），是 beginPath() 的别名，更具语义化一些。
moveTo ( )
moveTo(x, y)
起点: 将起始点移动到 (x, y) 坐标。
lineTo ( )
lineTo(x, y)
画直线: 从上一个点连接到 (x, y) 坐标。
bezierCurveTo ( )
bezierCurveTo(x1, y1, x2, y2, x, y)
画三次贝赛尔曲线: 从上一个点连接到 (x, y) 坐标。(x1, y1)、(x2, y2)为第一个和第二个控制点。
quadraticCurveTo ( )
quadraticCurveTo(x1, y1, x, y)
画二次贝赛尔曲线: 从上一个点连接到 (x, y) 坐标。(x1, y1) 为控制点。
rect ( )
rect(x, y, width, height)
画矩形。
roundRect ( )
roundRect(x, y, width, height, cornerRadius: number | number[])
画圆角矩形。
ellipse ( )
ellipse(x, y, radiusX, radiusY, rotation?, startAngle?, endAngle?, anticlockwise?: boolean)
画椭圆、椭圆弧: 圆心在（x, y）坐标，半径为 (radiusX, radiusY)，按 anticlockwise（默认为顺时针） 方向，从起始角度 startAngle 绘制到结束角度 endAngle, 若省略角度，将创建椭圆。
arc ( )
arc(x, y, radius, startAngle?, endAngle?, anticlockwise?: boolean)
画圆、圆弧: 圆心在（x, y）坐标，半径为 radius，按 anticlockwise（默认为顺时针） 方向，从起始角度 startAngle 绘制到结束角度 endAngle，若省略角度，将创建圆。
arcTo ( )
arcTo(x1, y1, x2, y2, radius)
画切线圆弧: 在控制点 1 (x1, y1) 与上一个点 、控制点 1 (x1, y1) 与控制点 2 (x2, y2)构成的两条切线之间画出半径为 radius 的圆弧。
closePath ( )
闭合路径。
新增方法
drawEllipse ( ) new
drawEllipse(x, y, radiusX, radiusY, rotation?, startAngle?, endAngle?, anticlockwise?)
先 moveTo 至椭圆起始点，再 ellipse()，使之断开与前面路径的连接， 保持 ellipse 的独立性。
drawArc ( ) new
drawArc(x, y, radius, startAngle?, endAngle?, anticlockwise?)
先 moveTo 至圆弧起始点，再 arc()，使之断开与前面路径的连接， 保持 arc 的独立性。
drawPoints ( ) new
drawPoints(points, curve?, close?)
通过坐标组 points [ x,y, x,y, x,y ...] 绘制折线。
curve 表示转换为平滑曲线，设置 0 ～ 1 控制曲率，或设置 true 代表 0.5。
close 表示是否闭合折线。
继承
Group
API
Pen
示例
画出不同颜色的形状
import { Leafer, Pen } from 'leafer-ui'
const leafer = new Leafer({ view: window })
const pen = new Pen()
画曲线
import { Leafer, Pen } from 'leafer-ui'
const leafer = new Leafer({ view: window })
const pen = new Pen()
结合图形组件
import { Leafer, Pen, Ellipse } from 'leafer-ui'
const leafer = new Leafer({ view: window })
const pen = new Pen()
结合图片
import { Leafer, Pen } from 'leafer-ui'
const leafer = new Leafer({ view: window })
const pen = new Pen()
结合文字
import { Leafer, Pen, Text } from 'leafer-ui'
const leafer = new Leafer({ view: window })
const pen = new Pen()