How to unload/unmount a tile map that u load from json?

All things HTML5 or text based engines, or really any web based engines.
Post Reply
zaquanishak
Posts: 53
Joined: Mon Aug 26, 2013 1:54 am

How to unload/unmount a tile map that u load from json?

Post by zaquanishak »

Hi,
I want to know how cani i unload/unmount the tile map that i already load using json?
Please advise.

Regards,
Zachz
zachz
Programmer
compass-interactive
robaldred
Posts: 64
Joined: Tue Aug 27, 2013 5:54 pm

Re: How to unload/unmount a tile map that u load from json?

Post by robaldred »

Your tile map is mounted to the scene like all other entities, infact it's just a subclass of IgeEntity.
So like other entities to remove it completely use the following:

Code: Select all

tileMap.unMount();
tileMap.destroy();
User avatar
coolbloke1324
Posts: 181
Joined: Mon Jan 23, 2012 5:20 pm

Re: How to unload/unmount a tile map that u load from json?

Post by coolbloke1324 »

robaldred wrote:Your tile map is mounted to the scene like all other entities, infact it's just a subclass of IgeEntity.
So like other entities to remove it completely use the following:

Code: Select all

tileMap.unMount();
tileMap.destroy();
Absolutely.

You can also just called tileMap.destroy() as this will automatically un-mount as well. :)
CEO & Lead Developer
Irrelon Software Limited
http://www.isogenicengine.com
zaquanishak
Posts: 53
Joined: Mon Aug 26, 2013 1:54 am

Re: How to unload/unmount a tile map that u load from json?

Post by zaquanishak »

Hi,
this is how i load my map

Code: Select all

ige.addComponent(IgeTiledComponent);
        ige.tiled.loadJson(tiledExample1, function (layerArray, layersById){
            console.log('Map Loaded....');
            for (i = 0; i < layerArray.length; i++) {
                layerArray[i]
                    .tileWidth(40)
                    .tileHeight(40)
                    .autoSection(20)
                    //.isometricMounts(false)
                    .drawBounds(false)
                    .drawBoundsData(false)
                    .mount(ige.client.backgroundScene);
            }
        });
and this is how i try to unmount or destroy in in clientNetworkEvents

Code: Select all

_onGoToDoor: function (data, clientId) {
        console.log('Map instruction received' , data.map);
        ige.client.tileMap.unMount();
    }
and its not working. I'm getting error call to undefined method.

Please advise.

Regards,
Zachz
zachz
Programmer
compass-interactive
User avatar
coolbloke1324
Posts: 181
Joined: Mon Jan 23, 2012 5:20 pm

Re: How to unload/unmount a tile map that u load from json?

Post by coolbloke1324 »

zaquanishak wrote:Hi,
this is how i load my map

Code: Select all

ige.addComponent(IgeTiledComponent);
        ige.tiled.loadJson(tiledExample1, function (layerArray, layersById){
            console.log('Map Loaded....');
            for (i = 0; i < layerArray.length; i++) {
                layerArray[i]
                    .tileWidth(40)
                    .tileHeight(40)
                    .autoSection(20)
                    //.isometricMounts(false)
                    .drawBounds(false)
                    .drawBoundsData(false)
                    .mount(ige.client.backgroundScene);
            }
        });
and this is how i try to unmount or destroy in in clientNetworkEvents

Code: Select all

_onGoToDoor: function (data, clientId) {
        console.log('Map instruction received' , data.map);
        ige.client.tileMap.unMount();
    }
and its not working. I'm getting error call to undefined method.

Please advise.

Regards,
Zachz
Hi ya,

The "tileMap" is not a universal variable that you can access, that code was written as "pseudo-code". You have to use the layer id to retrieve the layer you want to access via the ige.$() method.

In your console type:

Code: Select all

ige.sceneGraph();
And then copy and paste the output here so we can see it. Each item in that output has an ID that you can then use in ige.$() to get the object.

Then you can get the layer you want and unMount it via:

Code: Select all

ige.$('myLayer_0').unMount();
or

Code: Select all

ige.$('myLayer_1').unMount();
or

Code: Select all

ige.$('myLayer_2').unMount();
or whatever the ID of the layer is.
CEO & Lead Developer
Irrelon Software Limited
http://www.isogenicengine.com
zaquanishak
Posts: 53
Joined: Mon Aug 26, 2013 1:54 am

Re: How to unload/unmount a tile map that u load from json?

Post by zaquanishak »

Hi,
I dont know what happen but i could not see my sceneGraph(). As u can see here

Code: Select all

for (i = 0; i < layerArray.length; i++) {
                layerArray[i]
                    .tileWidth(40)
                    .tileHeight(40)
                    .autoSection(20)
                    //.isometricMounts(false)
                    .drawBounds(false)
                    .drawBoundsData(false)
                    .mount(ige.client.backgroundScene);
            }
