Блог

Главная - Вопросы по программированию - Проблема с gltf при импорте в three.js

Проблема с gltf при импорте в three.js

#three.js #transparency #gltf

#three.js #прозрачность #gltf

Вопрос:

Я работаю над проектом для своей школьной работы, и у меня возникла проблема с импортом файла gltf в three.js . Я создаю свои файлы gltf с помощью blender 2.9. Поэтому, если я экспортирую gltf отдельно ( bin текстуры), я могу импортировать модель с помощью загрузчика gltf, но проблема в том, что текстуры, которые должны быть прозрачными, не являются прозрачными, даже если я тестирую файл в онлайн-загрузчике gltf, они не прозрачны. Но если я экспортирую как встроенный gltf, все работает правильно в онлайн-просмотрщике gltf, но в моем проекте я получаю эту ошибку:

Неперехваченная (в обещании) ошибка { target: img, isTrusted: true, srcElement: img, eventPhase: 0, bubbles: false, cancelable: false, returnValue: true, defaultPrevented: false, composed: false, временная метка: 768, … }

У кого-нибудь есть идеи, что не так? Я потратил несколько часов, пробуя разные вещи, и я почти уверен, что моя настройка узла в blender верна, поскольку я прочитал некоторые форумы, а также официальную документацию по Blender. Или, может быть, есть что-нибудь, что я могу исправить с помощью отдельного экспортированного gltf, чтобы прозрачность работала?

Спасибо

Комментарии:

1. Если вы можете предоставить общий .blend доступ к файлу, который соответствует документации экспортера Blender, но не отображается корректно в glTF viewers при экспорте, было бы целесообразно указать ошибку в github.com/KhronosGroup/glTF-Blender-IO . Для модели glTF, которая выглядит нормально в средстве просмотра, но не в вашем коде, вам может потребоваться поделиться этим кодом или попробуйте задать вопрос на форумах любого используемого вами движка WebGL ( discourse.threejs.org для three.js ).

2. Кроме того, какая версия Three.js вы употребляете? Онлайн-редактор использует последнюю версию, которая есть r122 . Возможно, у вас в проекте более старая версия, в которой могут отсутствовать все функции, доступные редактору.

Ответ №1:

попробуйте добавить в средство визуализации ({alpha:true}), чтобы добавить возможность прозрачности, я не уверен, но это должно сработать

пожалуйста, добавьте свой код, чтобы узнать, не случилось ли чего-то еще с кодом

Ответ №2:

Спасибо всем за ваши ответы. Теперь мне удалось устранить проблему с помощью отдельной версии gltf, добавив эти две строки в средство визуализации:

     gl.enable(gl.BLEND);
    gl.blendFunc(gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA);

Затем я смог видеть сквозь текстуру, но только то, что было частью одного и того же объекта в Blender, все остальное было белым, но потом я понял, что это потому, что этот объект был одним из первых, который был нарисован, поэтому, я думаю, он использовал белый цвет холста вместо объектов на заднем плане.
Еще раз спасибо