Im trying to hit a pin scene child with a click in GMaps, using Three.js and threejs-overlay-view but I can’t get the object clicked. Raycaster.intersectObjects only returns [].
Here’s a snippet of the code, everything works fine except the intersection part.
(async () => {
const map = await initMap();
const mapDiv = map.getDiv();
const mousePosition = new Vector2();
const raycaster = new THREE.Raycaster();
const overlay = new ThreeJSOverlayView(mapOptions.center);
const scene = overlay.getScene();
overlay.setMap(map);
...
map.addListener('click', ev => {
const {domEvent} = ev;
const {left, top, width, height} = mapDiv.getBoundingClientRect();
const x = domEvent.clientX - left;
const y = domEvent.clientY - top;
mousePosition.x = 2 * (x / width) - 1;
mousePosition.y = 1 - 2 * (y / height);
// dont get nothing here...
raycaster.setFromCamera(mousePosition, overlay.camera);
const intersects = raycaster.intersectObjects(scene.children, true);
overlay.requestRedraw();
});
overlay.update = () => {
// ... and here
raycaster.setFromCamera(mousePosition, overlay.camera);
const intersects = raycaster.intersectObjects(scene.children, true);
...
overlay.requestRedraw();
};
})();
Glad if any help, Thanks!