fixed positions for three.js objects after scanning image

Hey! I’m new to three.js and I try to create a 3D scene after scanning an image using ARKit with Expo on iOS.

The application recognizes the image and should place an 3d-object in to the images local coordinate system. This should be a fiexed position. My problem is, that the local coordinate system of the image always changes, so the 3d-object doesn’t get a fixed position.

Here is some code:

createScene = (name) => {



    //local coordinates based on office sign
    let x_local = this[name].position.x;
    let y_local = this[name].position.y;
    let z_local = this[name].position.z;


    console.log("local coords ", this[name].position)

    //3D Model to represent a chair 
    const chairGeometry = new THREE.BoxGeometry(0.3, 0.3, 0.3);
    const chairMaterial = new THREE.MeshBasicMaterial({ color: 0x00ff00 });


    const chair = new THREE.Mesh(chairGeometry, chairMaterial);


    //TODO: coordinate system with origin on detected object        

   switch (name) {
        case "office_sign_6c03":
            console.log("detected office_sign_6c03")

            break;
        case "office_sign_6c04":

            console.log("detected office_sign_6c04")
            chair.position.set(x_local + 3, y_local + 0,z_local -2)

            this.scene.add(chair)

            console.log("chair posi ", chair.position)

            break;

        default:
            break;
    }
    this.scene.add(chair)
}

Maybe I don’t get the meaning of the positions (of the image or of the camera) correctly. Can anybody help?

This topic was automatically closed 15 days after the last reply. New replies are no longer allowed.