tuo-scene的3维附属2维对象设计

此方案已经废弃,转为TuoObject2D的方案

tuo-scene相对于tuo-three2的一个重要改变,就是更好的去支持单场景多视图的结构下,2D和3D的混合渲染。tuo-scene以two.js为基础来描述2D对象,每一个TuoView的渲染函数在渲染3D对象以外,还专门渲染2D对象。而在我们的应用中,很多2D对象是依赖于3D坐标而渲染的,因此tuo-scene设计了project投射机制,用于在渲染时,针对每个视图来单独做投射运算。

3维附属的2维对象的渲染实现步骤如下:

3D对象的数据中插入2D对象数据

附带了2D对象的3D对象的userData结构如下:

userData = {
twoObject: Object2D, //object of two.js
project2D: Function
}

其中,Object2D是two.js的对象,project2D函数每执行以此都会对Object2D对象内部的坐标信息更新。用户必须很好的来实现这个project2D函数。

TuoScene对附属2D对象数据的处理

当TuoScene接到一个满足上述条件的3D对象时,它会做以下4件事情:

  1. 把3D对象添加到threeScene中去
  2. 把2D对象(Object2D)添加到twoScene中去
  3. 把project2D对象添加到project2DMap中去,此map以3D对象的uuid为key,以project2D对象为value
  4. 给3D对象添加一个监听'dispose'事件的函数,在这个函数中,将会从twoScene和project2DMap中把该3D对象对应的2D对象和project2D函数移除。

发表评论

邮箱地址不会被公开。 必填项已用*标注