Forums » Help » dynamic BackgroundMap?

Hi, new user here.

For fun, I want to try dynamic tweaking of background map tiles. Do you know if this is possible or if the engine has any issues?

I assume pre-rendering will have to be disabled. But are there any other gotchas you can think of?

I'm hoping to poke new tile values into the ig.game.backgroundMaps structure directly, without notifying the engine by calling any functions like loadLevel.

It's absolutely fine to do that. You can even do it with the collision layer if you really want to.

What do you have in mind, exactly? If you're trying to do animated background tiles, you don't have to mess around changing the tiles themselves, you can set animations on tiles instead (as Biolab Disaster does to animate the water)

Word of caution, if you do decide to do so, I'd do it at the start of the game's update method, before calling the parent method (to update everything else) so that it updates in sync with everything else.


I know I've done dynamic maps in a simple case before now, I did it to make a simple lunar lander type game, so it's possible - but I did it during the game's init rather than per frame.

Thanks for the pointers.

I'm changing the actual tile values themselves. Main reason is to hide most of the level from the client software in a client/server design. I might play around with some level generation, too.

As you said, it seems to be working perfectly. I have a trivial test case that changes one tile once per second, cycling through all the available tiles. Looks great.

From lib/game/main.js:

	init: function() {
		// Initialize your game here; bind keys etc.
        
        this.sizetext = ''
        this.tweak_timer = new ig.Timer();

        blank_level = {
            entities: [],
            layer: [
                {
                    name: "dynamic",
                    tilesetName: "media/tiles/tiles.png",
                    repeat: false,
                    distance: 1,
                    tilesize: 32,
                    foreground: false,
                    preRender: false,
                    data: [
                        [4,4,4],
                        [4,4,4],
                        [4,4,4],
                    ]
                },
            ]
        }
        
        this.loadLevel( blank_level );

	},
	
	update: function() {
		// Add your own, additional update code here
//      this.sizetext = this.backgroundMaps.length.toString()
        tweak = Math.floor(this.tweak_timer.delta())%4;
        this.sizetext = Math.floor(this.tweak_timer.delta()).toString()+' = '+tweak.toString();
        if (this.backgroundMaps.length > 0) {
            bgmap = this.backgroundMaps[0].data;
            bgmap[1][1] = tweak+1;
        }

		// Update all entities and backgroundMaps
		this.parent();
	},

I'm impressed with Impact so far.