Pixijs v3抽象フィルタをv4フィルタに変換する

Question

Pixi v3のカスタムシェーダをv4に変換しようとしています。

元記事はこちらです：

function CustomFilter(fragmentSource) { 
    PIXI.Filter.call(this, 
     null, 
     fragmentSource 
); 
} 
CustomFilter.prototype = Object.create(PIXI.Filter.prototype); 
CustomFilter.prototype.constructor = CustomFilter; 

// smoke shader 
var shaderCode = document.getElementById('fragShader').innerHTML 
var smokeShader = new CustomFilter(shaderCode);  
smokeShader.uniforms.resolution[0] = width; 
smokeShader.uniforms.resolution[1] = height; 
smokeShader.uniforms.alpha = 1.0; 
smokeShader.uniforms.shift = 1.6; 
smokeShader.uniforms.time = 0; 
smokeShader.uniforms.speed[0] = 0.7; 
smokeShader.uniforms.speed[1] = 0.4; 

var bg = PIXI.Sprite.fromImage("pixi_v3_github-pad.png"); 
bg.width = width; 
bg.height = height; 
bg.filters = [smokeShader] 
stage.addChild(bg); 

var logo = PIXI.Sprite.fromImage("pixi_v3_github-pad.png"); 
logo.x = width/2; 
logo.y = height/2; 
logo.anchor.set(0.5); 
logo.blendMode = PIXI.BLEND_MODES.ADD; 
stage.addChild(logo) 

var count = 0 

animate() 

function animate() { 
    requestAnimationFrame(animate); 

    count += 0.01 
    smokeShader.uniforms.time = count; 

    renderer.render(stage); 
} 

エッジが細かい

を実行します。ここでこれまでのところhttp://codepen.io/omarshe7ta/pen/xVeWWy

http://www.awwwards.com/a-gentle-introduction-to-shaders-with-pixi-js.html

関連するCodePen、私はこれを持っていますChromeがエラーをスローする

pixi.min.js:13 Uncaught TypeError: Cannot read property 'value' of undefined 
    at e.syncUniforms (pixi.min.js:13) 
    at e.applyFilter (pixi.min.js:13) 
    at CustomFilter.t.apply (pixi.min.js:13) 
    at e.popFilter (pixi.min.js:13) 
    at e.renderAdvancedWebGL (pixi.min.js:10) 
    at e.renderWebGL (pixi.min.js:10) 
    at e.renderWebGL (pixi.min.js:10) 
    at e.render (pixi.min.js:13) 
    at animate (shader-v4.html:123) 
    at shader-v4.html:113 

FireFoxはエラーをスローし、コンピュータをクラッシュさせます。

t.uniforms.data[u] is undefined 

誰に何が間違っていて、どのように修正するのですか？ TIA

Answer 1

可変

uniform float alpha 

はシェーダがコンパイルされるときに、おそらく離れて最適化され、使用されません。しかし、CustomFilterはその事実を知らないようです。

コードから「アルファ」を削除すると問題は解決しますが、コメントアウトしても問題は解決しません。おそらく、シェイダーソースは、制服や属性のために "馬鹿馬鹿しく"解析されます。コメントは考慮されません。

私はPixiがglsifyを使用していると思うので、glslifyには欠点があるようです。