Leaderboard

Hello all, thanks for taking time to read my post. I have an app where users draw shapes in an SVG editor to create objects. Then the shapes are rendered in Pixi to create an animation. We used to do the animation in SVG land but Pixi has better performance. The main issue I'm having right now is my rounded rect corners are not coming out smooth when I try to display in Pixi via the Graphics object, and we have also tried to rasterize the SVG to an image. This is the SVG editor where users create shapes and place them to create objects And this is what Pix

Hello, just wanted to share some of the progress on a HTML5 MMORPG game I'm developing. It's still in early stages and progressing well. It's called Elvarion. Here's a sneak peak video of the smooth per pixel movement, attack from a projectile generated server side with particle effects. Technology used Animations - PIXI.js animations (been thinking about Spine... but maybe later) Rendering - PIXI.js - PIXI.js particle effects - WebGL Sound - Howler Language - Javascript and Node Map Editor - Tiled Network - Socket.io - Nengi.js DB - MongoDB You can

https://pixijs.io/examples/#/interaction/custom-hitarea.js

Giving the container a hitArea

Adsense > Rewarded Ads - Does it exist yet? I have been searching left and right and haven't been able to find much info about this. I see some good games with ingame Admob Rewarded ads, but I can't find any info about the web variant, there must be a huge market for this so It's a bit strange? Looking forward to some info from the pros in here

I think right now the best for me is to switch back, and after version 6.1.0 gets available I will again try to upgrade the pixi verison. Thanks

6.1.0 will have new typings, with LoaderResource you can try ILoaderResource for now . As for dictionary - Dict<ILoaderResource> , where Dict is from pixi utils.

clone() exists in Texture, it does not clone the actual surface, its cloning only rects and rotation. operations like clone() aren't possible without specifying renderer, because RT actually contains links to webgl objects to be copied. Copying a webgl texture is possible with several operations. If you dont know webgl internals, well, the best way is just to render a sprite with that texture to another renderTexture. However you can request that feature in pixijs github and maybe assign it a bounty.

Yes, it was simple. Add two more parameters to tilemap (options.anchorX and options.anchorY) then put the X and Y with the following modification (tileWidth and tile Height already have the scale alteration): pb.push(x - tileWidth * anchorX); pb.push(y - tileHeight * anchorY); And ok, I'll see Freya Holmer. Thanks again for your help.

Ready, I did it: D Just add one more parameter (options.scale). 1. Add scale in options params. 2. Multiply that scale by tileWidth and tileHeight 3. Put scale in points. 4. Create a new element "SCALE" in the enum "POINT_STRUCT" 5. Add an "aScale" attribute in tilemap.vert and TilemapGeometry and set the vertSize variable to 14, also pass aScale as vScale in tilemap.vert. 6. Add a varying "vScale" in tilemap.frag. 7. In shaderGenerator divide 1.0 / vScale and multiply that value by uSamplerSize. textureCoord * uSamplerSize [$ {i}] * (1.0 / vScale) 8. Finally add my sca

You were right. That solved the problem! I add it in the setting about MIME types on server. Thanks a lot. https://stackoverflow.com/questions/55740558/get-404-not-found-for-webp-images-on-the-website

> It may be because of the .webp extension, but why it works locally? something about mime types on server probably

Hi This is a short tutorial on which will help you on how you can organize states and basic structure in your game for Phaser 2 https://www.emanueleferonato.com/2014/08/28/phaser-tutorial-understanding-phaser-states/

By porting we mean a process where games made for particular platforms can become compatible to run seamlessly on other devices being preferred by the users. Game porting services are used by studios mainly to convert games from various platforms such as mobile to facebook, or between operating systems like iOS to Android etc. In addition to this, porting services also help in releasing new and updated versions of older games. For example games which have been created earlier using Flash can be replaced with upgraded platforms like HTML5. For more information read: What is the

Ok, my bad, is working now. I hadnt set interactive, i had a spelling error sorry

