My website features stunning 3D graphics created using three.js.
There are numerous square boxes on the site, and users have the ability to add even more boxes.
By double-clicking anywhere on the scene, a box will be dynamically added at that specific point (the mouse cursor's location).
Check out my code snippet below:
// Your code goes here
Take note of the function onClickScene(event).
In this function, I set up:
Your code explanation goes here
Upon double-clicking the scene, the x and y values of the mouse point are logged in the console. These values depend on the position of the scene.
However, despite logging the correct values, the object is still being created at the same initial position when double-clicked.
I am striving to adjust this behavior so that the object appears at the exact location where the scene was double-clicked.
Any suggestions or solutions would be greatly appreciated!
Thank you.