Can't .center() to percent values

[mreq]

Minimal (not) working example: http://jsfiddle.net/mreq/LP7sa/

Error: Invalid value for <rect> attribute x="NaN"
Error: Invalid value for <rect> attribute y="NaN"

There's a few more %-related issues (am working on a responsive app, where everything is in given relative). I'll try to pinpoint all of them.

[wout]

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.

[mreq]

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 }%"

[wout]

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

[mreq]

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 ;)

[wout]

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

[achalddave]

Out of curiosity, what was this idea?