Я пробовал использовать ".gesturable" метод взаимодействия JS, но он не работает должным образом.Кажется, что когда я масштабирую объект, используя пинч / касание, он отстает, а также функция перетаскивания не работает.
var scale = 1;
var scaleElement = document.getElementById('scale-element');
interact('.gp1')
.gesturable({
onstart: function (event) {
},
onmove: function (event) {
scale = scale * (1 + event.ds);
scaleElement.style.webkitTransform =
scaleElement.style.transform =
'scale(' + scale + ')';
dragMoveListener(event);
},
onend: function (event) {
}
})
.draggable({
onmove: dragMoveListener
});
function dragMoveListener(event) {
var target = event.target,
// keep the dragged position in the data-x/data-y attributes
x = (parseFloat(target.getAttribute('data-x')) || 0) + event.dx,
y = (parseFloat(target.getAttribute('data-y')) || 0) + event.dy;
// translate the element
target.style.webkitTransform =
target.style.transform =
'translate(' + x + 'px, ' + y + 'px)';
// update the posiion attributes
target.setAttribute('data-x', x);
target.setAttribute('data-y', y);
}
window.dragMoveListener = dragMoveListener;
Я пытаюсь сделать масштабирование объекта на мультитач с функциональностью перетаскивания