如何解决THREE.JS:在PNG纹理后面更改材质颜色吗?将2种材料分配给从GLTF模型导入的网格?
我正在尝试在我设置的png纹理(包括透明度)“背后”更改3D模型的颜色。
我做了很多研究,终于找到了一个实际可用的多维数据集的示例,但是我不明白如何使用我的gltf 3D模型(不是BoxGeometry)来实现。
方法:
定义两种材料的阵列, 第一个是我的png纹理,透明度= true; 第二种是基本材料,它具有纯色(我以后可以更改颜色...)
var materialBack = new THREE.MeshBasicMaterial({color: 0xfadce6});
var materialTxt = new THREE.MeshBasicMaterial({map: mytexture,transparent: true});
var materials = [materialBack,materialTxt];
与立方体完美搭配:
var geometry = new THREE.BoxBufferGeometry();
geometry.clearGroups();
geometry.addGroup( 0,Infinity,0 );
geometry.addGroup( 0,1 );
var cube = new THREE.Mesh( geometry,materials );
问题:当我的模型实际上是导入的GLTF而不是“ BoxBufferGeometry”时,我不知道该怎么做。看来我们无法将数组分配给o.material:
var loader = new THREE.GLTFLoader();
loader.load(mymodel.glb,function(gltf) {
gltf.scene.traverse((o) => {
if (o.isMesh) {
o.material = materials;
}
scene.add(gltf.scene);
});
我还尝试从gltf中提取几何图形,然后创建一个新的网格,但是没有成功:
var loader = new THREE.GLTFLoader();
loader.load(mymodel.glb,function(gltf) {
var geometry = gltf.scene.getObjectByName("name").geometry;
mymesh = new THREE.Mesh(geometry,materials);
scene.add(mymesh);
});
有人可以帮忙吗?
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。