Pixi.js: PIXI.Sprite.from() funktioniert nicht mit base64-Daten-URL

Erstellt am 19. Nov. 2019 · 3Kommentare · Quelle: pixijs/pixi.js

Erwartetes Verhalten

Ich versuche, ein Bild in eine Pixi-Leinwand einzufügen, indem ich eine base64-Daten-URL-Zeichenfolge verwende. Ich muss das verwenden, weil das Bild aus einem Kamera-Feed (Video-Tag) erstellt wird.

Aktuelles Verhalten

Es funktioniert, wenn ich eine normale Bild-URL in das erste Argument von Sprite.from einfüge, aber nicht, wenn ich eine base64-Daten-URL verwende.

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

Ist das, was ich versuche, überhaupt möglich? Wenn das so ist, wie?

Umfeld

pixi.js Version : 5.1.2
Browser & Version : Chrome 78.0.3904.87
Ausführungsbeispiel : https://codepen.io/gigamesh/pen/GRRzdrL?editors=1111

Quelle

gigamesh

Hilfreichster Kommentar

Hier ist die Lösung für alle, die diesen Thread finden:

// 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

gigamesh am 25. Nov. 2019

❤1 🎉1 👍1

Alle 3 Kommentare

data:image/gif - nicht möglich. Sie benötigen einen eigenen GIF-Decoder. Ich hatte es irgendwo...

ivanpopelyshev am 20. Nov. 2019

Sie können das Videoelement direkt an den Texture-Konstruktor übergeben ( from nennen es)

eXponenta am 20. Nov. 2019