Панорама событий жеста Tabris.js

Question

Я хочу портировать существующую игру Cordova с веб-представлением на tabris.js. Есть холст, на котором вы можете ущипнуть, чтобы увеличить масштаб, и вы можете перемещать холст вокруг.

var page = new tabris.Page({
    topLevel: true,
    title: "Canvas Test"
});

var canvas = new tabris.Canvas({
    centerX: 0, centerY: 0, width: 500, height: 500,
    background: "#234"
})
.on("resize", function (canvas, bounds) {
    const ctx = canvas.getContext("2d", bounds.width, bounds.height);
    ctx.beginPath();
    ctx.lineWidth = 50;
    ctx.arc(250, 250, 100, 0, 2 * Math.PI, false);
    ctx.strokeStyle = 'white';
    ctx.stroke();
}).appendTo(page);

canvas.on("pan", function (widget, event) {
    if (event.state === "change") {
        widget.set("transform", {
            translationX: event.translation.x,
            translationY: event.translation.y });
    }
});

page.open();

Это моя попытка переместить холст с помощью "панорамирования". Я могу переместить холст, но когда я освобождаю палец и пытаюсь переместить холст еще раз, он возвращается к исходной позиции. Кто-нибудь знает, как я могу решить это?

Answer 1

Событие панорамирования возвращает перевод относительно текущей позиции. Таким образом, вы должны добавить перевод события в ваш перевод холста.