Three.js materialLoader不会加载嵌入的纹理图像 [英] Three.js materialLoader doesn't load embedded texture image

问题描述

我正在使用material.toJSON()提供的方法导出three.js材料，这是结果:

I'm exporting a three.js material using material.toJSON() provided method, this is the result:

{
"metadata":{"version":4.5,"type":"Material","generator":"Material.toJSON"},
"uuid":"8E6F9A32-1952-4E12-A099-632637DBD732",
"type":"MeshStandardMaterial",
"color":11141120,
"roughness":1,
"metalness":0.5,
"emissive":0,
"map":"876D3309-43AD-4EEE-946F-A8AE8BA53C9E",
"transparent":true,"depthFunc":3,"depthTest":true,"depthWrite":true,

"textures":[
    {
        "uuid":"876D3309-43AD-4EEE-946F-A8AE8BA53C9E",
        "name":"",
        "mapping":300,
        "repeat":[1,1],
        "offset":[0,0],
        "center":[0,0],
        "rotation":0,
        "wrap":[1001,1001],
        "minFilter":1008,
        "magFilter":1006,
        "anisotropy":1,
        "flipY":true,
        "image":"C6B4FEDA-8E7E-490A-A1AD-866ECE36E952"}],

"images":[
{
    "uuid":"C6B4FEDA-8E7E-490A-A1AD-866ECE36E952",
    "url":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAgAAAAEACAYAAADFkM5nAAAg[...]"
}]}

我尝试使用MaterialLoader作为示例建议

I try to use MaterialLoader as the example suggest

https://threejs.org/docs/#api/loaders/MaterialLoader

但是在解析时，我总是会收到此错误

but at parsing time I always get this error

THREE.MaterialLoader:未定义的纹理 876D3309-43AD-4EEE-946F-A8AE8BA53C9E

THREE.MaterialLoader: Undefined texture 876D3309-43AD-4EEE-946F-A8AE8BA53C9E

如果我希望从MaterialLoader使用嵌入式资源，那我错了吗? 我做错了或遗漏了什么? 我还如何将json文件中的图像加载到相关纹理中?

I'm I wrong if I expect from the MaterialLoader to use the embedded resources? I'm doing it wrong or missing something? How can I also load the images in the json file into the related texture?

谢谢！

这里是一个小提琴: http://jsfiddle.net/akmcv7Lh/211/

here a fiddle: http://jsfiddle.net/akmcv7Lh/211/

推荐答案

请注意，MaterialLoader无法加载纹理.它期望在像ObjectLoader这样加载JSON文件之前，通过MaterialLoader.setTextures()设置纹理:

Notice that MaterialLoader is not able to load textures. It expects that textures are set via MaterialLoader.setTextures() before loading a JSON file like ObjectLoader does:

const loader = new MaterialLoader();
loader.setTextures( textures );

因此，如果各个材料没有纹理，则MaterialLoader只能用作独立的加载器.否则，您必须像ObjectLoader一样在应用程序级别上准备纹理.

So MaterialLoader can only be used as a standalone loader if the respective materials have no textures. Otherwise you have to prepare the textures on app level similar how ObjectLoader does.

这篇关于Three.js materialLoader不会加载嵌入的纹理图像的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！