Hi,
I am a newbie with Cocos2d-html5
, I have a problem about graphic when I try loading a tmx tiled map, my result is not expected.
I am using cocos2d-js version 3.0, and test on chrome, firefox, ie have same problem.
This is my tmx, I designed by tiled tool.
This is game result.
Have border around the tile
.
This is my code.
testmap.html
<body style="text-align: center;background: #f2f6f8;">
<canvas id="myGameCanvas" width="600" height="350" tabindex="1" style="outline: none; cursor: default; background-color: black;"></canvas>
<script src="/fw/CCBoot.js"></script>
<script src="/a/main.js"></script>
main.js
cc.game.onStart = function(){
cc.LoaderScene.preload(g_resources, function () {
cc.director.runScene(new DesertPlayScene());
}, this);}; cc.game.run();
resources.js
var res = {
tmw_desert_spacing_png : "/i/desert/tmw_desert_spacing.png",
player_png : "/i/desert/player.png",
desert_map_tmx : "/i/desert/desert_map.tmx"};
var g_resources = [];
for (var i in res) {
g_resources.push(res[i]);}
DesertPlayScene.js
var DesertPlayScene = cc.Scene.extend({
onEnter:function () {
var desertLayer = new DesertBackgroundLayer();
this.addChild(desertLayer);
this.addChild(new PlayerLayer(desertLayer.map));
}});
DesertBackgroundLayer.js
var DesertBackgroundLayer = cc.Layer.extend({
map : null,
ctor : function(space){
//1. call super class's ctor function
this._super();
this.init();
},
init:function(){
this.map = cc.TMXTiledMap.create(res.desert_map_tmx);
this.addChild(this.map);
}});
PlayerLayer.js
var PlayerLayer = cc.Layer.extend({
map : null,
ctor : function(map){
//1. call super class's ctor function
this._super();
this.map = map;
this.init();
},
init:function(){
//call super class's super function
this._super();
var objectGroup = this.map.getObjectGroup("Objects");
var objects = objectGroup.getObjects();
var playerTile = null;
for ( var i = 0; i < objects.length; i++) {
if(objects[i]["name"] == "SpawnPoint"){
playerTile = objects[i];
break;
}
}
//create sprite
var player = cc.Sprite.create(res.player_png);
player.setPosition(cc.p(playerTile.x,playerTile.y));
this.addChild(player);});
Please help me.