说明

哪些对象会缩放

缩放 Canvas 是指缩放里面的元素对象的宽高，Canvas本身宽高不会缩放

滚轮缩放比例

鼠标滚轮，向前滚一下是 -100，向后滚一下是 100。滚动一次时，缩放增加 20%，如：默认是 100%，向前滚动一次，放大 120%，再向前滚动一次，放大 140%；向后滚动同理

缩放跟随鼠标

下面代码没有设置缩放跟随鼠标

如果想要鼠标所在位置为原点进行缩放，去掉下面代码：

this.canvasFab.setZoom( this.zoom )

放开下面代码：

this.canvasFab.zoomToPoint(
  {
    // 关键点
    x: opt.e.offsetX,
    y: opt.e.offsetY
  },
  zoom // 传入修改后的缩放级别
)

代码

// 实现鼠标滚轮缩放，向上滚动放大20%，向下滚动缩小20%
this.canvasFab.on('mouse:wheel', (opt) => {
    const delta = opt.e.deltaY // 滚轮，向前滚一下是 -100，向后滚一下是 100
    const zoomOrigin = this.canvasFab.getZoom() // 获取画布当前缩放值
    let zoom = 0
    if(delta < 0){
        // 当缩小到0.01时，再放大，就设置为0.2，否则就是0.21，这不合理
        if(zoomOrigin == 0.01){
            zoom = 0.2
        }else{
            zoom = zoomOrigin + 0.2
        }
    }else{
        zoom = zoomOrigin - 0.2
    }
    if (zoom > 20) zoom = 20 // 限制最大缩放级别
    if (zoom < 0.01) zoom = 0.01 // 限制最小缩放级别

    this.zoom = Math.round(zoom*100)/100

    console.log("mouse:wheel:",delta,zoomOrigin,zoom,this.zoom)

    this.canvasFab.setZoom( this.zoom )

    // 以鼠标所在位置为原点缩放
    // this.canvasFab.zoomToPoint(
    //   {
    //     // 关键点
    //     x: opt.e.offsetX,
    //     y: opt.e.offsetY
    //   },
    //   zoom // 传入修改后的缩放级别
    // )
  })

参考：
https://blog.csdn.net/qq_42038997/article/details/142102659