哪位大神告诉小弟我一上，html5的变换矩阵为什么得出上面的结果

哪位大神告诉我一下，html5的变换矩阵为什么得出下面的结果？
context.setTransform(1, 0, 0, 1, 0, 0);

 var xScale = Math.cos(Math.PI/4);

 var ySkew  = -Math.sin(Math.PI/4);

 var xSkew  = Math.sin(Math.PI/4);

 var yScale = Math.cos(Math.PI/4);

 var xTrans = 200;

 var yTrans = 200;

 context.transform(xScale, ySkew, xSkew, yScale, xTrans, yTrans);

 context.fillRect(-50, -50, 100, 100)


------解决方案--------------------
x’=x*cosθ-y*sinθ
y’=x*sinθ+y*cosθ
矩阵变换 由x,y绕转θ得到x'和y'
Math.PI/4即为45度角

//初始化为正立

context.setTransform(1, 0, 0, 1, 0, 0);



//下面四个参数说明旋转45度

 var xScale = Math.cos(Math.PI/4);



 var ySkew  = -Math.sin(Math.PI/4);



 var xSkew  = Math.sin(Math.PI/4);



 var yScale = Math.cos(Math.PI/4);



//绕行坐标点

 var xTrans = 200;



 var yTrans = 200;



//进行旋转

 context.transform(xScale, ySkew, xSkew, yScale, xTrans, yTrans);

//填充颜色 参数分别为 x坐标 y坐标 长 宽

 context.fillRect(-50, -50, 100, 100)