Reputation: 305
To update the position of a SVG group of elements (lines,circles etc) I use a call like this:
$('#g-srcDocView_container').attr('transform', 'translate(0,0) scale(0.301)');
I have created a fiddle at https://jsfiddle.net/tcnjay11/
The line should be in the yellow area, but when my javascript call runs to slightly modify the transform (scale or translation doesn't matter), the position jumps out in the bushes.
It works in IE, Firefox, Safari and Chrome <=56. It doesn't work in Stable,Beta or Dev versions of Chrome.
Any ideas out there?
Upvotes: 2
Views: 552
Reputation: 101820
In Chrome 57+, transform-origin
is now a valid presentation attribute. Previously it had no effect, but now it does. In Firefox it is still ignored unless it is set in CSS.
The quick fix is to remove the transform-origin
attribute from that element.
https://bugs.chromium.org/p/chromium/issues/detail?id=709821
Upvotes: 2