File: graphics/js/SVGCircle.js
/**
* <a href="http://www.w3.org/TR/SVG/">SVG</a> implementation of the <a href="Circle.html">`Circle`</a> class.
* `SVGCircle` is not intended to be used directly. Instead, use the <a href="Circle.html">`Circle`</a> class.
* If the browser has <a href="http://www.w3.org/TR/SVG/">SVG</a> capabilities, the <a href="Circle.html">`Circle`</a>
* class will point to the `SVGCircle` class.
*
* @module graphics
* @class SVGCircle
* @constructor
*/
SVGCircle = function()
{
SVGCircle.superclass.constructor.apply(this, arguments);
};
SVGCircle.NAME = "circle";
Y.extend(SVGCircle, Y.SVGShape, {
/**
* Indicates the type of shape
*
* @property _type
* @type String
* @private
*/
_type: "circle",
/**
* Updates the shape.
*
* @method _draw
* @private
*/
_draw: function()
{
var node = this.node,
x = this.get("x"),
y = this.get("y"),
radius = this.get("radius"),
cx = x + radius,
cy = y + radius;
node.setAttribute("r", radius);
node.setAttribute("cx", cx);
node.setAttribute("cy", cy);
this._fillChangeHandler();
this._strokeChangeHandler();
this._updateTransform();
}
});
SVGCircle.ATTRS = Y.merge(Y.SVGShape.ATTRS, {
/**
* Indicates the width of the shape
*
* @config width
* @type Number
*/
width: {
setter: function(val)
{
this.set("radius", val/2);
return val;
},
getter: function()
{
return this.get("radius") * 2;
}
},
/**
* Indicates the height of the shape
*
* @config height
* @type Number
*/
height: {
setter: function(val)
{
this.set("radius", val/2);
return val;
},
getter: function()
{
return this.get("radius") * 2;
}
},
/**
* Radius of the circle
*
* @config radius
* @type Number
*/
radius: {
value: 0
}
});
Y.SVGCircle = SVGCircle;