Drag and Drop on touch devices not working (THREE.DragControls)

Questions
, ,
1

Hi there,

i searched but cant find a thread dealing with this topic. Is there a way to realize drag and drop functionality on touch devices. I made an simple codepen where you can see how i realized it for webbrowsers. But if you try this on a touch device it stops working.

Anyone any Idea why or how to fix this?

Thanks in advance Simon

2

THREE.DragControls only supports mouse control so far. It has mousemove, mousedown and mouseup event listeners but no touch specific functionality.

3

Ah okay so i cant use THREE.DragControls if i want a D&D functionality on touch devices.
Is there another way to realize D&D with three so that it will work on touch? Thanks Simon

4

I’m not sure if there is a out-of-the-box solution (something like a three.js plugin), so i guess you have to implement this feature by yourself. You probably need consider events like touchstart, touchend and touchmove to get things working.

5

Yes just started to work on a touch version of the THREE.DragControls.js
But thank you for pointing me to this .) ciao Simon

6

Maybe anyone could need this too here is a modified version of DragControls.js that works also on touch devices.
http://devbureau.de/projekte/_scripts/DragControls.js
ciao Simon

1 Like
7

Cool :+1: ! Is it possible that you provide a PR with your changes? It would be great if the default THREE.DragControls has this functionality, too. Besides, it is more likely that other developers look at the code and further improve it.

8

Sorry i dident use GIT (yes shame on me) - so i dont know how to - but you could do that if you want.
ciao Simon

9

It’s great work, seems this needs to be updated to pointerEvents for future-compatibility. Can keep current code as fall-back, possibly, but not needed in my opinion.

I have no idea of the status, but I’m working with this Plug-in now and I am more than willing to make the adjustments. And I do use github :slight_smile: