AsKadir Posted November 8, 2021 Share Posted November 8, 2021 Hi there, Recently I tried to update GSAP from 3.6.0 to 3.8.0 and found issue with Pixi JS. I have a Pixi animation with displacement filter and I also use PixiPlugin. After update it stopped to work and in console I have:DisplacementFilter 'is not a DisplayObject or PIXI was not found. PixiPlugin.registerPIXI(PIXI);' I use webpack and follow rules with GSAP PixiPlugin: import * as PIXI from 'pixi.js'; import gsap from 'gsap'; import { PixiPlugin } from 'gsap/PixiPlugin'; import { Draggable } from 'gsap/Draggable'; gsap.registerPlugin(PixiPlugin, Draggable); PixiPlugin.registerPIXI(PIXI); I though it was Webpack or Pixi JS issue because I updated them too, but after a lot of tests I see that issue with GSAP. You can check this codepen and see error in console. Let me know am I right or not, thanks in advance! See the Pen yLJZmxK by ChicagoJostik (@ChicagoJostik) on CodePen Link to comment Share on other sites More sharing options...
Solution OSUblake Posted November 8, 2021 Solution Share Posted November 8, 2021 The PixiPlugin works with DisplayObjects, which would be like a Sprite, Graphics, Container, or any other PIXI object that extends PIXI.DisplayObject. Filters do not extend DisplayObject. http://pixijs.download/release/docs/PIXI.DisplayObject.html For your animation, you will need to target the properties directly. gsap.to(displacementFilterCloud.scale, { x: 180, y: 180 }) 1 1 Link to comment Share on other sites More sharing options...
AsKadir Posted November 9, 2021 Author Share Posted November 9, 2021 @OSUblake, Thanks a lot! You saved me again! Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now