Phaser/Pixi 法线贴图过滤器不工作答案

【问题标题】：Phaser/Pixi Normal Map Filter Not WorkingPhaser/Pixi 法线贴图过滤器不工作
【发布时间】：2014-11-14 13:57:58
【问题描述】：

我正在尝试将法线贴图应用于 Phaser 精灵，但在 Phaser 2.1.1 (Pixi 1.6.1) 中出现以下 WebGL 错误：

Could not initialise shaders phaser.js:3411
WebGL: INVALID_OPERATION: useProgram: program not valid phaser.js:3475
WebGL: INVALID_OPERATION: getUniformLocation: program not linked phaser.js:3478
WebGL: INVALID_OPERATION: getAttribLocation: program not linked phaser.js:3486

这是我的代码：

preload: function () {
  game.load.script('normal',   './js/NormalMapFilter.js');

  game.load.image('cardfront',  './img/sample-front.png');
  game.load.image('cardnormal', './img/sample-front-norm.jpg');
},

create: function() {
  this.cardfrontnorm = PIXI.Texture.fromImage('cardnormal');
  this.normalmap = new PIXI.NormalMapFilter(this.cardfrontnorm);

  this.card = game.add.sprite(game.width / 2, game.height / 2, 'cardfront');
  this.card.filters = [this.normalmap];
}

精灵图像和法线贴图都是 512x512。

任何帮助将不胜感激，谢谢！

【问题讨论】：

如果你可以把它发布在 jsfiddle 或类似网站上，我会检查我是否得到同样的错误
@imcg 不幸的是，由于 CORS 限制和通过 js 加载的资产，这有点困难。
我也遇到了同样的问题。你解决了吗？

标签： javascript webgl phaser-framework pixi.js

【解决方案1】：

显然，NormalMapFilter 是一个实验，从未打算引入到库中：

Check HTML5 Game Devs - Pixijs forum

但是，您可以尝试在此处使用照明插件： https://github.com/pixijs/pixi-lights

【讨论】：