talamask

Actually the problem was that I was using Tiled version that was not fully supported by Phaser. Mine was too new, so to say, but when I installed some older version problem disappeared.

ok, so I got it working using generators so to go with iterative generation, it became much smoother.

it will not help since at some point I will still have to generate some new chunks and in the end I will notice a freeze. Web workers was also among my ideas, I was hoping there are some more out-of-the-phaser-box ways

I am making an endless terrain project. Each chunk is generated as canvas texture, and in update() function based on current player position I determine whether I need to create/draw new chunks, leave chunks as they are or delete them. Chunk colors are based on heights generated with simplex noise. My problem is that each chunk generation takes up to a second and if I do it straight in update() method game freezes until new chunk being generated, which gives me a noticeable freezes of entire game (see attached gif). If only there could be a way to generate them independently of game loop and add then only when they are ready to be added, like to run that generate function on a separate thread. So I have 2 questions: Is there a built-in methods in Phaser to deal with similar problems? If not how would you do it then?

by this.textures.remove(<name>)?

I kind of cannot understand why given example does not ends up with red texture. function modify(width, pixelSize) { let existingImage = this.textures.get("dude").getSourceImage(); let context = existingImage.getContext("2d"); for (var y = 0; y < width; y++) { for (var x = 0; x < width; x++) { context.fillStyle = "#f00"; context.fillRect(x * pixelSize, y * pixelSize, pixelSize, pixelSize); } } } I have checked that existingImage and context variables are populated ok, but calling this function does not produce desired result. Please assist.

Hello In Phaser 3.15 I am creating a texture using this.textures.generate passing an array of string arrays based on heights I generated with Perlin noise like this: create() { this.textures.generate("map", { data: textureMap, pixelWidth: 5, pixelHeight: 5, palette: palette }); this.add.image(0, 0, "map").setOrigin(0); } Result can be viewed in attachment. How can I regenerate this texture in update() function based on another textureMap data? I understand that it can be inefficient to do it each frame, but I just want to know how to do it. If I try directly to generate and add image with the same key Phaser complains that Texture key already in use: map Thank you!

Hi Is there any UI framework or maybe packages inside Phaser3 itself that allow to make some basic UI components? For example I want to visualize some king of list that is taller than my view port, so I would obviously need some kind of scrollable view, that can be scrolled with mouse. I found one for Phaser2, but is there any for Phaser3?

Here's my create() function. create() { const map = this.make.tilemap({key: "level_map"}); const tileset = map.addTilesetImage("Caves", "tiles"); const walls = map.createStaticLayer("walls", tileset, 0, 0); const decals = map.createStaticLayer("decals", tileset, 0, 0); // create player sprite this.player = this.physics.add.sprite(16*9, 16*23, "player"); // set collitions tiles by property walls.setCollisionByProperty({collides: true}); // show collision tiles with different color const debugGraphics = this.add.graphics().setAlpha(0.45); walls.renderDebug(debugGraphics, { tileColor: new Phaser.Display.Color(40, 255, 48, 255), // Color of non-colliding tiles collidingTileColor: new Phaser.Display.Color(243, 134, 48, 255), // Color of colliding tiles faceColor: new Phaser.Display.Color(40, 39, 37, 255) // Color of colliding face edges }); // setup physics this.physics.add.collider(this.player, walls); // cursors this.cursors = this.input.keyboard.createCursorKeys(); // camera this.camera = this.cameras.main; this.camera.startFollow(this.player); this.camera.setBounds(0, 0, map.widthInPixels, map.heightInPixels); } I load up a tilemap, read layers "walls" and "decals", set a collision by property and then add a collider of player to "walls". For me it seems that everything is ok. In Tiled I set up a "collides" bool variable and marked all impassible tiles as true, saved a level, exported JSON.. For debugging properties I even set up "walls.renderDebug" thing. And of course after I launch the game I get a screen filled with green areas and my player falling down through a level. One small note is that if I, instead of setCollisionByProperty use setCollisionBetween(1, 100) for example I do get some areas colored orange. So, what am I doing wring in my code? In attachement there is my JSON file, maybe something is wrong with it. level_02b64.json