Заменить цвет в pixi js

Question

Помогите разобраться как поменять цвета в PIXI есть картинка красного цвета Предположим Нужно изменить цвет с красного на зеленый, для пртимерна. Но чтобы тени остались, то есть с учетом тона.

Я могу сделать это попиксельно. Если есть идеи по алгоритму, я тоже буду очень признателен

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. Я был бы очень признателен за вашу помощь.

Answer 1

У меня есть подсказка, но, к сожалению, не полный ответ. Я проверил все примеры pixi один раз и попытался понять пример с цветным фильтром.

В этом примере фильтр colormatrix применяется к "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 содержит следующее описание параметра матрицы, которое, к сожалению, не помогает понять его:

Матрица цветовой матрицы фильтра. Значение по умолчанию: [1, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0, 1, 0]

Я также нашел это изображение в этом посте о Flash, который, как я предполагаю, описывает параметры матрицы и преобразования.

Я пытался использовать эти ресурсы для создания своего собственного фильтра, но у меня не получилось и у меня не было времени попробовать дальше.