Node Material Texture maps not loaded in build project

Hi,

I noticed that my node materials are not shaded correctly in my build Editor project.
Standard and PBR Materials work just fine, since the textures are added in the asset/textures tab and set in the materials slots. Textures uploaded in a texture node in the node editor are not loading in my build project. It think he tries to load the textures as a file (data:octet/stream;base 64) and not as a texture. I attached screenshots.

Using “Embed static texture” will embed the data in the file so it should work.

[…] Just saw your screenshot. It’s strange, the url is not trapped and transformed by Chrome, it’s going to the web server… I think it’s the /scenes/scene prefix which is the problem, you should try to remove it.

A collegue was able to help me searching for the error.
We opened the scene.babylon file in the editor and the prefix isn´t there yet. So the Editor builds the project correctly and “embed static texture” in the node editor works fine.
The Root URL ./Scenes/scene is added somewhere on the way in the viewer/browser.

rootUrl is passed by your code, either when calling loadFromSerialization or Parse or ParseFromSnippetAsync. Make sure that in your code you pass an empty string for this parameter.

I don´t really “have” code. I am working in the Windows Editor. I just build my project directly out of the editor and start the index file using a browser to view it.

Ah, so I think it’s a question for @julien-moreau who created and maintain the editor.

Hey @Evgeni_Popov and @DIO
If the rootUrl looks like “./scenes/scene_name” it means that the material is being parsed using the SceneLoader.
Loading a scene requires to pass a rootUrl parameter (in order to load resources for standard materials, pbr materials, etc.). I think the bug comes more from the NodeMaterial.Parse function that doesn’t check if the data is a baase64 or simple a file path before adding the rootUrl to it.

As an example, having a .babylon scene we would love to do “await SceneLoader.Append(”./scenes/scene/", “my_scene.babylon”)"

Do you agree @Evgeni_Popov?

@julien-moreau You’re right, it’s something that should be handled on the node material side!

However, I could not find where the problem lies because the texture block is already handling the data/base64 encoding correctly:

public _deserialize(serializationObject: any, scene: Scene, rootUrl: string) {
    super._deserialize(serializationObject, scene, rootUrl);

    this.convertToGammaSpace = serializationObject.convertToGammaSpace;
    this.convertToLinearSpace = !!serializationObject.convertToLinearSpace;
    this._fragmentOnly = !!serializationObject.fragmentOnly;

    if (serializationObject.texture && !NodeMaterial.IgnoreTexturesAtLoadTime) {
        rootUrl = serializationObject.texture.url.indexOf("data:") === 0 ? "" : rootUrl;
        this.texture = Texture.Parse(serializationObject.texture, scene, rootUrl) as Texture;
    }
}

rootUrl is replaced by "" if the url starts with data:.

@DIO Can you provide a link to your material or the .json file so that I can dig a bit more?

Hi Evgeni,

you mean the material,.json files in the projects/scene/materials folder?
I attached one of my node materials.car_tire_node_mat.zip (676.6 KB)

Hey @Evgeni_Popov I’m on it and I just saw these lines as well (and looks like it was my lines on a PR I did in past ahahah).
What I’m experiencing right now is that serialized textures have empty “url” property but have their “name” property containing the dataUrl. Strange, maybe a change on textures recently? Because that means the .name property should be checked instead of the .url property. I’m also checking if I’m not doing something strange on my side in the Editor.

@DIO I found a workaround for the moment in the Editor, I’ll share with you a build to solve your problem (I’m forcing serialized materials to tell that url begins with a “data:” (dataUrl style) and it works well).

1 Like

Hey Julien,

sounds great, thanks a lot!

It seems either name or url can store base64 data, given the code of Texture.serialize(): Babylon.js/texture.ts at master · BabylonJS/Babylon.js · GitHub

Maybe @Deltakosh can shed some light on when name/url are used for base64 data?

@Evgeni_Popov you are right, I saw that cube textures have both name and url having the dataUrl (which repeats the same data and growths the size of the JSON ^^)