替换pixi js中的颜色答案

【问题标题】：Replace color in pixi js替换pixi js中的颜色
【发布时间】：2018-11-23 11:17:38
【问题描述】：

帮助我了解如何在 PIXI 中更改颜色有一张红色的图片认为对于 prtimerna，有必要将颜色从红色更改为绿色。而是让影子留下，也就是给定了基调。

我可以逐个像素地做到这一点。如果对算法有想法，我也将不胜感激

var cR = baseData[i];
                var cG = baseData[i + 1];
                var cB = baseData[i + 2];

                if (alpha) {
                    currentData[i + 3] = alpha[i / COMPONETNS_PER_PIXEL];
                } else {
                    currentData[i + 3] = baseData[i + 3];
                }

                if (cR === cG && cR === cB) {
                    currentData[i] = currentData[i + 1] = currentData[i + 2] = cR * brightness;
                    continue;
                }

                var gray = Math.min(cR, cG, cB);

                // parts should be red
                var percent = (cR - gray) / 255;

                currentData[i] = (cR + (color.r - 255) * percent) * brightness;
                currentData[i + 1] = (cG + color.g * percent) * brightness;
                currentData[i + 2] = (cB + color.b * percent * 0.9) * brightness;

但我想将其更改为 VVGL 非常感谢您的帮助

【问题讨论】：

标签： webgl pixi.js webgl2

【解决方案1】：

我有一个提示，但遗憾的是没有完整的答案。我检查了所有 pixi 示例一次并试图理解 the one with a color filter 。

在示例中，颜色矩阵过滤器应用于“app.stage.filters”并替换颜色。

它使用以下代码：

var filter = new PIXI.filters.ColorMatrixFilter();
app.stage.filters = [filter];


app.ticker.add(function(delta) {
  count += 0.1;

  var matrix = filter.matrix;

  matrix[1] = Math.sin(count) * 3;
  matrix[2] = Math.cos(count);
  matrix[3] = Math.cos(count) * 1.5;
  matrix[4] = Math.sin(count / 3) * 2;
  matrix[5] = Math.sin(count / 2);
  matrix[6] = Math.sin(count / 4);
}

Pixi Documentation has the following description 到 matrix 参数很遗憾地无助于理解它：

颜色矩阵过滤器的矩阵。默认值： [1, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0, 1, 0]

我还在this Post about Flash 中找到了this image，我假设它描述了矩阵的参数和转换。

我尝试使用这些资源创建自己的过滤器，但失败了，没有时间进一步尝试。

【讨论】：