javascript - 如何在木瓜中管理缩放和长度 handle

Question

我想做的是

1)我想在图像上绘制一个长度并想添加 handle 来编辑它。

2)当我想缩放图像时，绘制的长度应该与缩放级别匹配。

ctx.beginPath();
            ctx.moveTo(linearr[i].x1, linearr[i].y1);
            ctx.lineTo(linearr[i].x2, linearr[i].y2);
            ctx.closePath();
            ctx.stroke();

            ctx.beginPath();
            ctx.arc(linearr[i].x1, linearr[i].y1, 2, 0, Math.PI * 2, true);
            ctx.closePath();
            ctx.fillStyle = 'green';
            ctx.fill();
            ctx.stroke();

            ctx.beginPath();
            ctx.arc(linearr[i].x2, linearr[i].y2, 2, 0, Math.PI * 2, true);
            ctx.closePath();
            ctx.fillStyle = 'green';
            ctx.fill();
            ctx.stroke();

其中线性r是一个数组

Answer 1

Papaya 已经支持 ruler tool ，如果这就是您正在寻找的内容。

否则，请参阅函数 papaya.viewer.Viewer.prototype.drawRuler()，了解如何使用屏幕变换来绘制线条(其中包括缩放变换)的示例。另一个可能对您有帮助的函数是 this.selectedSlice.findProximalRulerHandle()。