我正在尝试将 Pixi v3 的自定义着色器转换为 v4。

原文在这里： http://www.awwwards.com/a-gentle-introduction-to-shaders-with-pixi-js.html

相关的 CodePen 位于 http://codepen.io/omarshe7ta/pen/xVeWWy

到目前为止，我已经得到了这个：

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 …

我正在尝试使用Three.js ShaderMaterial并尝试实现照明.我有r70的工作代码,但相同的代码(稍作修改 - MAX_POINT_LIGHTS常量已重命名为NUM_POINT_LIGHTS)对r76不起作用.

查看WebGL Inspector中的跟踪,很明显没有光数据被发送到着色器.那么,灯光坏了还是我需要设置其他东西才能让它工作？

使用r70(工作)

http://codepen.io/anon/pen/KzjXNr?editors=1010

片段着色器

uniform vec3 diffuse;
varying vec3 vPos;
varying vec3 vNormal;
uniform vec3 pointLightColor[MAX_POINT_LIGHTS];
uniform vec3 pointLightPosition[MAX_POINT_LIGHTS];
uniform float pointLightDistance[MAX_POINT_LIGHTS];

void main() {
  vec4 addedLights = vec4(0.1, 0.1, 0.1, 1.0);
  for(int l = 0; l < MAX_POINT_LIGHTS; l++) {
    vec3 lightDirection = normalize(vPos - pointLightPosition[l]);
    addedLights.rgb += clamp(dot(-lightDirection, vNormal), 0.0, 1.0) * pointLightColor[l];
  }
  gl_FragColor = addedLights;
}

JavaScript - 使用UniformsUtils和UniformsLib设置Shadermaterial

var uniforms = THREE.UniformsUtils.merge([
    THREE.UniformsLib['lights'],
    { diffuse: { type: 'c', value: new …