• Content Count

  • Joined

  • Last visited

  1. tedex

    Technics to render a LOT of tiles

    Wow. Disabled antialiasing, I'm rendering 1kk+ tiles at 60fps. Wat. Looked the mipmap at the textures too, it was already enabled. @Fatalist @Exca Yes, i'm using pixi v4. I'll try some more technics and read the link you posted. For now I think my question was answered, rendering 1m+ tiles at 60fps is pretty damn cool, dont think I'll ever get close to this at a real project. Thanks alot!
  2. tedex

    Technics to render a LOT of tiles

    First of all, thanks for the reply! :3 Yes, I implemented culling myself, but i'm pretty sure pixi-tilemap does that too, disabling everything out of the render viewport. I tested ParticleContainer with sprites too, it was worst then pixitilemap implementation. I didn't knew about "enabling mipmaps" for texture atlas, I'll check those out. For now, how can I do that? I also will try disabling antialiasing and report the difference. PS: Thanks for the link, I'll read asap
  3. So... I'm playing around with pixi-tilemap and so ar it was the best performance implementation to render tiles 48x48. Unfortunately, when I implemented zoom support for the map I started dealing with something like 70k+ tiles for the screen (1920x1080 screen with stage.scale 0.1). And we're talking just one layer. I've read alot about this idea but I would like to hear what you all have to say and suggest, and maybe some examples. Relevant reads I've already looked - http://gamedev.stackexchange.com/questions/15612/howd-they-do-it-millions-of-tiles-in-terraria - http://evilmousestudios.com/optimizing-javascript-games/ - http://www.html5gamedevs.com/topic/6901-large-tile-maps/ - http://www.html5gamedevs.com/topic/16001-how-should-i-render-a-tile-map/ I know its retarded to render everything over and over again, juts want some help to point me to the right direction. I also tryed to add chunk support for the update function, trying to make a chunk texture so I would not need to loop through all of tiles once they have already been genereated (procedurally). Unfortunately, my implementation was garbage and I was not able to make it work. So far, I have sothing like this for the draw /* Not tested, exemplifying */ var stage = new DisplayObjectContainer(); var map = new DisplayObjectContainer(); var tilemap = new PIXI.tilemap.CompositeRectTileLayer(0, [], true); stage.scale.set(0.1); for(var y = 0; y < 500; y++) { for(var x = 0; x < 500; x++) { tilemap.addFrame(noisedTexture, x*48, y*48 ); } } map.addChild(tilemap);
  4. First of all, sorry for my english. I just started with Pixi and was studying tilemaps, but I'm having gaps between the tiles whenever I scale by the factor of 0.01. Yes, i'm using PIXI.SCALE_MODES.DEFAULT = PIXI.SCALE_MODES.NEAREST; Here's what I I've got: PIXI.SCALE_MODES.DEFAULT = PIXI.SCALE_MODES.NEAREST; PIXI.loader .add('tileset', 'img/tileset.json') .load(setupMap); function setupMap() { var mapData = []; // Omitting bidimensional array with tiles for the sake of the example var map = new Container; var tilemap = new PIXI.tilemap.CompositeRectTileLayer(0, [], true); for(var coll = 0; coll < 100 * 48; coll++) { for(var row = 0; row < 100 * 48; row++) { if(mapData.hasOwnProperty(coll) && mapData[coll].hasOwnProperty(row)) { tilemap.addFrame(tileset.textures[mapData[coll][row]], coll*48, row*48); } else { break; } } } map.addChild(tilemap); stage.addChild(map); } // This fucks up everything document.addEventListener('mousewheel', mousewheel, false); document.addEventListener('DOMMouseScroll', mousewheel, false); function mousewheel(e) { var zoomOut = e.wheelDelta <= 0; map.scale.set(map.scale.x + (zoomOut ? -0.01 : 0.01)); }