Open In App

SVG CircleElement.cy Property

Last Updated : 30 Mar, 2022
Improve
Improve
Like Article
Like
Save
Share
Report

The SVG CircleElement.cy property returns an SVGAnimatedLength object corresponding to the attribute of the given line element.

Syntax:

CircleElement.cy

Return value: This property returns SVGAnimatedLength object that can be used get the cy of the circle element

Example 1: 

HTML




<!DOCTYPE html>
<html>
  
<body>
    <svg xmlns="http://www.w3.org/2000/svg" 
         viewBox="0 0 250 250" width="250" height="250">
      <circle cx="150" cy="100" r="50" fill="green" 
              id="gfg" onclick="clickCircle();"/>
      <script>
        var g = document.getElementById("gfg");
                console.log(g.cy)
      </script>
    </svg>
</body>
  
</html>


Output:

Example 2: 

HTML




<!DOCTYPE html>
<html>
  
<body>
    <svg xmlns="http://www.w3.org/2000/svg" 
         viewBox="0 0 250 250" width="250" height="250">
      <circle cx="150" cy="160" r="50" fill="green" 
              id="gfg" onclick="clickCircle();"/>
      <script>
        var g = document.getElementById("gfg");
                console.log(g.cx)
      </script>
    </svg>
</body>
  
</html>


Output:



Previous Article
Next Article

Similar Reads

SVG CircleElement.r Property
SVG stands for Scalable Vector Graphic. It can be used to make graphics and animations like in HTML canvas. The SVG CircleElement r property returns an SVGAnimatedLength object corresponding to the attribute of the given line element Syntax: CircleElement.r Return value: This property returns SVGAnimatedLength object that can be used get the r of t
1 min read
SVG CircleElement.cx Property
The SVG CircleElement.cx property returns an SVGAnimatedLength object corresponding to the attribute of the given line element. Syntax: CircleElement.cx Return value: This property returns the SVGAnimatedLength object that can be used get the cx of the circle element. Example 1: &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;body&gt; &lt;svg xmlns=&quot;ht
1 min read
SVG &lt;svg&gt; Element
SVG stands for Scalable Vector Graphic. It can be used to make graphics and animations like in HTML canvas. SVG graphics are supported by the &lt;svg&gt; element in HTML. SVG graphics feature a container in which we can create a variety of shapes such as boxes, pathways, text, graphic images, and circles. Syntax: &lt;svg width="x" height="y"&gt; sh
2 min read
SVG ScriptElement.type Property
The SVG ScriptElement.type property returns an SVGAnimatedLength object corresponding to the attribute of the given script element. Syntax: ScriptElement.type Return value: This property returns SVGAnimatedLength object that can be used to get the type of the script element. Example 1: C/C++ Code &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;body&gt; &lt;
1 min read
SVG RectElement.width Property
The SVG RectElement.width property returns an SVGAnimatedLength corresponding to the attribute of the given rectangle element. Syntax: RectElement.width Return Values: This property returns SVGAnimatedLength object that can be used get the width of the rect element Example 1: C/C++ Code &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;body&gt; &lt;svg width=
1 min read
SVG RectElement.ry Property
The SVG RectElement.ry property is used to return an SVGAnimatedLength object corresponding to the attribute of the given rectangle element. Syntax: RectElement.ry Return Value: This property returns an SVGAnimatedLength object that can be used to get the "ry" value and other properties of the rectangle element. Example 1: C/C++ Code &lt;!DOCTYPE h
1 min read
SVG LineElement.x2 Property
The SVG LineElement.x2 property is used to return an SVGAnimatedLength object corresponding to the attribute of the given line element. Syntax: LineElement.x2 Return Value: This property returns an SVGAnimatedLength object that can be used to get the "x2" value and other properties of the line element. Example 1: C/C++ Code &lt;!DOCTYPE html&gt;
1 min read
SVG namespaceURI Property
The SVG namespaceURI property returns namespaceURI of the given Attribute element. Syntax: namespace = attribute.namespaceURI Return value: This property returns the namespaceURI of the Attr. Example 1: C/C++ Code &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;body&gt; &lt;svg viewBox=&quot;0 0 100 100&quot; xmlns=&quot;http://www.w3.org/2000/svg&quot;&gt;
1 min read
SVG FEDisplacementMap.yChannelSelector Property
The SVG FEDisplacementMap.yChannelSelector property returns the SVGAnimatedEnumeration object corresponding to the yChannelSelector component of the FEDisplacementMap.yChannelSelector element. Syntax: var a = FEDisplacementMap.yChannelSelector Return value: This property returns the SVGAnimatedEnumeration object corresponding to the yChannelSelecto
1 min read
SVG Document.head Property
The SVG Document.head property returns an object which contains the information about the head of the document. Syntax: var objRef = document.head Return value: This property returns an object which contains the information about the head of the document. Example 1: C/C++ Code &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;title&gt;Title&lt;/t
1 min read