Hello, I’m not exactly sure if it is exactly a threejs problem, if the question is breaking any rules, I’ll remove it.
In my app I’m using FabricJS and React Three Fiber together. Basically what I want to do is pass events from plane to fabric canvas.
What I’m currently doing is, when interacting with the plane I’m firing a corresponding event to the fabric canvas (with a bit discrepancy, but that’s not an issue, I’ll fix that later), so for example if I click in the middle of the plane, I’m also dispatching an event that’d click in the middle of the canvas. Now the problem is that fabric is detecting this click in both places, where I fired the event and where it actually was clicked in the page (at least that’s what I think is happening).
Here is example in the codesandbox (ignore some inconsistencies in the code, unless related to my problem): bold-framework-kcd6rd - CodeSandbox
If you try to draw on 3D plane you’ll notice that lines will appear from passed X/Y coordinate to where you’ve actually clicked on the page.
Any help resolving this issue is appreciated.
Edit: I managed to fix it and it’s in the linked codesandbox.