Cita:
Iniciado por marlanga 
El centro que tiene la matriz original no es el mismo centro que tiene la matriz cuando la "tratas" con tu función draw, porque le cambia el tamaño y la posición. Asi que deberás calcular el centro cada cez que ejecutes draw.
Por otra parte, para rotar figuras en 2D se utiliza la matriz de rotación y la matriz de traslación.
Tienes una matriz con las coordenadas X e Y de todos los vértices, y otra matriz con sólo la coordenada X e Y del punto por donde quieres rotar.
Se resta a cada coordenada X de los vértices, la coordenada X de rotación. Con la coordenada Y, igual. Con eso se consigue situar el centro en la coordenada (0,0), para que la rotación sea correcta.
Luego se multiplica la matriz por otra matriz llamada de rotación, que básicamente contiene los valores de seno y coseno del ángulo con el que quieres rotar.
La matriz resultado estará rotada sobre el eje (0,0). Por último se le suma a cada vertice de la matriz, su correspondiente coordenada del centro (antes se restó, ahora se suma). Así moverías la matriz con los vértices rotados, a su posición original.
Y con ésto, ya está la matriz rotada.
http://jsfiddle.net/Zjt4R/1/ ¡No habia visto el JSFIDLE! Que genio que sos lo hiciste andar !!!
Veo que recalculas el punto de origen pero no comprendo cual es la logica digamos, yo suponia que era siempre un punto fijo.
En otras webs que estuve visitando vi que hacian la rotacion del punto de la misma forma que lo estas haciendo vos:
Código HTML:
matriz[i].x=(x*cos-y*sen)+Ox;
matriz[i].y=(x*sen+y*cos)+Oy;
¿Esta forma seria equivalente a utilizar la matriz de rotacion?
Gracias por tu aporte, me alegraste muchisimo el día... es todo un mundo nuevo para esto de la geometría en programación, estoy "aprendiendo a caminar" de nuevo casi.
Gran abrazo!
edu