Impact

This forum is read only and just serves as an archive. If you have any questions, please post them on github.com/phoboslab/impact

6 years ago by Datamosh

I want to make a game without using images, I was trying to create a plugin to draw pixel by pixel but it is quite slow ...

How I can improve this little plugin?

Plugin:
ig.module('plugins.drawsprite')
.defines(function() {
	ig.drawsprite = function(data) {
		if(data.flip)
			for (var y = 0; y < data.sprite.length; y++) {
				data.sprite[y] = data.sprite[y].reverse()
			}

		var scale = ig.system.scale
		var ctx = ig.system.context
		ctx.save()
	
		for (var y = 0; y < data.sprite.length; y++) {
			for (var x = 0; x < data.sprite[y].length; x++) {
				ctx.fillStyle = 'rgba(' + data.palette[data.sprite[y][x]] + ')'
				ctx.fillRect(data.pos.x + (x * scale), data.pos.y + (y * scale), 1 * scale, 1 * scale)
			}
		}

		ctx.restore()
	}
});

Code:
ig.drawsprite({
	palette: {
		0: '0,0,0,0',
		1: '202,69,36,1',
		2: '171,58,50,1',
		3: '119,40,34,1'
	},
	sprite: [
		[1,2,3,3,2,2,2,2,1,2],
		[1,2,3,3,2,2,2,2,1,2],
		[1,2,3,3,2,2,2,2,1,2],
		[1,2,3,3,2,2,2,2,1,2],
		[1,2,3,3,2,2,2,2,1,2],
		[1,2,3,3,2,2,2,2,1,2],
		[1,2,3,3,2,2,2,2,1,2],
		[1,2,3,3,2,2,2,2,1,2],
		[1,2,3,3,2,2,2,2,1,2],
		[1,2,3,3,2,2,2,2,1,2]
	],
	pos: { x: 20 * ig.system.scale, y: 20 * ig.system.scale }
})

THANKS!

6 years ago by Graphikos

Just a couple thoughts for you...

If you are doing things on a pixel level you should look into canvas pixel manipulation rather than doing draw rects. Looks like you are adjusting for scale. You could draw it by pixel to an offscreen canvas and then scale it. The drawing would be cached then also.

6 years ago by Datamosh

Thanks for the tip!
Now is really fast, this week i update the post with final code.
It's fun not use any image file on the game
Page 1 of 1
« first « previous next › last »