How to move cube from one canvas to another canvas using drag and drop?

I’m new in three.js and i’m trying to move cube from one small canvas to the big canvas which having ground using drag and drop. But i’m not able to see the dragging cube while drag from small canvas to big canvas. Please help me . Or give suggestion if we can fix any cube in corner of canvas for dragging instead of seprate canvas.

1 Like

Fake it. 99.9% of what you see in games and apps is visual tricks and faking stuff in a way that nobody notices the magic :magic_wand:

When pressing on the cube on the “small canvas” - ignore that click / drag / interaction entirely, take note only of the type of the pressed cube.

Having ignored the small canvas, and having the cube type saved, just recreate that same cube on the “big canvas” (originally it will be occluded by the small canvas overlay.) and make it follow the cursor using a raycaster or deltas from the pointermove event.

In the end, you just interact with the “big canvas” - but user will have an impression as if they “dragged” the cube from the overlay onto the scene :point_right: a tiny example.


Can we add this platter section ( object selector ) in same canvas?

Sure, you’re free to combine everything is absolutely any way you’d prefer - just means to an end.