0
点赞
收藏
分享

微信扫一扫

three.js第五十二用 较为精确的框选思路 像素拾取大法


threejs交流群511163089

 

首先是像素拾取物体,这个先看看官方DEMO哈,每个颜色编码一个物体,像素的颜色对应物体。

框选怎么弄喃

第一步,筛选出renderlist

第二步,绘制,以ID颜色绘制

第三部 剔除 框选的范围是个矩形,而且本身就是屏幕坐标,那么框选的范围以外的全部置为黑色,所以前面黑色就不编码物体了,留着当没有。

最后绘制的图片上 全是框选范围内的物体的ID,readpixel然后解编码物体就拿到了

因为是像素拾取,所以只能拿到面前的第一排物体,被挡住的就没有了,需要你开发别的部分来拿

优化

第一个操作,输出的图片1/8 1/16分辨率,这样估计也能拾取到,只要像素颜色没改变,就没啥问题吧,这样性能高一点

第二个操作,readpixel分摊至每一帧,不要一次读,这样性能又高一点

思路就是这样了

举报

相关推荐

0 条评论