Hello and welcome
yes this is highly possible
You want to use the DynamicTexture which will give you a canvas and a context
https://doc.babylonjs.com/how_to/dynamictexture
Hello and welcome
yes this is highly possible
You want to use the DynamicTexture which will give you a canvas and a context
https://doc.babylonjs.com/how_to/dynamictexture
Thanks for the quick reply.
Maybe I’m missing something, but I don’t think I need the canvas and context that DynamicTexture would give me; I need to give DynamicTexture one of my PIXI assets.
From what I can see on that example page, it looks like what I need to do is pass my PIXI scene into the constructor of DynamicTexture. That would be awesome if true; I would be creating just one WebGL container, the Babylon container, and passing a scene into a texture.
If that sounds about right to you, great, I’ll dive in and make it work. If you think I still have something wrong, please let me know.
Well I though Pixi.js would instantiate with a HTML canvas (which is what DynamicTexture has)
if it is not the case we could add a property to the DynamicTexture so the suer can pass a custom pre created canvas
PIXI does instantiate with an HTML canvas so I can build the entire canvas I need with PIXI. I need to get that canvas into DynamicTexture so it sounds like that second sentence is what I need.
Lol I just realized we already support it
The second parameter of the DynamicTexture constructor can be a canvas:
https://doc.babylonjs.com/api/classes/babylon.dynamictexture#constructor
And there it is! Thanks!
I’ll dive in and give it a try.
Thanks again.
Please let me know how it goes. I would like to improve our pixi documentation to mention that feature
… lots of artistic potential in mixed-medium, imho.
quocsinh’s solution works. I’ll use it if I can’t get DynamicTexture to work, which I"m still going to try.
Dude, I think you you’ve done it. I’ll give it a try after work, but I do believe that’s the idea.
Now, this is me whining a bit, but it would be AWESOME if I could make the rendering of the PIXI Container on the sphere dynamic. Without any further programmatic intervention, of course.
Another demo simpler you can try: Edit fiddle - JSFiddle
I don’t think can be extract PIXI.Container to DynamicTexture because the context of DynamicTexture is CanvasRenderingContext2D while PIXI rendering by WebGLRendering.
In this https://jsfiddle.net/skguy793/ an imp moves across the background and shows on the sphere. However when I tried extracting the canvas in the engine.runRenderLoop so that the imp would move on the sphere I couldn’t get it to work https://jsfiddle.net/skguy793/1/
Did you check this How to combine Babylon.js and Pixi.js - Babylon.js Documentation ?
or is it totally different ?
I’ll try your simpler example, quocsinh. Sounds like this will be the only way I can pull it off, but at least I have a path forward.
Thanks again.
It is different, sebavan.
Ok so you could try to wrap the canvas (pixi) in a HtmlElementTexture this is a simple babylon wrapper for element that could be used for babylon texture.
Simply call update on the HtmlElementTexture of Babylon when there is a new fresh render in pixi.
Ultimately could you guys please consider updating the doc page? It would be useful for a lot of people using Pixi and Babylon
Definitely, waiting to see if it all works before
Hi, I try insert pixi.js animation to HtmlElementTexture. But I see the animation separately from the plane.
For example: https://jsfiddle.net/8L31j9pe/