web端渲染3d模型,ply,stl_webview渲染机制

web端渲染3d模型,ply,stl_webview渲染机制

编码文章call10242025-02-18 10:37:0414A+A-

最近在公司里面做一个web功能,需要在页面上渲染3d模型,主要是做口腔扫描。

做web3d,可用的js库还是很多,首先想到的就是vue-3d-model

方便快捷,但是呢ply模型的颜色显示不出来,没有着色。当然渲染的时候可以自己加颜色,但是不是我想要的。



下图是用其他3d浏览软件打开的效果

以为是js库的问题,直接换threeJs,这老大哥,很强大,也很流行了。

实际渲染效果也是一样,都是纯色。

经过我不断尝试,查找资料,终于找到了缘由。

load模型数据之后,里面有属性,我这边的口扫数据属于不同的扫描厂家,有些厂家会把着色的颜色属性打包放数据文件里面,有些厂家是直接生成材质图片,数据文件里面就给出了渲染坐标属性



含贴图的,在ply 文件头部会指定贴图名称,如下图

不含贴图的打开如下


附上最终代码,说不定哪天己还来看

three.js webgl - exporter - ply

three.js webgl - exporter - ply






最终渲染效果,一个是贴图,一个是颜色。

点击这里复制本文地址 以上内容由文彬编程网整理呈现,请务必在转载分享时注明本文地址!如对内容有疑问,请联系我们,谢谢!
qrcode

文彬编程网 © All Rights Reserved.  蜀ICP备2024111239号-4