svgdotjs / svg.js

The lightweight library for manipulating and animating SVG

Home Page:https://svgjs.dev

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Size inconsistency when setting circle radius using different methods

jamesgrubb opened this issue · comments

commented

Bug report

Fiddle

Example

Explanation

If I set a circle's radius with circle(50).cx(50).cy(50) I would expect the following svg in the DOM

<circle r="50" cx="50" cy="50" ></circle>

Instead, the result is

<circle r="25" cx="50" cy="50" ></circle>

However, if I set the circles radius using circle().radius(50) the result is

<circle r="50" cx="50" cy="50" ></circle>

Because you are setting the size of the circle and not the radius.
All svg.js methods for simple shapes take the size to create the shape. That way you don't need to think about which type of shape you are dealing with

commented

Got it, thank you fro your time explaining this methodology. I love how svg.js is so rich.