1 Reply Latest reply on Jul 6, 2012 5:03 AM by Ned Murphy

    Creating Tile Map in Efficient way

    robi90

      Hello ,

       

       

      I'm creating a platform game, and the levels are made with tiles. Well, i need my game will handle map of something like 5000X450 pixels... so it handle it.. but in 12 FPS. The problem is in my algorithm.. i'm rendering too much movieclips that takes place as a tile. So.. after a lot of research.. i saw the BitmapData solution.. and after a lot of frustration and failures i come here to try my luck.

       

       

      So my new algorithm using BitmapData is to use draw() and attachBitmap() to draw the bitmapdata inside the MC container. This work fine.. But the problem is i don't know how to set the X and Y position of the bitmaps inside the MC container and the bitmaps are staying in (0,0).

       

       

      Please help me, I have been breaking my head on this.

       

       

      UPDATE: Someone told me about copyPixels but i didn't get it.

      This is how my code looks like:

       

      import flash.display.BitmapData;

      import flash.geom.Rectangle;

      import flash.geom.Point;

       

       

      var map:Array = [

                                               [1,1,1,1,1,1,1,1,1,1],

                                               [1,1,1,1,1,1,1,1,1,1],

                                               [1,1,1,1,1,1,1,1,1,1],

                                               [1,1,1,1,1,1,1,1,1,1],

                                               [1,1,1,1,1,1,1,1,1,1]];

       

       

      var tile:MovieClip = _root.attachMovie("tile", "tile", _root.getNextHighestDepth(), {_x:150, _y:0});

      var ground:MovieClip = _root.createEmptyMovieClip("ground", _root.getNextHighestDepth());

       

       

      var bitmapData:BitmapData = new BitmapData(tile._width, tile._height);

      bitmapData.draw(tile);

       

       

      function createMap(map)

      {

                var mapWidth = map[0].length;

                var mapHeight = map.length;

                for (var i = 0; i < mapHeight; ++i) {

                            for (var j = 0; j < mapWidth; ++j) {

                                    ground.attachBitmap(bitmapData, _root.getNextHighestDepth());

                                    // Here I want to make the bitmaps move

                              // bitmap._x = ((j*tile._width)+5);

                  // bitmap._y = ((i*tile._height)+5);

                          }

                }

      }

       

       

      createMap(map);

        • 1. Re: Creating Tile Map in Efficient way
          Ned Murphy Adobe Community Professional & MVP

          Based on what the help documentation says, you cannot modify a bitmap after the attachBitmap method has been executed.  But you can add the bitmaps to another movieclip within the ground and manipulate those movieclips' positions...

           

          function createMap(map)
          {
             var mapWidth = map[0].length;
             var mapHeight = map.length;

             for (var i = 0; i < mapHeight; ++i) {
                 for (var j = 0; j < mapWidth; ++j) {
                    ground.createEmptyMovieClip("ground"+i+j, ground.getNextHighestDepth())
                    ground["ground"+i+j].attachBitmap(bitmapData, ground["ground"+i+j].getNextHighestDepth());
                    ground["ground"+i+j]._x = ((j*tile._width)+5);
                    ground["ground"+i+j]._y = ((i*tile._height)+5);
                 }
             }
          }