View Full Version : canvas/js 2d perspective transform
07-13-2011, 12:04 PM
not sure if this is the right place to ask canvas questions, but if it is, i'm trying to program a game like air hockey (with some twists). it works pretty well now but the table is viewed from overhead, and i would prefer to show the game from the player's perspective, as in the pic, without having to rewrite my existing code. anyone know of any js libraries or formulas which can accomplish this?
07-13-2011, 12:09 PM
I never actually tried this, but I can refer you to http://stackoverflow.com/questions/5186013/can-you-do-an-isometric-perspective-with-html5-canvas
var cs = Math.cos(angle1), sn = Math.sin(angle1);
var h = Math.cos(angle2);
var a = 100*cs, b = -100*sn, c = 200;
var d = h*100*sn, e = h*100*cs, f = 200;
ctx.setTransform(a, d, b, e, c, f);
07-13-2011, 12:17 PM
not looking for isometric though... way too many resources on that...
07-13-2011, 11:12 PM
use css transforms to skew the canvas element...
css3 should work in all the same places as canvas.
07-14-2011, 02:20 AM
awesome! not aware of these, probably cos i'm usually developing for the least common denominator of browsers and css3 is like a faraway dream...
Powered by vBulletin® Version 4.2.2 Copyright © 2017 vBulletin Solutions, Inc. All rights reserved.