WEBGL смещение цветных пикселей

Question

Я новичок в мире WebGL и шейдеров, и мне было интересно, какой лучший способ сделать эффект ниже.

Незавершенное

Желаемая эффект

я использовал THREE.TextGeometry нарисовать текст. В тексте ShaderMaterial я создал простой свет. И я перемещаю вершины с простым шумом, чтобы дать эффект ткани.

Теперь мне нужно перемещать цветные пиксели. Может ли кто-нибудь дать мне направление? Благодаря!

Answer 1

Непонятно, какого эффекта вы пытаетесь достичь. Похоже, вы пытаетесь добиться эффекта пост-обработки, что делает его похожим на то, что вы просматриваете стекло с поверхностными дефектами.

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

Существует не-three.js example here.