Johan
Johan

Reputation: 305

Chrome version 57 broke my SVG transforms

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

Answers (1)

Paul LeBeau
Paul LeBeau

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

Related Questions