All Activity

This stream auto-updates     

  1. Past hour
  2. Hello! I want to use png image as a height map for an isometric pixel game. I don't need to display it. I only need to load it and read pixel values in form of [r,g,b,a]. There are libs like png.js, which has png.getPixel(x,y). But I believe PIXI already has all I need for that. How can I do it? Instance of what class should I use? Or is there a way to convert a png image to a typed array? Or may be all this is a bad idea?
  3. Today
  4. You can use touchstart and touchend to track if user is holding down. Or pointerdown and pointerup.
  5. There is no such thing as pointerover for touch. It's the equivalent of mouseover, where you hover the cursor over an area but don't select it. Touch doesn't have that. Either you've pressed it or not.
  6. If you use projection for any kind of... projections , not just for ISO stuff, then I doubt it will work with canvas. otherwise just make "renderer.plugins['sprite2d'] = renderer.plugins['sprite'];"
  7. I'm totally new to pixijs and to game development in general. I need a help in fixing this error in devices that use canvas if webGL is not available. Im using projection plugin and it is seems like the error is from projection.sprite2d. I am researching about the issue and found PIXI.CanvasRenderer.registerPlugin but don't know how to use it. please help I'm stuck with this issue. TIA
  8. After a lot of googling I've fixed the problem with adding crossOrigin: true .add('tile_lumber', getImagePath('tile_lumber.svg'), { crossOrigin: true }) I have no idea what crossOrigin does or how it works but it seems to have solved the problem. I got the answer from If the problem occurs again, I'll post here.
  9. Please provide more information , my telepathy doesn't work on the words you wrote. @themoonrat is our pointer-master
  10. If you have too many canvases so that webgl context amount starts to break, you could use some canvases in 2d context. Also one thing that would need to be kept in mind is that only rerender the contexts that area actually visible / need rerendering, that way you can keep the performance hit at minimum. Custom application/render loop is something that you need in any case, as pointed out already by Ivan.
  11. I want to be a touch-like game, the pointerover on the mobile side has no effect.
  12. bubamara

    Low fps particles

    Now I have noticed you have these two in ticker loop : this.app.renderer.resize(window.innerWidth, window.innerHeight); this.mouse = this.app.renderer.plugins.interaction.mouse.global; Move them out of loop and resize the app on event to keep animate() as simple as possible animate() { this.app.ticker.add(() => { stats.begin(); this.particles.forEach(p => { p.update(this.mouse); }); stats.end(); }); }
  13. Yesterday
  14. Alain

    Low fps particles

    I'm using Firefox Dev Edition with Windows 10 and this is the result
  15. bubamara

    Low fps particles

    Hmm, for me it's a lot faster on Chrome (both Mac & Win), not so visible speed gain on Safari/Mac. On the other hand you're rendering ±100k sprites... edit: added screens
  16. Alain

    Low fps particles

    I changed the method, but the problem still persists. https://codepen.io/AlainBarrios/pen/MRXJxg
  17. Thanks, I really appreciate it! New cartoon-style texture images are ready here: TXR – BRICK - Cartoon https://soundimage.org/txr-brick-cartoon/ TXR – CONCRETE / PAVEMENT - Cartoon https://soundimage.org/txr-concrete-pavement-cartoon/ TXR – GROUND – Cartoon https://soundimage.org/txr-ground-cartoon/ TXR – METAL – Cartoon https://soundimage.org/txr-metal-cartoon/ TXR – WOOD – Cartoon https://soundimage.org/txr-wood-cartoon/ I hope some of them come in handy!
  18. From someone who is looking at transitioning from Phaser to Pixi and was looking at this exact question, thanks @ivan.popelyshev for answering this (and many other) Pixi questions!
  19. @ivan.popelyshev I had removed caching thus fixed the problem (sort of) But now I wanted my game to be faster thus I'm trying to cache everything. This problem is back. I'm digging deeper into what is going on, so far what I have found is - This bug happens only on chromium browsers (chrome, brave etc..) - This bug happens only when using webGL rendering not canvas: https://youtu.be/9oTXm5ejWWY I'm looking deeper into how renderers work but I lack a lot of knowledge. I might create a standalone project which reproduces the bug. I'll post here if I do.
  20. Some time ago there was a bug report of a problem with rendering SVGs in iOS and MacOS, at least older ones. You can see it there: https://github.com/pixijs/pixi.js/issues/3433, but here is a short description as far as I've digged it. On some old Apple devices, iPad 4 / iOS 10 for me, if you load a number of SVGs, make sprites of them and place said sprites on stage, some of these sprites will 'leak' on one another. For example, if you load a green rectangle SVG and then blue circle SVG, sprite made from second one will contain expected circle drawn above unexpected rectangle. This is an old bug still found in v5.0.0 rc-3. Sadly, I found no solution to it. There are cases when it shows and cases when it doesn't, but no way to be sure. Since it is crusial for the project I'm working on, I've made a short test code to check if the current device have this bug, so I can switch to PNGs. In case anyone needs this, you can see it below. It is written for Pixi v5.0.0 rc-3 https://codepen.io/takopus/pen/EJpjXL The idea is simple: I load assets - rectangle and circle - make sprites, place them on stage and render it (you have to do it to catch the bug). Then I extract circle into Uint8ClampedArray of pixels and get alpha value of some corner pixel. If there is no bug, it will be 0 (since there is no pixel there). If the bug is here, it will be 255 cause of rectangle rendered below the circle. Hope this will help someone until this bug gets fixed!
  21. Hi Lanak, Try this: var windowWidth = window.innerWidth; var widnowHeight = window.innerHeight; this.bg = this.add.image(windowWidth / 2, widnowHeight / 2, 'sky'); this.bg.setDisplaySize(windowWidth, widnowHeight); Good Luck, Roy
  22. If the issue persists: https://developers.facebook.com/support/bugs/
  23. Thanks! I'm using Typescript, and the default callback parameter was of type DisplayObject so I was not finding stopPropagation(). Ie. : mySprite.on('click', function (ev) { }); Forcing an InteractionEvent type worked mySprite.on('click', function (ev: PIXI.interaction.InteractionEvent) { ev.stopPropagation(); });
  1. Load more activity