Search the Community
Showing results for tags 'disappearing'.
Found 3 results
-
Hey guys, So I have had the chance to delve a little bit more into Babylon.js and I really find it great. I am developing an online multiplayer game on it and while testing I have encountered a strange problem. So I have this simple terrain and a mesh which moves on a pick event. I have integrated Babylon-navmash extension and so far it has been working great. What seems a little strange to me is that sometimes the mesh disappears from the screen ( in movement ) only to reappear again some frames later. In other cases it stops while being invisible. When I have a camera with it as a target, the camera itself shows a blue screen when the mesh disappears. I think probably its a render problem. I am not sure though. Any thoughts ? Since the camera loses the target after it disappears I don't think its camera related but...again, I am not sure. On a further note, I am not using physics neither collisions just some ray picking. And I am also using a shadow map with a texture of 512 size. I am rendering only the shadows of this mesh, for the static ones most surely I will bake the shadow maps. Thanks again for this awesome tool! Best Regards, Relative Null.
-
Hello guys, I have a problem related with material swapping and asynchronous texture loading. I have a tiled map, and when zooming in the visible tiles swap to a material with a higher resolution image texture. The thing is, the tiled map I have is pretty huge, it has lots of tiles and the images are heavy. What I did until now is just initializing all the materials and textures during the loading screen, loading both the low and the high resolution tile images. Then, the tile swapping works really smooth and is practically unnoticeable. The problem is, for big scenes it takes just too much time loading all these images at the start. So lurking around the babylon.js source code, I've found the flag useDelayedTextureLoading in the Scene class. I use scene.useDelayedTextureLoading = true, and still initialize the textures at the beginning (which is really fast now, of course), but the images are actually loaded when they are really needed (when swapping the tiles), which is cool. The thing is, the swapping is not that smooth now, the tile material "disappears" for a fraction of second and then appears with a new, higher resolution. Having multiple tiles disappearing almost at the same time is very noticeable. I've set up a demo here. It's a very simplified version of what I have, but you should see the tiles disappearing for a moment when zooming in the camera for the first time: http://www.babylonjs-playground.com/#1XBLWB#116 So I tried to solve this in this way: Create a "buffer" mesh, hidden somewhere under the map and when it's time to switch a tile with a higher resolution image I apply the material on the buffer mesh first, so the "special effect" of the disappearing material takes place there. Then, once the texture is fully loaded, I would use the texture.onLoad() method and apply the loaded texture on the right tile. But... it looks like when scene.useDelayedTextureLoading flag is set to true, the Texture constructor callbacks onLoad and onError are ignored?.. So.. I thought it was time to ask you for advice . Maybe you have an idea of how can I fix my solution, or you can come up with a different solution, anything would help. Maybe I'm just complicating the whole thing too much. Thanks!!
-
I am currently making my first game in phaser, where a fish bounces around the screen and eats fish that you spawn in yourself. I am having 2 issues. First off when he bounces off the walls the walls move and occasionally disappear and also when you spawn more than one fish only the most recent fish will be eaten. Here's my code: <!doctype html> <html lang="en"> <head> <meta charset="UTF-8" /><title>Fishtank Game</title><script type="text/javascript" src="js/phaser.min.js"></script> <style type="text/css"> body { margin: 0; } </style></head><body> <script type="text/javascript"> var game = new Phaser.Game(800, 600, Phaser.AUTO, '', { preload: preload, create: create, update: update }); function preload() {game.load.image('water', 'assets/water1.png');game.load.image('fish', 'assets/fish.png');game.load.image('wall', 'assets/hidden wall.png');game.load.image('wall2', 'assets/wall flipped.png');game.load.image('smallfish', 'assets/smallfish.png'); var begin = true; var fish;var wallRight;var wallLeft;var smallFish; var createKey; //var fishAngles = ['-100', '100', '-150', '150', '-200', '200', '-250', '250', '-300', '300'];//var angle = fishAngles[Math.floor(Math.random()*fishAngles.length)]; } function create() { smallFish = 'smallfish'; createKey = game.input.keyboard.addKey(Phaser.Keyboard. ; game.physics.startSystem(Phaser.Physics.ARCADE); game.physics.arcade.checkCollision.down = true; game.add.sprite(0,0, 'water'); wallRight = game.add.sprite(799, 0, 'wall'); game.physics.enable(wallRight, Phaser.Physics.ARCADE); wallRight.body.bounce.set(1); wallLeft = game.add.sprite(-80, 0, 'wall'); game.physics.enable(wallLeft, Phaser.Physics.ARCADE); wallLeft.body.bounce.set(1); ceiling = game.add.sprite(0, -80, 'wall2'); game.physics.enable(ceiling, Phaser.Physics.ARCADE); ceiling.body.bounce.set(1); floor = game.add.sprite(0, 599, 'wall2'); game.physics.enable(floor, Phaser.Physics.ARCADE); floor.body.bounce.set(1); fish = game.add.sprite(0, 250, 'fish');fish.anchor.set(0.5);fish.checkWorldBounds = true; game.physics.enable(fish, Phaser.Physics.ARCADE); fish.body.collideWorldBounds = true;fish.body.bounce.set(1); game.input.onDown.add(releasefish, this); createKey.onDown.add(creation, this); } function creation () { smallFish = game.add.sprite(300, 400, 'smallfish');smallFish.anchor.set(0.5);smallFish.checkWorldBounds = true; game.physics.enable(smallFish, Phaser.Physics.ARCADE); smallFish.body.collideWorldBounds = true;smallFish.body.bounce.set(1); smallFish.body.velocity.x = 300;smallFish.body.velocity.y = 400;} function releasefish () { if(begin = true){begin = false;fish.body.velocity.y = -500 - Math.random();fish.body.velocity.x = -300 - Math.random(); wallLeft.x = -79;wallRight.x = 799;ceiling.y = -80;floor.y = 599;}} function update() { game.physics.arcade.collide(fish, wallRight, fishHitRight, null, this);game.physics.arcade.collide(fish, wallLeft, fishHitLeft, null, this);game.physics.arcade.collide(fish, ceiling, fishHitCeiling, null, this);game.physics.arcade.collide(fish, floor, fishHitFloor, null, this); game.physics.arcade.collide(smallFish, wallRight, smallFishHitRight, null, this);game.physics.arcade.collide(smallFish, wallLeft, smallFishHitLeft, null, this);//game.physics.arcade.collide(smallFish, ceiling, smallFishHitCeiling, null, this);//game.physics.arcade.collide(smallFish, floor, smallFishHitFloor, null, this); game.physics.arcade.collide(fish, smallFish, eating, null, this);} function fishHitRight() { var diff = 0; fish.scale.x = -1;wallLeft.x = -80;ceiling.y = -80;floor.y = 599; if (fish.y < wallRight.y) { diff = wallRight.y - fish.y; fish.body.velocity.y = (-2 * diff + Math.random()); }else if (fish.y > wallRight.y) { diff = fish.y - wallRight.y; fish.body.velocity.y = (2 * diff - Math.random()); }else { fish.body.velocity.y = 2 + Math.random() * 12; }} function fishHitLeft() { var diff = 0; fish.scale.x = 1;wallRight.x = 799;ceiling.y = -80;floor.y = 599; if (fish.y < wallLeft.y) { diff = wallLeft.y - fish.y; fish.body.velocity.y = (2 * diff - Math.random()); }else if (fish.y > wallLeft.y) { diff = fish.y - wallLeft.y; fish.body.velocity.y = (-2 * diff + Math.random()); }else { fish.body.velocity.y = 2 + Math.random() * 12; } } function fishHitCeiling() { var diff = 0; wallLeft.x = -80;wallRight.x = 799;floor.y = 599; if (fish.x < ceiling.x) { diff = ceiling.x - fish.x; fish.body.velocity.x = (-2 * diff + Math.random()); }else if (fish.x > ceiling.x) { diff = fish.x - ceiling.x; fish.body.velocity.x = (2 * diff - Math.random()); }else { fish.body.velocity.x = 2 + Math.random() * 12; }} function fishHitFloor() { var diff = 0; wallLeft.x = -80;wallRight.x = 799;ceiling.y = -80; if (fish.x < floor.x) { diff = floor.x - fish.x; fish.body.velocity.x = (-2 * diff + Math.random()); }else if (fish.x > floor.x) { diff = fish.x - floor.x; fish.body.velocity.x = (2 * diff - Math.random()); }else { fish.body.velocity.x = 2 + Math.random() * 12; }} function smallFishHitRight() { smallFish.scale.x = -1;wallLeft.x = -80;} function smallFishHitLeft() { smallFish.scale.x = 1;wallRight.x = 799; } function eating(fish, smallfish) { smallFish.kill();} </script> </body></html>
