Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

3d transform in html 5 canvas

In html5 canvas, is it possible to take a regular 2d image and rotate it backwards so that it will create the effect of 3d surface?

I mean something very simple, just to change the angle of the perspective. Of course, I don't mean to really have a 3d surface

like image 831
Moshe Shaham Avatar asked Apr 19 '12 14:04

Moshe Shaham


1 Answers

I assume that you are not talking about WebGL here soooo...

For 2D canvas graphics, you should try playing with the canvas transform methods. Although there is no way to get a true perspective transform out of them, you can use shearing (the b and c components of the transform matrix). See Wikipedia to get an idea of what you can do with a shear transform and

See a (stupid) JSFiddle example too!

like image 64
ellisbben Avatar answered Oct 13 '22 22:10

ellisbben