InsOp Posted September 20, 2015 Share Posted September 20, 2015 hey i made a background just like in that example: http://phaser.io/examples/v2/loader/load-tilemap-json now i have like waterfields and i want them to be animated,how do i achieve this (with this method)? Link to comment Share on other sites More sharing options...
piotr Posted September 20, 2015 Share Posted September 20, 2015 Have you already checked this example for tile-based water animation?http://phaser.io/examples/v2/tile-sprites/tile-sprite-from-animated-sprite Link to comment Share on other sites More sharing options...
InsOp Posted September 20, 2015 Author Share Posted September 20, 2015 Sorry I dont see how i can apply your example to my example Link to comment Share on other sites More sharing options...
InsOp Posted October 8, 2015 Author Share Posted October 8, 2015 is this even possible to achieve? does anyone know? ive done it now like this:// in game.create:setInterval(map.animateWater, 100);//in my map object waterTiles:[26,27,28,29,30,31], waterTileIndex:0, animateWater : function(){ var mapTiles = game.layer0.layer.data; var index; //screenSpritesCountW: tiles visible in screen (width) for(var x = 0; x < map.screenSpritesCountW +1; x++){ for (var y = 0; y < map.screenSpritesCountH +1; y++) { //offsetY: offset from y=0 in tiles var m = mapTiles[y+map.offsetY][x+map.offsetX]; index = map.waterTiles.indexOf(m.index); index++; index %= map.waterTiles.length; //finally changing the tileface m.index = map.waterTiles[index]; } } //trigger the stagerendering game.layer0.dirty = true; },I dont know whether this is efficient, since all tilemaps get new indices (not only those who are in the camera view) is there a better way to achieve this? edit: I was able to reduce the cost a little - i only recalculate those water tiles which are currently visible - still having 10-15 fps less Link to comment Share on other sites More sharing options...
jmp909 Posted October 9, 2015 Share Posted October 9, 2015 * maybe in your create() function, loop through your map and store an array mapWaterTiles[] of *just* the water tiles.. you don't want to have to loop through the whole map on each frame. * if you know the x & y position of each tile in your mapWaterTiles[] array you should be able to work out which of those are on screen... only animate those (which I think you started to do) * length is supposedly a slow function.. keep a variable containing this value, then you don't need to keep doing a lookup. (it's in the last but one point here http://www.html5gamedevs.com/topic/9931-mobile-performance-tips-tricks/) however I'm wondering if that 'length' issue was specfically about DOM objects eg http://jonraasch.com/blog/10-javascript-performance-boosting-tips-from-nicholas-zakas .. compared to my example here http://jsfiddle.net/j5csge2z/4/ .. so i'm not actually sure about this.. the best thing to do is run your own Phaser-specific test Link to comment Share on other sites More sharing options...
jmp909 Posted October 9, 2015 Share Posted October 9, 2015 actually I think this is what you're looking for (although it looks slightly broken)http://examples.phaser.io/_site/view_full.html?d=tilemaps&f=create+from+objects.js&t=create%20from%20objects juandelossantos 1 Link to comment Share on other sites More sharing options...
Skeptron Posted October 9, 2015 Share Posted October 9, 2015 Maybe this plugin could be your solution : https://github.com/englercj/phaser-tiled#why-use-this-plugin See original post : http://www.html5gamedevs.com/topic/9573-phaser-tiled-plugin/ Link to comment Share on other sites More sharing options...
InsOp Posted October 10, 2015 Author Share Posted October 10, 2015 I finally had the chance to test those two proposals. to jmp909:I would have to completely restructure my map.json, since its a different type of layer.Half of my map is water and i feel `createFromObjects` is not supposed to be used in such vast amounts. to Skeptron:I think this is what Im needing, unfortunately its not compatible to the current phaser version i have to wait until Chad Engler has time again for this Link to comment Share on other sites More sharing options...
jmp909 Posted October 10, 2015 Share Posted October 10, 2015 i would check how fast swap/replace tiles works:http://phaser.io/examples/v2/tilemaps/swap-tileshttp://phaser.io/examples/v2/tilemaps/replace-tiles i know off-screen tiles aren't rendered so those might just have their references updatedhttp://www.html5gamedevs.com/topic/9356-how-are-huge-tilemaps-being-painted/?p=55409 Link to comment Share on other sites More sharing options...
InsOp Posted October 10, 2015 Author Share Posted October 10, 2015 thanks I did try that, even with a given smaller area its far too slow - i checked the replace function and what it does is just what im doing manually, but significantly slower.. Link to comment Share on other sites More sharing options...
juandelossantos Posted September 26, 2017 Share Posted September 26, 2017 On 8/10/2015 at 11:54 PM, jmp909 said: actually I think this is what you're looking for (although it looks slightly broken) http://examples.phaser.io/_site/view_full.html?d=tilemaps&f=create+from+objects.js&t=create%20from%20objects Thanks, I had the same doubt, with this example, I found the solution! Link to comment Share on other sites More sharing options...
colinvella Posted November 1, 2017 Share Posted November 1, 2017 Just a shameless plug for my own library, but you might want to try out this: https://www.npmjs.com/package/phaser-tilemap-plus It plugs into your code without requiring changes to how you load your map, however, you can enable tile animations with a simple call, like so: game.tilemap.plus.animation.enable(); The plugin also supports sloped and curved tile collisions and other features are planned. Link to comment Share on other sites More sharing options...
Recommended Posts