three.js 渲染dom元素在3d场景中.

很多时候我们需要在3d场景中嵌入2d的dom元素去更简单的实现页面上的交互,记录一下开发逻辑:
原理就是建一个mesh对象,设置为透明不可见,然后再建一个dom元素,在全局render中计算出mesh的世界坐标与照相机的相对位置.
然后对dom元素设置left和top

我简单封装了一下基类BaseElement,以及实现了一个demo案例
BaseElement: https://github.com/aoobao/bim_test/blob/master/src/assets/js/BaseElement.js

demo: https://github.com/aoobao/bim_test/tree/master/src/components/Spot

记录一下以做参考

标签: none

添加新评论