ThreeJS PointMaterial texture transparent background issue

У меня есть набор частиц, сделанных с THREE.Points, и я использую THREE.PointMaterial с текстурой. Текстура - это штриховые прямоугольники, сделанные с холстом, и это работает, но только частично, вот в чем проблема.ThreeJS PointMaterial texture transparent background issue

Здесь вы можете увидеть, что происходит с моими частицами:

Как вы можете видеть, прозрачность частиц работать только с некоторыми частицами и с некоторыми другими не.

Что может быть здесь?

Это код, который я использую для создания материала:

var material = new THREE.PointsMaterial({ 
    size: this.particleSize, 
    vertexColors: THREE.VertexColors, 
    map: ct.getTexture(), 
    transparent: true, 
    fog: false });

источник

2015-11-20 Javingka

Причина вашей проблемы частицы не сортируются по глубине и оказываемых в спине к передней порядка.

Решение состоит в том, чтобы добавить

material.alphaTest = 0.5;

Затем, прозрачные фрагменты будут отброшены.

three.js r.73

источник

2015-11-20 16:31:29 WestLangley

Thanks WestLangley.! Я применил это решение, и оно работает !. Но, чтобы быть уверенным, что я понимаю, что я сделал, это свойство alphaTest работает как порог, который устанавливает каждый пиксель используемой текстуры, которая имеет альфа-значение более .5 (в данном случае) как прозрачное, и те, у кого есть значение меньше .5 как непрозрачный пиксель? Еще раз спасибо – Javingka

Не совсем. Для значений альфа менее 0,5 фрагмент отбрасывается. В частности, буфер глубины не записывается. – WestLangley

ThreeJS PointMaterial texture transparent background issue

ответ

Смежные вопросы