summaryrefslogtreecommitdiffstats
path: root/src/element.js
diff options
context:
space:
mode:
authorwout <wout@impinc.co.uk>2012-12-27 13:40:58 +0100
committerwout <wout@impinc.co.uk>2012-12-27 13:40:58 +0100
commit819c6e5e8d5c0484364e3b937130851471d38965 (patch)
tree9119980b05a8681ae7c90525cc5b409bd54dcd94 /src/element.js
parentf301d239c399ee4ee9c5656c5565ee2208294b14 (diff)
downloadsvg.js-819c6e5e8d5c0484364e3b937130851471d38965.tar.gz
svg.js-819c6e5e8d5c0484364e3b937130851471d38965.zip
Reworked transform()
Diffstat (limited to 'src/element.js')
-rw-r--r--src/element.js73
1 files changed, 55 insertions, 18 deletions
diff --git a/src/element.js b/src/element.js
index ff3ad37..03963f1 100644
--- a/src/element.js
+++ b/src/element.js
@@ -2,6 +2,15 @@
SVG.Element = function Element(n) {
this.node = n;
this.attrs = {};
+ this.trans = {
+ x: 0,
+ y: 0,
+ scaleX: 1,
+ scaleY: 1,
+ rotation: 0,
+ skewX: 0,
+ skewY: 0
+ };
this._s = ('size family weight stretch variant style').split(' ');
};
@@ -41,7 +50,7 @@ SVG.extend(SVG.Element, {
a == 'leading' ?
this[a] :
this.style[a];
-
+
else
return this.attrs[a];
@@ -69,32 +78,60 @@ SVG.extend(SVG.Element, {
return this;
},
- // transformations
- transform: function(t, r) {
- var n = [],
+ transform: function(o) {
+ // act as a getter if the first argument is a string
+ if (typeof o === 'string')
+ return this.trans[o];
+
+ // ... otherwise continue as a setter
+ var k,
+ t = [],
+ b = this.bbox(),
s = this.attr('transform') || '',
- l = s.match(/([a-z]+\([^\)]+\))/g) || [];
+ l = s.match(/[a-z]+\([^\)]+\)/g) || [];
- if (r !== true) {
- var v = t.match(/^([A-Za-z\-]+)/)[1],
- r = new RegExp('^' + v);
-
- for (var i = 0, s = l.length; i < s; i++)
- if (!r.test(l[i]))
- n.push(l[i]);
-
- } else
- n = l;
+ // merge values
+ for (k in this.trans)
+ if (o[k] != null)
+ this.trans[k] = o[k];
+
+ // alias current transformations
+ o = this.trans;
+
+ // add rotate
+ if (o.rotation != 0)
+ t.push('rotate(' + o.rotation + ',' + (o.cx != null ? o.cx : b.cx) + ',' + (o.cy != null ? o.cy : b.cy) + ')');
- n.push(t);
+ // add scale
+ if (o.scaleX != 1 && o.scaleY != 1)
+ t.push('scale(' + o.sx + ',' + o.sy + ')');
- return this.attr('transform', n.join(' '));
+ // add skew on x axis
+ if (o.skewX != 0)
+ t.push('skewX(' + x.skewX + ')');
+
+ // add skew on y axis
+ if (o.skewY != 0)
+ t.push('skewY(' + x.skewY + ')')
+
+ // add translate
+ if (o.x != 0 && o.y != 0)
+ t.push('translate(' + o.x + ',' + o.y + ')');
+
+ // add only te required transformations
+ return this.attr('transform', t.join(' '));
},
-
+
// get bounding box
bbox: function() {
+ // actual bounding box
var b = this.node.getBBox();
+ // include translations on x an y
+ b.x += this.trans.x;
+ b.y += this.trans.y;
+
+ // add the center
b.cx = b.x + b.width / 2;
b.cy = b.y + b.height / 2;