Skip to content
导航

边界模型

基于内部坐标由内到外形成的边界。

盒子模型

边界类型

content

内容边界: 填充内容的边界,不包含 padding。

box

基准边界: 包含 padding,以此为基准向内、向外延伸边界。

stroke

笔触边界: 基准边界 + stroke 等,可响应交互事件的边界。

margin

外部边界: 笔触边界 + margin。

render

渲染边界: 笔触边界 + 阴影等。

获取边界属性

worldBoxBounds: IBoundsData

相对世界坐标的基础盒边界。

worldStrokeBounds: IBoundsData

相对世界坐标的笔触边界。

worldRenderBounds: IBoundsData

相对世界坐标的渲染边界。

ts
const rect = new Rect({ width: 100, width: 100 })

console.log(rect.worldRenderBounds)

获取边界方法

getBounds

getBounds(type: ILayoutBoundsType, locationType?: ILayoutLocationType): IBoundsData

用于获取不同 坐标体系 下的 边界模型, locationType 默认为 world。

ts
type ILayoutLocationType = 'world' | 'local' | 'inner'
type ILayoutBoundsType = 'content' | 'box' | 'stroke' | 'margin' | 'render'

rect.getBounds('box', 'local')
rect.getBounds('box', 'inner')

Released under the MIT License.