Created
March 19, 2017 22:15
-
-
Save petersirka/dfac415e1e1e4993af826c0ff706eb4d to your computer and use it in GitHub Desktop.
Parse transform SVG attribute
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
String.prototype.parseTransform = function() { | |
var prop = ['translate', 'matrix', 'rotate', 'skewX', 'skewY', 'scale']; | |
var val = this.match(/(translate|matrix|rotate|skewX|skewY|scale)\(.*?\)/g); | |
var obj = {}; | |
if (val) { | |
for (var i = 0, length = val.length; i < length; i++) { | |
var item = val[i]; | |
var index = item.indexOf('('); | |
var v = item.substring(index + 1, item.length - 1).split(/\,|\s/); | |
var n = item.substring(0, index); | |
obj[n] = {}; | |
switch (n) { | |
case 'translate': | |
case 'scale': | |
obj[n].x = +v[0] || 0; | |
obj[n].y = +v[1] || 0; | |
break; | |
case 'rotate': | |
obj[n].a = +v[0] || 0; | |
obj[n].x = +v[1] || 0; | |
obj[n].y = +v[2] || 0; | |
break; | |
case 'skewX': | |
case 'skewY': | |
obj[n].a = +v[0]; | |
break; | |
case 'matrix': | |
obj[n].a = +v[0] || 0; | |
obj[n].b = +v[1] || 0; | |
obj[n].c = +v[2] || 0; | |
obj[n].d = +v[3] || 0; | |
obj[n].e = +v[4] || 0; | |
obj[n].f = +v[5] || 0; | |
break; | |
} | |
} | |
} | |
obj.toString = function() { | |
var builder = []; | |
for (var i = 0, length = prop.length; i < length; i++) { | |
var n = prop[i]; | |
var o = this[n]; | |
if (!o) | |
continue; | |
switch (n) { | |
case 'translate': | |
case 'scale': | |
builder.push(n + '(' + o.x + ',' + o.y + ')'); | |
break; | |
case 'rotate': | |
builder.push(n + '(' + o.a + ' ' + o.x + ' ' + o.y + ')'); | |
break; | |
case 'skewX': | |
case 'skewY': | |
builder.push(n + '(' + o.a + ')'); | |
break; | |
case 'matrix': | |
builder.push(n + '(' + o.a + ',' + o.b + ',' + o.c + ',' + o.d + ',' + o.e + ',' + o.f + ')'); | |
break; | |
} | |
} | |
return builder.join(' '); | |
}; | |
return obj; | |
}; |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Thank you for sharing this.
I just want to point out a possible bug: default values for parsing
scale
should be1
instead of0
, otherwise, you might parsescale(0.75)
asscale(0.75 0)
.When I used this, I modified the
switch
by separating the cases for translate and scale.