Hey guys! Here is a solution for this question: function recordVideoWithCCapture(){ const videoContainer = document.getElementById('recordContainer'); // Modern let capturer = null; const isFirefox = navigator.userAgent.toLowerCase().indexOf('firefox') > -1; const options = { FirefoxFramerate: 120, FirefoxQuality: 100, ChromeFramerate: 30, ChromeQuality: 99.9, } function initRecording(){ capturer = new CCapture( { //verbose: true, // print info to console display: true, // display record info //motio

Ahh, that's the key I was missing -- I had tried using filter pixel coords, but I was using them for everything including the vTextureCoord. Using them to just tell where the filter should start and stop is the correct thing to do. Also thanks for the example! I'd been looking for something similar, but Google didn't surface this page well enough. i like the implementation here better than what I have too. Thanks so much for the help!

I got it. On click event, I run window.open(link, "__blank")

@ivan.popelyshev Yeah, thanks for the explanation. I will use it with pixi-layers as i am using this lib for my game. Thanks for your instant reply. 🙂 Have a nice day

Its re-used, so its actually the same the only difference is if you can detect that polygon was changed, i dont think it affects performance

> I tried Graphics hole, it was working but not always, sometimes holes disapear for some reason. if hole intersects the outer hull - it wont go well. the best way is to do the layering. Example1 : create a full screen render texture , render black rect there, with white light on it. Place a sprite with this texture and corresponding blendMode Example2: create a container that will be shown on top of your world. set its filters to [new PIXI.filters.AlphaFilter()]. add graphics in it, as usual: black rect and lights. set "container.filters[0].blendMode = MULTIPL

That looks cool!

Hello. Hope you are doing well. I would like to assist you with your requirement, please reach me at seth@cisinlabs.com to discuss further. Regards! Seth R

The graphics are awesome, especially for JavaScript. Keep it up!

we have new package for graphics with lines: https://github.com/pixijs/graphics-smooth as for general issue of "there are 500 of them!!!" , that's a big topic. Did you by change found any of my explanations regarding "high-level vs low-level algorithms? ? I'm not feeling well enough to post all that again. > Is there a faster way of doing it, such as drawing all the flakes as one large Graphics object with 500 lines, use sprites, shaders or some other magic chop I can do to relieve the stress? The best way is if you know how to make mesh geometry that you modify every

Defold is a cross platform game engine with good support for HTML5 games. The Defold Foundation recently partnered with Game Distribution to simplify the process of developing and releasing games for Game Distribution using Defold. GameDistribution is the biggest broker of high quality, cross-platform games and their network serves over 300M users a month with top HTML5 content. In this blog post we’ll look at how to add the Game Distribution SDK to an existing game or how to create one from scratch. We will also look at how to submit your game for distribution through the Game Distributi

Hello all game devs out there it is so good to see you. I want to share a passion project that I started working on that is long over due from my side. I have been thinking and tinkering on this project for roughly 10 years but mostly in my mind. One is that I didn't believe the technology was there until now, and secondly I am a procrastinating black-belt master. So what is this idea I have that never comes to fruition? The website is called HTML2D, HTML2D will be a mixture of an HTML5 Arcade game site with the main core concept that the player keeps playing the same protagonist(s

Just want to highlight that Unity will bring some great changes for WebGL in there 2021.2 build. With greatly reduced WebGL builds some claim on the forum going from 2.4 Mb to 9 Mb And according to jukka_j: According to preliminary benchmarks, build sizes are shrunk by about ~-10%, build times are reduced by ~-40%, and memory usage is reduced by about ~-8%. They are also working on mobile support for WebGL builds.

That's typings issue, right? just "as any" it and report to pixijs github issues same with baseTexture, just "as any".

There is nothing PIXI itself can do. The only way to get full screen on ios if for the user to scroll down the webpage. Get this page on your iphone for example, scroll down the comments and you see the URL bar disappear. You need to simulate this. Tip on this; compare $( window ).height() to window.innerHeight. You'll see a difference on iphones if the device is 'full screen' after scrolling or not. If the device is _not_ fullscreen, show a div that's height is much taller than the game, with an image or text instructing the player to 'swipe up' the screen. They will scroll across t

What is commonly done is that a 2nd tilemap is created whose sole purpose is to deal with collisions. This collision tilemap just holds information about where collisions will occur and what type of tile the collision is. Then when you move the player, you just check where the player is going against the collision tilemap and if the tile the player is moving into has a tile, you can check what type of tile and respond accordingly. So for example, let's say you have a room surrounded by walls (represented by tile #1) with a river of lava through it (represented by tile #2) and any tile that d

I could probably save you a lot of time. BoosterMedia has more 100+ mobile gaming portals around the world! :-) If you have any good games for mobile/tablet browsers, talk to me! Examples would be: m.roundgames.com m.clickjogos.uol.com.br m.jeux.com ...and more!