5. Fabric 设置画布大小

1. 设置宽度

javascript 复制代码
canvas.setWidth(width)

2. 设置高度

javascript 复制代码
canvas.setHeight(height)

3. 设置大小

javascript 复制代码
canvas.setDimensions({
  width,
  height
})

4. 画布的缩放

javascript 复制代码
canvas.on('mouse:wheel', (opt) => {
    const delta = opt.e.deltaY // 滚轮,向上滚一下是 -100,向下滚一下是 100
    let zoom = canvas.getZoom() // 获取画布当前缩放值
    zoom *= 0.999 ** delta
    if (zoom > 20) zoom = 20 // 限制最大缩放级别
    if (zoom < 0.01) zoom = 0.01 // 限制最小缩放级别
    // 以鼠标所在位置为原点缩放
    canvas.zoomToPoint(
      {
        // 关键点
        x: opt.e.offsetX,
        y: opt.e.offsetY
      },
      zoom // 传入修改后的缩放级别
    )
  })
相关推荐
宝桥南山4 天前
Microsoft Fabric - 简单尝试一下Microsoft Fabric .NET SDK
microsoft·微软·.net·.netcore·powerbi·fabric
NGINX开源社区10 天前
NGINX Gateway Fabric 2.6:F5 WAF for NGINX 集成 Gateway API
nginx·gateway·fabric
漫谈数据智理14 天前
主动元数据为何是数据编织的核心——从“连接数据”走向“感知、理解与行动”的 Data Fabric
运维·fabric
不爱吃糖的程序媛14 天前
React Native 三方库鸿蒙适配实战:react-native-emoji-popup(Fabric 自定义组件)从 0 到 1
react native·harmonyos·fabric
编码者卢布17 天前
【Azure Fabric Service】Service Fabric 节点 Error:数据盘挂载失败与 CHKDSK 修复
microsoft·azure·fabric
Eloudy18 天前
全文 - 第1部分 - NVIDIA Fabric Manager User Guide
gpu·fabric·超节点
宝桥南山23 天前
GitHub Copilot - 尝试配置和使用一下Microsoft Fabric Core MCP Server
运维·microsoft·ai·微软·powerbi·fabric
NGINX开源社区25 天前
使用 F5 NGINX Gateway Fabric 实现 AI 交付标准化
nginx·gateway·fabric
光影少年1 个月前
RN的Fabric 渲染流程
运维·前端·javascript·react native·react.js·fabric
陈 洪 伟2 个月前
大模型推理引擎 vLLM(28):custom_all_reduce 单机/跨节点原理(IPC、Fabric、HSA)
fabric·vllm