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 // 传入修改后的缩放级别
    )
  })
相关推荐
悦光阴6 小时前
SQL Server 并发控制:Fabric Warehouse只支持快照隔离
大数据·运维·数据库·fabric
宝桥南山13 小时前
Microsoft Fabric - 试一下在前端应用中使用 GraphQL API去连接Lakehouse
microsoft·reactjs·azure·fabric·graphql·db
阿登林5 天前
区块链技术在生产数据管理中的应用:Hyperledger Fabric与蚂蚁链智能合约设计
区块链·智能合约·fabric
前端慢慢其修远11 天前
fabric.js 中originX originY center设置问题
前端·fabric
诗书画唱24 天前
Fabric.js 完全指南:从入门到实战的Canvas绘图引擎详解
运维·javascript·fabric
HAORChain1 个月前
Fabric 2.x 外部链码部署(External Chaincode Service)实战攻略
linux·docker·区块链·fabric
夏沫mds2 个月前
【基于hyperledger fabric的教育证书管理系统】
运维·go·vue·区块链·gin·fabric
HAORChain2 个月前
Hyperledger Fabric官方中文教程-改进笔记(十七)-编写第一个链码
笔记·区块链·fabric
HAORChain2 个月前
Hyperledger Fabric官方中文教程-改进笔记(十四)-向通道中添加组织
笔记·区块链·fabric
Leinwin3 个月前
微软Fabric重塑数据管理:Forrester报告揭示高ROI
运维·microsoft·fabric