Skip to content

应用配置

基础     视口类型     画布     点按     多点     触屏     滚轮     平移视图     缩放视图

缩放视图相关配置,应用运行中修改 app.config.zoom 立即生效。

注意事项

App 结构 下只能设置在 App 的 config 上。

关键属性

zoom.disabled: boolean

是否禁用缩放视图,默认为 false。

zoom.min: number

视图最小缩放比例, 默认为 0.02。

zoom.max: number

视图最大缩放比例, 默认为 256。

示例

控制视图缩放范围

ts
import { App, Rect } from 'leafer-ui'
import '@leafer-in/viewport' // 导入视口插件

const app = new App({
    view: window,
    tree: { type: 'viewport' },
    zoom: { min: 0.02, max: 256 }
})

app.tree.add(new Rect({ x: 100, y: 100, fill: '#32cd79', draggable: true }))
ts
import { Leafer, Rect } from 'leafer-ui'
import '@leafer-in/viewport' // 导入视口插件

const leafer = new Leafer({
    view: window,
    type: 'viewport',
    zoom: { min: 0.02, max: 256 }
})

leafer.add(new Rect({ x: 100, y: 100, fill: '#32cd79', draggable: true }))

Released under the MIT License.