Openseadragon 图像拖到多画布上答案

【问题标题】：Openseadragon image drag over multi canvasOpenseadragon 图像拖到多画布上
【发布时间】：2016-10-08 22:45:21
【问题描述】：

我们有一个在 openseadragon 上编码的查看器。它具有放大缩小主页和旋转功能。我们还在此查看器上添加了一些自定义透明画布，以便在该图片上绘制一些形状。它们工作正常，但我们无法拖动这些图片，也无法在这些多画布上获取该图片的 div 坐标。

我们如何在这个多画布上实现鼠标移动或单击和拖动事件。

感谢大家的帮助。

此处的示例代码：

<div class="container">
<div class="area">

    <div id="viewerImage1"
         class="openseadragon">
        <script type="text/javascript">
            var meta = null;
            var viewer = OpenSeadragon({
                id: "viewerImage1",
                prefixUrl: "/openseadragon/images/",
                tileSources: {
                    type: 'image',
                    url: '/openseadragon/images/example-images/sample.jpg'
                }
            });         
        </script>
    </div>
    <canvas id="canvasDrawArea01" class="canvas" width="300" height="250" style="cursor: move;"></canvas>
    <canvas id="canvasDrawArea02" class="canvas" width="300" height="250" style="cursor: move;"></canvas>

</div>
</div>

【问题讨论】：

标签： seadragon openseadragon

【解决方案1】：

我建议尝试画布覆盖插件：

https://github.com/altert/OpenSeadragonCanvasOverlay

……它应该有助于解决这些问题。告诉我进展如何！

【讨论】：