pixijs / filters

Collection of community-authored custom display filters for PixiJS
https://pixijs.io/filters/docs/
MIT License
967 stars 158 forks source link

Breaking Change with HslAdjustmentFilter in pixi.js v8 #467

Closed gabrielliwerant closed 3 months ago

gabrielliwerant commented 3 months ago

The HslAdjustmentFilter used in the following way no longer works in pixi.js v8. It worked fine in v7.

"pixi-filters": "^6.0.4",
"pixi.js": "^8.2.6"
const app = new Application();

app.init().then(() => {
  document.body.appendChild(app.canvas);

  Assets.load(['https://pixijs.com/assets/bunny.png']).then(() => {
    const sprite = Sprite.from('https://pixijs.com/assets/bunny.png');

    sprite.position.set(100, 100);
    sprite.filters = [new HslAdjustmentFilter({ saturation: -0.55 })];

    app.stage.addChild(sprite);
  });
});

colorize: true and hue used on their own appear to work, but saturation, lightness, and alpha do not.

gabrielliwerant commented 3 months ago

I discovered that the following works:

const hsl = new HslAdjustmentFilter();
hsl.saturation = -0.55;

sprite.filters = [hsl];

But this does not:

sprite.filters = [new HslAdjustmentFilter({ saturation: -0.55 })];

This is a breaking change that I don't see documented anywhere. Is this a bug or intentional? If intentional, can we add documentation around it?

Seems unintentional since the old syntax still works for colorize and hue.

bigtimebuddy commented 3 months ago

Thanks for pointing this out. I think this was just an oversight as many of the filters needed to be rewritten to support WebGPU so lots of things got moved around. Added a PR to fix setting these props via constructor.