【发布时间】：2014-05-19 15:14:21
【问题描述】：
我正在使用 three.js 库构建一个游戏，并且我希望在屏幕上有一个不可移动的小“面板”。我的意思是用户将能够在 3D 环境中导航，但面板将始终位于其屏幕的前面（就好像相机移动不会影响它一样）。
这是一个示例 http://icecreamyou.github.io/Nemesis/game.html
虽然，我希望这个面板里面有可点击的对象，例如网格，我将点击它并调用一个函数。在示例中，这个人使用了一个 div 元素。
如何实现这一点？我检查了 Sprite 对象，但据我所知，它还不能点击。到目前为止，我过去常常创建可点击的网格，将它们放置在我想要的位置并在相机移动时移动它们，但这还不够好，因为相机移动的复杂性。
编辑哦，我没有告诉你的另一件事是我希望这个面板不影响后面的内容。我的意思是我希望它是透明的。只会显示存在的网格。我不希望面板隐藏任何东西。
【问题讨论】：
-
你为什么不把它设置为普通的旧 HTML 元素？
-
在画布元素内部？我想在面板中有可点击的网格？你的意思是在 html 元素中还有一个 canvas 元素？
-
我认为你可以在当前画布前面有另一个画布，并在那里呈现你想要的任何东西。您的示例使用它（画布雷达）
-
是的，我想过。这是个好主意。我只是想知道是否可以将面板放在我拥有的一个画布内，以解决性能问题。因为项目很大，有很多 3d 对象功能等。你知道额外的画布元素会对性能等有多大影响吗？谢谢
标签： javascript three.js webgl panel clickable