threejs怎么阻止几何体点击穿透？

Question

我用threejs做了一个地球，在上面放置了一些城市点

鼠标滑过点的时候会变成小手形状并显示它的名称，但是像上图中，城市在地球背面，鼠标滑上去的时候穿透了几何体触发了事件，现在想让在地球背面的城市点不触发事件，请问应该怎么做呢？

Answer 1

three.js 鼠标划过原理是 从鼠标出发做一条射线，并返回射线与之碰撞的物体集合，越早碰到的物体集合下标越小越靠前，也就是在正面理论上返回集合是：[ 城市，地球 ] ，在反面：[ 地球，城市], 也就是说可以通过判断物体是否在第一个来确定是否为直接碰撞体。

Answer 2

设置css

canvas.style.cursor = "default";