Three js Texture Loader не может загрузить текстуру - PullRequest
Новая
       10

Three js Texture Loader не может загрузить текстуру

0 голосов
/ 27 февраля 2020

Я пытаюсь загрузить изображение с тремя js (я хочу получить тот же результат, что и у этого проекта: https://github.com/brunoimbrizi/interactive-particles). Но когда я запускаю проект, код не хочет загружать изображение и отображать непосредственно ошибку. Вот мой код: 

init(src) {
        const loader = new THREE.TextureLoader();

        loader.load('images/sample-01.png',
            (texture) => {
                console.log('YOOOO');
                this.texture = texture;
                this.texture.minFilter = THREE.LinearFilter;
                this.texture.magFilter = THREE.LinearFilter;
                this.texture.format = THREE.RGBFormat;

                this.width = texture.image.width;
                this.height = texture.image.height;

                this.initPoints(true);
                this.initHitArea();
                this.initTouch();
                this.resize();
                this.show();
            },
            function (err) {
                console.log('LOADING');
            },

            // onError callback
            function (err) {
                console.error('An error happened.', err);
            });
    }

Я убежден, что путь к изображению правильный, поэтому я, к сожалению, имею представление о проблеме. Вот ошибка:

ERROR HERE

Я запускаю этот проект на Vue js, с npm запустите dev, поэтому я на сервере.

Надеюсь, кто-нибудь сможет мне помочь, я работаю над этим 3 дня ...

Спасибо!

1 Ответ

0 голосов
/ 27 февраля 2020

Попробуйте назначить загруженную текстуру без вызовов периферийных методов. Что-то простое, как это: 

const loader = new THREE.TextureLoader();
const texMap = loader.load('images/sample-01.png');

new MeshBasicMaterial({map: texMap});

Я вполне уверен, что если URL-адрес изображения правильный, и простой тест, описанный выше, работает, то проблема заключается в одном из следующих дополнительных методов: 

this.initPoints(true);
this.initHitArea();
this.initTouch();
this.resize();
this.show();
...