Pixi.js: PIXI.Sprite.from() ne fonctionne pas avec l'URL de données base64

Créé le 19 nov. 2019 · 3Commentaires · Source: pixijs/pixi.js

Comportement attendu

J'essaie d'insérer une image dans un canevas Pixi en utilisant une chaîne d'URL de données base64. Je dois l'utiliser car l'image est créée à partir d'un flux de caméra (tag vidéo).

Comportement actuel

Cela fonctionne si j'insère une URL d'image normale dans le premier argument de Sprite.from , mais pas lorsque j'utilise une URL de données base64.

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

Ce que j'essaye est-il encore possible ? Si c'est le cas, comment?

Environnement

pixi.js version : 5.1.2
Navigateur & Version : Chrome 78.0.3904.87
Exemple d'exécution : https://codepen.io/gigamesh/pen/GRRzdrL?editors=1111

Source

gigamesh

Commentaire le plus utile

voici la solution pour tous ceux qui trouvent ce fil:

// 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 le 25 nov. 2019

❤1 🎉1 👍1

Tous les 3 commentaires

data:image/gif - impossible. Vous avez besoin de votre propre décodeur gif. Je l'avais quelque part...

ivanpopelyshev le 20 nov. 2019

Vous pouvez passer l'élément vidéo directement au constructeur de texture (appelez-le from )

eXponenta le 20 nov. 2019

voici la solution pour tous ceux qui trouvent ce fil:

// 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 le 25 nov. 2019

❤1 🎉1 👍1

Cette page vous a été utile?

0 / 5 - 0 notes