Почему материал three js pointshadermaterial является прямым angular, а не круглым, когда я использую текстуру png? - PullRequest
Новая
       34

Почему материал three js pointshadermaterial является прямым angular, а не круглым, когда я использую текстуру png?

0 голосов
/ 13 июля 2020

Я написал пример очков в соответствии с официальным примером , но результат меня не устраивает:

введите описание изображения здесь

Точка Rect angular, а не круглая !

Вот мой код материала: 

let material = new THREE.ShaderMaterial({
                uniforms: {
                    uColor: { value: new THREE.Color(0xffffff) },
                    uPointTexture: { value: new THREE.TextureLoader().load(require('./res/spark1')) }
                },
                vertexShader: _me.vertex_shader,
                fragmentShader: _me.fragment_shader,

                transparent: true
            })

1 Ответ

0 голосов
/ 13 июля 2020

После некоторой попытки, например: blending: THREE.AdditiveBlending, fog: false ... Я обнаружил, что это связано со свойством depthTest , после того, как я установил false, результат будет ниже:

введите описание изображения здесь

видите, черный квадрат исчез! Вот окончательный код: 

let material = new THREE.ShaderMaterial({
                uniforms: {
                    uColor: { value: new THREE.Color(0xffffff) },
                    uPointTexture: { value: new THREE.TextureLoader().load(require('./res/spark1')) }
                },
                vertexShader: _me.vertex_shader,
                fragmentShader: _me.fragment_shader,

                depthTest: false,
                transparent: true
            })
...