Question about 2D grids, mouse clicks, and performance

I’m working on a 2D sidescroller sort of project where you can add and remove meshes with the mouse. At the moment, I can locate a mesh to remove with the mouse via Babylon’s scene.pointerX/scene.pointerY functionality, but calculating where in a 2D array to create a mesh based on the x/y coordinates of the mouse click on the canvas, and taking into account camera offset and angle, is proving difficult for me.

I was thinking maybe of filling empty space in my grid with dummy meshes, maybe with visibility set to false? What sort of performance hit do you think I would get from this? Is there a recommended way of handling this or a better method?

Can I use something like TransformNodes for mouse clicks?

Does this make sense, or should I post one of those playground things? Thanks.

Here’s a playground example: Babylon.js Playground

Thanks.

Hi @EmbraceExtendEx and welcome to the forum.

Picking plane will do the trick https://www.babylonjs-playground.com/#541L4F#1
Magic behind grid’s :wink:

Created picking plane line:36;
line 43 checking for hit
If picked mesh not .isBox. Line 46
Create new box. Line 59

1 Like

Fantastic, thank you!

2 Likes