Comments (11)
Hi @thenayr, pixi.js can get a bit funny once it loses the context it was created in :/
What are ya trying to achieve?
from pixijs.
@GoodBoyDigital Thanks for the reply. I have a company dashboard with a few fun easter eggs built in Pixi. There is trigger on the dashboard that overlays a full pixi canvas over the dashboard, problem is I only want it to live for a finite amount of time then disappear, then (in theory) re-triggered again at a later time.
from pixijs.
oh nice! :)
I think I need to look into fixing this, some of the information (the webGL batch's and textures) exists in the previous webGL context.
Until this is fixed I would suggest using the canvas renderer as that does not suffer from the same issues. Ya could use webGL for first run too.
I will look into nailing that issue though as it shouldn't take too long to fix. Do you have any code I could test with? Thanks!
from pixijs.
@GoodBoyDigital Great, I'll try falling back on canvas for now. As far as code samples code, I'm basically doing the following:
Upon someone hitting the trigger I fire the init function of the Pixi javascript.
// Trigger.js
init()
empty = -> $('#easteregg').empty()
setTimeout empty, 20000
// Pixi.js
function init() {
...
renderer = PIXI.autoDetectRenderer(stageWidth, stageHeight, null, true);
document.getElementById('easteregg').appendChild(renderer.view);
...
}
Lots of code left out in-between, but essentially just adding a bunch of textures to the stage that float around in varying speeds/directions, the trigger then empties out the container div after 20 seconds.
from pixijs.
Just to confirm, using canvas does indeed fix the issues I was running into, performance is excellent as well. Thanks for the tip.
from pixijs.
Nice one :) thats great to hear!
from pixijs.
Maybe related to issue 23 which thows the same error? In the mean time, I'm using the canvas rendered which works beautifully.
from pixijs.
I tried to use pixi on a backbone project, my first test was to duplicate your examples from:
http://www.goodboydigital.com/to-dom-or-not-to-dom/#comment-241
It works fine the first time but if I change the view and comeback then:
WebGL: INVALID_OPERATION: useProgram: object not from this context pixi.js:13
WebGL: INVALID_OPERATION: bindTexture: object not from this context pixi.js:13
WebGL: INVALID_OPERATION: uniformMatrix4fv: location is not from current program
I triend to empty() the container but same issue...
from pixijs.
As stated before losing the webgl context will cause errors, use the canvas renderer if you must remove the element.
However, there are better ways to stop rendering than removing the element.
- Stop calling
.render(stage)
- just don't render anymore and hide the element. Then later you can come back and show it again and just start rendering again - If you need to clear the stage and start over, then go through each of the stages children and remove them, then initialize again by putting in what children you want.
from pixijs.
Closing this for now, IMO you really shouldn't be destroying the element mid-render. There are better ways to handle that.
from pixijs.
This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.
from pixijs.
Related Issues (20)
- Bug: TypeError: Cannot read properties of null (reading 'uid') HOT 1
- Bug: The content of multiple texts overlaps with each other. HOT 17
- Bug: [v8] antialias=true drastically cuts performance even when idle HOT 3
- Bug: Arc line cap not re-rendered if graphics is cleared HOT 1
- Bug: v8 mask container bounds changes
- Bug: Unable to add a mask to the text HOT 1
- Bug: [v8] Multiple issues with mipmaps HOT 7
- Bug: Sprite alpha masks broken in chrome & edge HOT 7
- Bug: V8 text stroke is applied even with width 0. Also strokeThickness does not update at runtime
- Bug: [v8] double `onRender` of rendergroup? HOT 1
- Bug: Can't get updated worldTransform immediately
- Bug: [v8] arctifact when rendering big polygon with offscreen coordinates in Firefox and Safari HOT 4
- Is it possible to do a lossless rotation in Pixi?
- Bug: When forceCanvas is true, mask sprites with sprites doesn't work
- Bug: Some props like dropShadow and resolution are not updating for Text object.
- Bug: Generated Texture doesn't support scale mode since 8.1.0 HOT 2
- Bug: Events are firing twice when we have dynamic and static mode
- [bug] v8 NineSliceSprite doesnt works as mask on Sprite HOT 1
- Bug: v8 ESM is broken with esm.run HOT 4
- V8 Bug! HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from pixijs.