从中心缩放konva图像，并在重绘时保持位置

// 创建舞台
var stage = new Konva.Stage({
  container: 'container', // 指定容器的ID
  width: 800, // 设置舞台宽度
  height: 600 // 设置舞台高度
});

// 创建图层
var layer = new Konva.Layer();

// 创建图像
var imageObj = new Image();
imageObj.onload = function() {
  var image = new Konva.Image({
    image: imageObj,
    x: stage.width() / 2, // 设置图像的初始位置为舞台中心
    y: stage.height() / 2,
    width: imageObj.width,
    height: imageObj.height,
    draggable: true // 允许拖动图像
  });

  // 将图像添加到图层
  layer.add(image);

  // 将图层添加到舞台
  stage.add(layer);

  // 监听滚轮事件
  stage.on('wheel', function(e) {
    e.evt.preventDefault(); // 阻止默认滚轮行为

    var oldScale = image.scaleX(); // 获取当前缩放比例
    var pointer = stage.getPointerPosition(); // 获取鼠标指针位置

    var zoomAmount = e.evt.deltaY * -0.01; // 根据滚轮滚动方向计算缩放比例变化量
    var newScale = oldScale + zoomAmount; // 计算新的缩放比例

    // 限制缩放范围
    if (newScale > 0.1 && newScale < 10) {
      image.scale({ x: newScale, y: newScale }); // 设置新的缩放比例

      // 根据缩放比例调整图像位置，使其保持在鼠标指针位置不变
      var newPos = {
        x: pointer.x - (pointer.x - image.x()) * newScale / oldScale,
        y: pointer.y - (pointer.y - image.y()) * newScale / oldScale
      };
      image.position(newPos);

      layer.batchDraw(); // 重新绘制图层
    }
  });
};

// 加载图像
imageObj.src = 'path/to/image.jpg';