Question

我在SketchUp中生成的Three.js中加载了glb模型。可以在这里https://www.graviditetsberegner.dk/bpnew.skp

找到该文件

该模型包含一个称为带有网格的文本的组。我想在此处显示包含文本的纹理。我使用以下代码：

var modelLoader = new THREE.GLTFLoader();

modelLoader.load("https://www.graviditetsberegner.dk/bpnew.glb", function (gltf) {

model = gltf.scene.clone();
model.scale.set(50,50,50)
scene.add(model);

//Use canvas to draw texture and add it to the model group Text
var textModelMesh = FindMeshWithNameInModel(model, "Text");
var textTexture = CreateCanvasTexture("This is a test");

textTexture.wrapS = THREE.RepeatWrapping;
textTexture.wrapT = THREE.RepeatWrapping;

textModelMesh.material.map = textTexture;

我的代码有两个问题：

文本已镜像。在其他格式（例如dae）中，文本未镜像
仅当我将wrapS和wrapT设置为RepeatWrapping时，才显示文本。但是，SketchUp中使用的纹理应与画布中生成的纹理的尺寸相似。

如何解决这些问题？

显示问题的小提琴：https://jsfiddle.net/Lgmds9ce/2/

Answer 1

文本已镜像。在其他格式（例如dae）中，文本未镜像

如THREE.GLTFLoader的官方documentation中所述，如果您手动替换纹理，则必须将Texture.flipY设置为false。

仅当我将wrapS和wrapT设置为RepeatWrapping时，才显示文本。但是，SketchUp中使用的纹理应与画布中生成的纹理的尺寸相似。

资产的纹理还将Texture.wrapS和Texture.wrapT设置为THREE.RepeatWrapping。

更新的小提琴：https://jsfiddle.net/d12t6p5q/1/

three.js R105

在Three.js中分配给glb模型的纹理被颠倒了，并且只能使用THREE.RepeatWrapping

1 个答案: