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.