Can't .center() to percent values about svg.js HOT 6 CLOSED

That is not possible indeed. You can only use % values with center on cicrle and ellipse elements, because they are natively moved by their centre. The opposite is true for move on circle and ellipse. You can't use % values there but you can with rect and image.

I have looked into implementing this but it is virtually impossible without adding 2k of code to the library. Because it would involve adding event listeners to the svg canvas so when it is resized the "fake" centered elements are moved accordingly.

from svg.js.

Interesting, I thought a single condition could fix that. That's what I'm doing atm:

# TODO: won't have to do this once svg.js is fixed 
if @isEllipse
    @field.center '50%', '50%'
else
    x = 50 - @fieldWidth/2
    y = 50 - @fieldHeight/2
    @field.move "#{ x }%", "#{ y }%"

from svg.js.

That's the easy part. But that if the svg canvas is resized? Or the nested svg...

from svg.js.

You're right. A generic solution is not an easy one. I am indeed listening to a resize event and updating some sort of an aspect ratio. Closing this as WONTFIX. Might update the README maybe ;)

from svg.js.

I just came up with an idea to fix it without an event listener. I'll look into it this week.

from svg.js.

Out of curiosity, what was this idea?

from svg.js.