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 the circle element
Example 1:
HTML
<!DOCTYPE html> < html >
< body >
viewBox = "0 0 250 250" width = "250" height = "250" >
< circle cx = "100" cy = "100" r = "50" fill = "green" id = "gfg" onclick = "clickCircle();" />
< script >
var g = document.getElementById("gfg");
console.log(g.r)
</ script >
</ svg >
</ body >
</ html >
|
Output:
Example 2:
HTML
<!DOCTYPE html> < html >
< body >
viewBox = "0 0 250 250" width = "250" height = "250" >
< circle cx = "100" cy = "100" r = "100" fill = "green" id = "gfg" onclick = "clickCircle();" />
< script >
var g = document.getElementById("gfg");
console.log(g.r)
</ script >
</ svg >
</ body >
</ html >
|
Output: