I'm trying to get raycasting to work in the pixi3D library. However the documentation is not very helpful.
What I am trying to do is make a 3d object follow the mouse coordinates on a 3d plane in space.
The black box should follow the mouse but I'm not getting it to work.
This is what I've come up with:
First I've created the plane:
let normalTest = new Float32Array(3);
normalTest[0] = 0;
normalTest[1] = 0;
normalTest[2] = 1;
planeTest = new Plane(normalTest, 100);
Then in my loop I try to get a ray to intersect the plane:
let ray = Camera.main.screenToRay(l.mouseX(), l.mouseY(), {height: 1920, width: 1080 });
if(ray != undefined){
let rayRes = planeTest.rayCast(ray);
let rayPoint = ray.getPoint(planeTest.rayCast(ray));
myBlackBox.x = rayPoint[0];
myBlackBox.y = (-l.mouseY()/100);
}
Is anyone else here familiar with the pixi3D API who can show me the way?
CodePudding user response:
This should work:
let plane = new PIXI3D.Plane(new Float32Array([0, 1, 0]), 0.8)
document.addEventListener("mousemove", e => {
let ray = PIXI3D.Camera.main.screenToRay(e.x, e.y)
let distance = plane.rayCast(ray)
let point = ray.getPoint(distance)
// model is my 3d object
model.position.array = point
})