使用DOMElements的THREE.js SphereGeometry Panorama热点

CSS

#TestHotSpot {
    /* not sure if using margins is the best method to position hotspot */
    margin-top: 50px;
    margin-left: 50px;
    width: 50px;
    height: 50px;
    background: red;
    position: absolute;
}

JavaScript的

/** 
   CONFIG is my stored object variable; it contains the PerspectiveCamera instance 
   code is being called inside of my RequestAnimationFrame
**/

config.camera.updateProjectionMatrix();
config.controls.update(delta);

document.getElementById("TestHotSpot").style.transform = "translate("+ config.camera.rotation.x +"px, "+ config.camera.rotation.y +"px)";

这也是所需效果的实例.

什么是解决这个问题的最佳解决方案？当我跑步时我注意到它DOMElements只会轻微移动; 我还注意到他们并没有真正考虑到SphereGeometry它们放置的位置(例如,定位在"后面" Camera;真的很复杂!

我很高兴使用THREE.js引擎的任何插件以及任何教程.非常感谢你提前回复!