javascript - 如何使用鼠标中轮按钮拖动 Openseadragon Canvas

标签 javascript dom-events mouse fabricjs openseadragon

我正在使用带有 fabricjs 覆盖的 Openseadragon 库。我有一种情况,我想拖动 Canvas ,而不是鼠标主按钮,我想通过按下鼠标中键来拖动它。谁能帮我得到想要的行为?

最佳答案

OpenSeadragon 没有用于此的标志,但您可以使用 MouseTracker 轻松构建它。这是一个示例(根据内存编码,未经测试,但它应该可以让您了解)。

var drag;

var mouseTracker = new OpenSeadragon.MouseTracker({
  element: viewer.container, 
  nonPrimaryPressHandler: function(event) {
    if (event.button === 1) { // Middle
      drag = { 
        lastPos: event.position.clone()
      };
    }
  },
  moveHandler: function(event) {
    if (drag) {
      var deltaPixels = drag.lastPos.minus(event.position);
      var deltaPoints = viewer.viewport.deltaPointsFromPixels(deltaPixels);
      viewer.viewport.panBy(deltaPoints);
      drag.lastPos = event.position.clone();
    }
  },
  nonPrimaryReleaseHandler: function(event) {
    if (event.button === 1) {
      drag = null;
    }
  }
});

编辑:我在上面的示例代码中有一个错误;固定。

关于javascript - 如何使用鼠标中轮按钮拖动 Openseadragon Canvas ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53387311/

相关文章:

javascript - 为什么使用 Jquery 迭代时总是从 json 数组结果中获取最后一行

javascript - 您可以将输入类型日期和输入类型时间的结果转换为纪元以来的秒数吗

javascript - 在应用程序中使用 HtmlCtrl 时,"scrollHeight"未在 "onscroll"事件处理程序中更新,但在 IE9 中正常工作

javascript - 单击事件后清除输入值

Java机器人验证鼠标点击

javascript - 为什么我的 reducer 没有使用 Immutable JS 更新我的存储状态?

javascript - 实现函数的闭包和自调用

javascript - 当鼠标移动到 SVG 对象上时,如何接收当前鼠标位置?

java - 获取鼠标位置的更快方法

javascript - DOMMouseScroll、event.originalEvent.detail 始终返回 0