How to dynamically load a tmx from the server?

eydamson · June 30, 2016, 3:29am

Hi
we are making a tiled map in our game but the tmx files are on the server…
we load these tmx files but we are getting a string version of these files…
we try

cc.load.('url.tmx',cc.TiledMap,function(err,tiledMap){
    cc.log(tiledMap)// logs string file of this tmx file
});

zhangbin · July 1, 2016, 2:23am

First, please put your tmx assets into assets/resources folder.

Then, you can load the map by code like this:

    // get the TiledMap component
    var theMap = this.node.getComponent(cc.TiledMap);

    // load the tmx file by loadRes interface (iso-test means: load the file 'assets/resources/iso-test.tmx ' )
    cc.loader.loadRes('iso-test', function(err, map) {
        // the tmx asset is loaded, update the property 'tmxAsset' of map.
        theMap.tmxAsset = map;
    });

eydamson · July 1, 2016, 3:00am

@zhangbin my assets are on the server…
when i try to load the tmx file from the server it gives the xml string version of my tmx file…

is there a way to instantiate a TmxAsset using the string version of the txm file?..

zhangbin · July 1, 2016, 5:57am

@eydamson
I’m sorry there isn’t a interface to load TiledMap from xml string.

Here is the implementation of creating TiledMapAsset from tmx file:

github.com

cocos-creator/engine/blob/master/cocos2d/tilemap/editor/tiled-map.js#L71


  if (sourceTSX) {
    var tsxPath = Path.normalize(Path.join(Path.dirname(tmxFile), sourceTSX));


    if (Fs.existsSync(tsxPath)) {
      tsxFiles.push(tsxPath);
      var tsxContent = Fs.readFileSync(tsxPath, 'utf-8');
      var tsxDoc = new DOMParser().parseFromString(tsxContent);
      if (tsxDoc) {
        parseTilesetImages(tsxDoc, tsxPath);
      } else {
        Editor.warn('Parse %s failed.', tsxPath);
      }
    }
  }


  // import images
  parseTilesetImages(tileset, tmxFile);
}


cb(null, { textures: textures, tsxFiles: tsxFiles });
}

You can take reference of that to initialize a TiledMapAsset object. Then use the object in the TiledMap component.