its the layerArray that has been mount to the backgroundScene one by one. So where should i attach the id? will the id be increament too? Do i need to have a for loop to unmount it?

Regards,
Zachz
zachz
Programmer
compass-interactive
zaquanishak
Posts: 53
Joined: Mon Aug 26, 2013 1:54 am

Re: How to unload/unmount a tile map that u load from json?

Post by zaquanishak »

hi,
Here is my github https://github.com/zachzinho/IsometricGames

What im trying to do here is to change map whenever a character move to a specific tile. My problem is to change the map only for character of the client that go to that specific tile. What i have achieve by using texturemap() is when the character go to a specific tile yes the map change but it also update all client. Which mean whenever a character go to a specific tile, all client will be update to this new map. So how can i update only for a specific client? i try to store my client id into a variable in my client.js but when i want to use it back the value is undefined. So how do i store this cliend id so i can use the

Code: Select all

var ent = new IgeEntity()
    .streamMode(1)
    .streamControl(function(clientId) {
        // An example test, let's check if the entity's ID is "player"
        // and the clientId is "4857q9493249252343", if so, allow the
        // stream to send the data
        if (this.id() === 'player' && clientId === '4857q9493249252343') {
            return true;
        } else {
            return false;
        }
    });
this stream control to compare the id?
Sorry for my bad english.

Regards,
Zachz
zachz
Programmer
compass-interactive
zaquanishak
Posts: 53
Joined: Mon Aug 26, 2013 1:54 am

Re: How to unload/unmount a tile map that u load from json?

Post by zaquanishak »

Hi,
I manage to load/destory map using the texture map but overtime the game become slower. Below is my code how i do it?
Below is from my character update function. What the code do is when the character reach the specific tile, it will send net command to server.

Code: Select all

if((tiles[0].x === 1) && (tiles[0].y === 1)){
                playerReachDoor = true;
                if(playerReachDoor === true){
                    ige.network.send('goToDoor' , {id: this.id() , map:2});
                    playerReachDoor = false;
                }
Here is where server receive the net command from client about changing map. Server send back the client which map to change.

Code: Select all

_onGoToDoor: function (data, clientId) {
        //console.log('map:--', data.map);
        if(data.map === 2){
            ige.network.send('goToDoor', {map: 'map2'}, clientId);
        }

        if(data.map === 1){
            ige.network.send('goToDoor', {map: 'map1'}, clientId);
        }

    }

And here where the client event receive it back and destory the map

Code: Select all

 _onGoToDoor: function (data, clientId) {
        console.log('Map instruction received' , data.map);
            if(data.map == 'map2'){
                if(ige.client.textureMap2){
                    ige.client.textureMap2.destroy();
                    ige.client.loadTileMap1();
                }

            }
            if(data.map == 'map1'){
                if(ige.client.textureMap1){
                    ige.client.textureMap1.destroy();
                    //ige.client.loadTileMap();
                }
            }
    }
Untitled.png
So my question is, does coding like this will affect the game performance? Please advise on this.

Regards,
Zachz
zachz
Programmer
compass-interactive
User avatar
coolbloke1324
Posts: 181
Joined: Mon Jan 23, 2012 5:20 pm

Re: How to unload/unmount a tile map that u load from json?

Post by coolbloke1324 »

Hey ya,

The line:

Code: Select all

ige.client.textureMap2
Shows that you are holding a reference to the map object in memory even if you call .destroy() since ige.client.textureMap2 will still be referencing the object which means the browser's garbage collection cannot remove it from memory.

It is not a good idea to hold references to objects indefinitely. It is generally better to *not* store them in ige.client and instead, provide them with an id. Then you can reference them from ige.$(id) instead.

When you use .destroy() on an object, the engine automatically removes references to it from ige.$ so it can be garbage collected.

To assign an id to an object or entity you can create the entity then call it's .id() method like this:

Code: Select all

var ent = new IgeEntity()
    .id('myNewId');
That entity now has the id "myNewId" so you can get the entity back at any time via:

Code: Select all

var ent = ige.$('myNewId');
If you then call:

Code: Select all

ent.destroy();
Now if you do:

Code: Select all

var ent = ige.$('myNewId');
ent will === undefined because the object has been destroyed correctly.
CEO & Lead Developer
Irrelon Software Limited
http://www.isogenicengine.com
zaquanishak
Posts: 53
Joined: Mon Aug 26, 2013 1:54 am

Re: How to unload/unmount a tile map that u load from json?

Post by zaquanishak »

Hi,
Thanks rob. I manage to fixed it. :D

Regards,
Zachz
zachz
Programmer
compass-interactive
Post Reply

Return to “HTML5/Web Engines”