Pixi.js: 별도의 파일 GLSL 셰이더를 문자열로 로드

에 만든 2017년 01월 26일 · 3코멘트 · 출처: pixijs/pixi.js

안녕하십니까,

저는 Pix를 사용하여 GLSL 셰이더를 작업 중이며 일부 자습서에서 볼 수 있듯이 Javascript HTML 요소에 셰이더를 작성하는 것이 좋지 않기 때문에 별도의 파일에 작성하고 Javascript로 내용을 로드하여 Pixi 필터에서 사용하고 싶습니다. 모두.

이 코드를 고려하면:

const frag_shader = document.getElementById( 'frag_shader' ).innerHTML; //Replacing this by reading the GLSL file 

const filter = new PIXI.Filter('', frag_shader);

콘텐츠를 PIXI.Filter 에 전달하기 위해 Pixi.js가 외부 GLSL 파일을 로드할 수 있는 방법이 있습니까?
그렇지 않다면 계획된 기능입니까 아니면 glslify npm 패키지와 같은 외부 도구를 사용하여 그렇게 합니까(https://github.com/stackgl/glslify)?

Pixi v4가 GLSL 파일을 처리하는 방법에 대한 정보가 많지 않고 SO에 답이 없는 것 같습니다. 그래서 이것이 여러분이 생각해낼 수 있는 것인지 알아보기 위해 이 문제를 엽니다.

답변해 주셔서 감사합니다.

출처

SebastienFPRousseau

👍1

가장 유용한 댓글

예, PIXI에는 glslify가 포함되어 있습니다. 로더를 사용할 수 있습니다.

PIXI.loader.add(["vert.txt","frag,txt"]);
PIXI.loader.load(finshed);

function finished()
    {
    var vert = PIXI.loader.resources["vert.txt"].data;
    var frag = PIXI.loader.resources["frag.txt"].data
    var myfilter = new PIXI.Filter(vert, frag);
    }

merachefet 에 2017년 01월 28일

👍3

모든 3 댓글

예, PIXI에는 glslify가 포함되어 있습니다. 로더를 사용할 수 있습니다.

PIXI.loader.add(["vert.txt","frag,txt"]);
PIXI.loader.load(finshed);

function finished()
    {
    var vert = PIXI.loader.resources["vert.txt"].data;
    var frag = PIXI.loader.resources["frag.txt"].data
    var myfilter = new PIXI.Filter(vert, frag);
    }

merachefet 에 2017년 01월 28일

👍3

감사 해요 ! 그것이 내가 필요했던 것입니다.

SebastienFPRousseau 에 2017년 01월 30일

이 스레드는 닫힌 후 최근 활동이 없었기 때문에 자동으로 잠겼습니다. 관련 버그에 대한 새 문제를 여십시오.

lock[bot] 에 2019년 02월 24일

이 페이지가 도움이 되었나요?

0 / 5 - 0 등급

Pixi.js: 별도의 파일 GLSL 셰이더를 문자열로 로드

가장 유용한 댓글

모든 3 댓글

관련 문제