Can a html <img> use a Pixi Texture object?

[ShotgunJed 6]

I know that a texture can be loaded from the website's assets (e.g: "/foo.png"). Is it possible to do something like this:

let texture = (some texture from Pixi)

document.body.appendChild(<img width=420 height=420 src=texture>);

Can a html element use a pixi texture?

[alex_h 114]

You'd want to render the texture to another canvas and append that to the body. Or if you really have to use an image you could render the texture to an off screen canvas, then use canvas toDataUrl to get it into an image element

https://developer.mozilla.org/en-US/docs/Web/API/HTMLCanvasElement/toDataURL

You assign the output of canvas toDataUrl as the image src

[ivan.popelyshev 1074]

`texture.baseTexture.source` is original element, image or canvas.

[charlie_says 33]

I've been a slightly different variant: using a PIXI.Sprite (which has additional content) as an image source

var imgSRC = renderer.extract.canvas(mySprite).toDataURL('image/png'); 

var img = document.createElement('IMG');

img.src = imgSRC;
img.style.width = '100%';
img.style.height = 'auto';
	
document.body.appendChild(img);