How to get x, y plane with height map coordinates from click event?

I have a height map and a click event in this way:

  const groundPlane = BABYLON.Mesh.CreateGroundFromHeightMap(
    "ground", 
    heightMap.toDataURL(), 
    width,
    height, 
    subdivisions, 
    0, // Altura más baja
    10, // Altura más alta
    scene,
    false
  );

  // ...

  groundPlane.actionManager = new BABYLON.ActionManager(scene);
  groundPlane.actionManager.registerAction(new BABYLON.ExecuteCodeAction(BABYLON.ActionManager.OnPickTrigger, function (evt) {
    console.log(evt.pointerX, evt.pointerY);
    console.log(evt);
  }));

But it looks like the pointerX and pointerY have some coordinates that are not the x, y coordinates of the plane, I’m not sure what coordinates they are (they look like x, y coordinates of the scene screen).

The question is how to get the x, y coordinates of the plane (which has a height map), if that’s possible. Basically the plane represents a terrain and I want to know where the user clicked so I can do actions depending on the place that was clicked.

(The ground is a plane, not multiple objects / meshes because doing that was not performant)

Hi hhaamm,

I think there are some features of the mesh picking capabilities that might help with what you’re trying to do. Check out the Picking Collisions documentation and see if that does the trick.

(If that’s not what you’re looking for, then I’ve likely misunderstood something and might need to see a Playground to understand better.)

1 Like