html5 - createJS caching tilemap background does not render -

If I do not cache the containers of the tiles after the map, then I can see them for canvas:

  function vs world () {background = new createj.Container (); (Var y = 0; y & lt; mapWidth; y ++) {for (var x = 0; x & lt; mapHeight; x ++) {var tile = new createjs.Bitmap ('images / tile.png '); Tile X = x * 28; Tile.y = y * 30; Background.addChild (tile); }} //background.cache(0, 0, map width, maphite); Stage.addChild (background); }  

If I cache tile children's background containers, it will not render

  create the function () {background = new createj.Container (); (Var y = 0; y & lt; mapWidth; y ++) {for (var x = 0; x & lt; mapHeight; x ++) {var tile = new createjs.Bitmap ('images / tile.png '); Tile X = x * 28; Tile.y = y * 30; Background.addChild (tile); }} Background.cache (0, 0, mapguide, maphite); Stage.addChild (background); }  

Why?

This is probably because the synchronization is not available for images when pre-loaded If you use the path to create them, if you are not caching them, they will not be displayed immediately when the platform is updated - but if you press the step, they can load immediately (They take only one frame).

I advise you to preload them, either internally, or use something like PreloadJS instead, instead of loading the example instead of the bitmap.

  var img = document.createElement ("img"); Img.onload = Draw; Img.src = "picture / tile.png"; Function Draw () {// Loop Wiire BMP = new createjs.Bitmap (IMG); // Using a reference instead of a path}  

Note that this also reduces over the ground, since only one image has been created, and all the bitmaps have to do it Share a reference for.

If all your tiles are doing the same, you may want to see the Graphics.beginBitmapFill () method.