I’m trying to position a part of a texture that is being rendered on a portion of a SphereGeometry, inside a full SphereGeometry.
I attach a jsfiddle so you can see what I mean:
If you open the link, you will see that the smaller texture in the scene is a part of the bigger one.
The bigger one is rendered on a big full sphere.
The smaller one, is rendered on a portion of a sphere.
I want to give the smaller Mesh the proper position, rotation and scale so it can perfectly fit inside the sphere making it look like the smaller one isn’t even there.
I suspect the part of the sphere is not correct either…
this.videoCustomGeometry = new THREE.SphereBufferGeometry(500, 64, 64, 1, 1.8, 1, 0.9);
this.videoCustomGeometry.scale( - 1, 1, 1 );
I came close to find the position, using a raycaster and attaching the next code to the mousemove event:
var intersects = this.raycaster.intersectObjects([this.pano], false);
And then, I get the exact position where the smaller Mesh should be positioned, but I don’t know about the rotation, scale, or if the geometry the smaller Mesh is using is correct.
I’m stuck… thanks in advance!