Shape with different clickable parts

You need Raycaster for this.

See from the Collection of examples from discourse.threejs.org

RaycastForEdges
modify Geo

RayCasterPlane
RaycasterHitTest
RaycastTubeRadialSegment

Raycaster-getID-mergedBufferGeometry
RaycastingToLine
RaycasterAfterUpdatingPositions


UPDATE:
If the parts of your figure are defined by a texture, you can use the uv coordinates.

See Advanced, Raycast onto 3D mesh to get 2D position on texture

From the docs:


An array of intersections is returned…

[ { distance, point, face, faceIndex, object }, ... ]

distance – distance between the origin of the ray and the intersection
point – point of intersection, in world coordinates
face – intersected face
faceIndex – index of the intersected face
object – the intersected object
uv - U,V coordinates at point of intersection
uv2 - Second set of U,V coordinates at point of intersection
instanceId – The index number of the instance where the ray intersects the InstancedMesh


1 Like