title: Extract -webkit-transform matrix3d values
body: <p>I am trying to render 3D shapes using <code>&lt;canvas&gt;</code> (2d context), which means I have to perform some manual projective transformations. </p>
  
  <p>It would help me a lot to be able to retrieve the 3D transformation matrix values from the CSS. </p>
  
  <p>Can this be done? </p>
  
  <p>If not, how can I construct the transformation that is performed by -webkit-perspective-origin? I've figured the transformation out for just the perspective alone, but that has the perspective origin at x=y=0 which is not always the case. </p>
  
  <p>I realize that this specific case (perspective with origin at some point x, y, z) may turn out to be a simple x, y, z translation immediately followed by the perspective transform (or the other way around) but the ideal answer would be a method to extract the actual 4x4 3D matrix. If I have the matrix, I no longer have to re-trace the steps that I did to transform my CSS3 elements in order to apply the same transforms to geometry which I intend to render using <code>&lt;canvas&gt;</code>. </p>
  
  <p>I looked here (<a href="http://www.w3.org/TR/css3-3d-transforms/" rel="nofollow">http://www.w3.org/TR/css3-3d-transforms/</a>) for reference but it does not look like they describe the actual values being assigned to the matrix when applying the different possible transformations. I think there should be some spec sheet out there that does go into such detail. I seem to recall even catching a glimpse of it (matrix definitions with lots of trig functions) somewhere. </p>
  
  <p>Edit: I found a more in-depth overview of the steps the browser takes to perform the transformations <a href="http://dev.w3.org/csswg/css3-transforms/#transform-3d-rendering" rel="nofollow">here</a>. Does not answer my question but it does get me one step closer to my temporary goal.</p>