Pixi.js: PIXI.Sprite.from() not working with base64 data URL

[gigamesh]

Expected Behavior

I'm attempting to insert an image into a Pixi canvas by using a base64 data URL string. I need to use that because the image is getting created from a camera feed (video tag).

Current Behavior

It works if I insert a regular image URL into the first argument of Sprite.from, but not when I use a base64 data URL.

Ex: https://codepen.io/gigamesh/pen/GRRzdrL?editors=1111

Is what I'm attempting even possible? If so, how?

Environment

• pixi.js version: 5.1.2
• Browser & Version: Chrome 78.0.3904.87
• Running Example: https://codepen.io/gigamesh/pen/GRRzdrL?editors=1111

[ivanpopelyshev]

data:image/gif - not possible. You need your own gif decoder. I had it somewhere...

[eXponenta]

You can pass video element direct to Texture constructor (from call it)

[gigamesh]

here is the solution for anyone who finds this thread:

// img tag points to base64 URL
  const image = document.querySelector('img')
  const base = new PIXI.BaseTexture(image);
  const texture = new PIXI.Texture(base);
  const sprite = new PIXI.Sprite(texture);

https://codepen.io/Slaz/pen/bGGzxPw?editors=1111