How to place a box object along two points on a face?

Assume: two surface point: a ,b ,center of a and b: cab, face normal :fn ,vector a-b :vab, box position (0,0,0) , no roation, box z length same as distance a and b, place box along box z axis.

my code not working as i thought

function placeBoxToFace(obj, cab, fn, vab) {
        //clone and normalize
        const upCopy = new THREE.Vector3();
        const fnCopy= new THREE.Vector3();
        const vabCopy= new THREE.Vector3();
        const boxYDirection= new THREE.Vector3(0,1,0);
        const boxZDirection= new THREE.Vector3(0,0,-1);

        //get thickness as y
        const objBox = new THREE.Box3();
        const objSize = new THREE.Vector3();
        const thickness = objSize.y;

        //rotate box to face
        obj.quaternion.setFromUnitVectors(boxYDirection, fnCopy);

       //set object postion
        obj.position.add(fnCopy.multiplyScalar(thickness / 2));

        //rotate box to vab (not working as i thought)
        const quaternion = new THREE.Quaternion();
        quaternion.setFromUnitVectors(boxYDirection, fnCopy);
        obj.quaternion.setFromUnitVectors(boxYDirection, vab);

did i do something wrong? please help.

Can you please demonstrate the usage of your function in a live example? Use the following demo which contains a basic three.js scene with a box and placeBoxToFace().

Thank your attention Mugen87, i use rotateOnAxis and calculate rotate angle of two vector to work around this problem , maybe something i misunderstood the usage of Quaternion, need more study :smile: