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: the demo links can't open
- Feature Request: caching bitmap fonts in client? HOT 11
- Bug: Cannot read property 'getExtension' of undefined
- Bug: [v8] `text.style.fill === null` when `TextStyle` is reused instead of `TextStyleOptions` HOT 2
- Bug: [v8] BpuBufferSystem.onBufferDestroy contains null gpuBuffer when destroying via react hook HOT 3
- Bug: [v8 regression] pointerevents can drastically cut performance HOT 2
- Is there a way to simulate 3d projection/rotation in Pixi v8
- Bug: [v8.0.2] Sprite not updated correctly when its texture's frame is changed HOT 1
- Bug: [v8 regression] `Container.destroy()` is very slow on crowded containers HOT 3
- Bug: Publishing v7.x doesn't update latest dist-tags
- Bug: [v8 regression] moving a crowded `Container` drastically cuts performance HOT 8
- Bug: [v8] When adding `onRender` to a class extension, it does not work as expected
- Feature Request: [v8] Is there any way to pass a canvas instance to the new WebGLRenderer? HOT 2
- Bug: export image empty on firefox
- Bug: v8 Using webcam stream as source errors in Chrome
- Bug: [v8] passing `fill(0)` or `fill(0x000000)` to graphics shows white instead of black
- Q: [v8] Should release `@pixi/unsafe-eval@8`? HOT 3
- Bug: [v8] The filter is not taking the RenderTexture's frame's offset into account when being applied HOT 1
- Bug: Fill hex for black produces unpredictable results HOT 1
- Bug: Could not render app.canvas to normal canvas correctly in Windows chrome
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.