Forums » Help » MouseOverENtity check fail after Canvas scale

hi, i want to scale up my game with the html canvas scale function

but the mouse check fails

inFocus: function() {			
			var m = { x: ig.input.mouse.x, y: ig.input.mouse.y };
			var s = { x: ig.game.screen.x, y: ig.game.screen.y };
			var p = { x: this.pos.x, y: this.pos.y };
			var z = { x: this.size.x, y: this.size.y };
			return (
				(p.x <= (m.x + s.x)) &&
				((m.x + s.x) <= p.x + z.x) &&
				(p.y <= (m.y + s.y)) &&
				((m.y + s.y) <= p.y + z.y)
				);
		},

i think i have to scale up the mice coordinates but it doesnt work yet...

demo: cote.dragonfly-game.de

All you need to do is keep track of your done transformations, e.g. by using something like Transform-Object (see http://simonsarris.com/blog/471-a-transformation-class-for-canvas-to-keep-track-of-the-transformation-matrix) and then applying all the done transformations (stored in the Transform-Object) to your current drawn polygon (the mousepoint can still be as is).

Hope it helps.


Best regards