Constant Raycast in Studio

[Leonard_Wedderburn]

Hi, So I’m trying to create a constant raycaster to a plane/flat surface that sets a object’s position and rotation based on the device screen size and orientation and for some reason the object won’t place itself at the camera point I’m pointing to. I tried using the logic from this project, Place Vertical Surface | 8th Wall | 8th Wall but it doesn’t seem to work. Here is my code:

    //raycast from center of screen
    let spot = new THREE.Vector3()
    let tempCenter = new THREE.Vector2()
    const tempRaycast = new THREE.Raycaster()

    tempCenter.x = window.innerWidth
    tempCenter.y = window.innerHeight
    
    tempRaycast.setFromCamera(tempCenter,world.three.activeCamera)
    const tempGround = world.three.entityToObject.get(SpawnFloor)

    const hits = tempRaycast.intersectObject(tempGround,true)
   if(hits.length > 0)
    {
      spot = hits[0].point
    }
   
      setComponent(SpawnCursor, 'Position', {x: spot.x, y: spot.y, z: spot.z}, world)
      //world.setPosition(SpawnCursor, spot)
      //world.setQuaternion(SpawnCursor,world.three.activeCamera)
      console.log('cursor:' + ecs.Position.get(world, SpawnCursor).x + ecs.Position.get(world, SpawnCursor).y + ecs.Position.get(world, SpawnCursor).z)

Any help would be appreciated!

• Leonard

[GeorgeButler]

My guess is that you need to divide the window.innerWidth and window.innerHeight by 2.

[Leonard_Wedderburn]

I was able to figure it out. What the issue was is that the screen itself is setup as a graph meaning the center of the screen is 0,0 so after setting that, the raycast is able to place the object at the center of the screen and move around based on the movement of the phone. I hope that helps someone else in the future!

    const raycaster = new THREE.Raycaster()
    const mouse = new THREE.Vector2()

    //raycast from center of screen
    let spot = new THREE.Vector3()
    const tempCenter = new THREE.Vector2()
 //   const tempRaycast = new THREE.Raycaster()

    tempCenter.x = 0
    tempCenter.y = 0

    raycaster.setFromCamera(tempCenter,world.three.activeCamera)
    const tempGround = world.three.entityToObject.get(SpawnFloor)

    const hits = raycaster.intersectObject(tempGround,true)
  //  console.log('center: ' + tempCenter.x + ' ' + tempCenter.y)
   if(hits.length > 0)
    {
      spot = hits[0].point
    
    }
   
       setComponent(SpawnCursor, 'Position', {x: spot.x, y: spot.y, z: spot.z}, world)