Converts a SVG transform string into a Raphael Matrix object.

transformToMatrix.js

function toMatrix(transform) {
  var transforms = transform.split(' '),
      matrix = Raphael.matrix();
  
  for (var i=0; i<transforms.length; i++) {
    var match = /^(\w+)\((.+)\)$/.exec(transforms[i]),
        tranform = match[1],
        values = toFloatArray(match[2]);
    
    if ('translate' === transform) matrix.translate.apply(matrix, values);
    if ('rotate' === transform) matrix.rotate.apply(matrix, values);
    if ('scale' === transform) matrix.scale.apply(matrix, values);
  }
  
  function toFloatArray() {
    var values = vals.split(','),
        numbers = [];
    for (var i=0; i<values.length; i++) {
        numbers.push(parseFloat(values[i], 10));
    }
    return numbers;
  }
  
  return matrix;
}

I need to split the transforms on something better than ' '. Its highly likely that someone will have a space within each individual transform. E.g. translate(20, 10). I'll probably see if I can come up with a regex statement to do this for me.

Nice, I'm testing it out now and seeing how many ways I can break it :)

ah ha! I just realized that the regex's we need are within the raphael source code: https://github.com/DmitryBaranovskiy/raphael/blob/master/raphael.core.js#L228

I'm going to see how far these get me.