The arc.centroid() function is used to compute the midpoint of the centerline of the arc. The midpoint that is generated is calculated using (startAngle+endAngle)/2 and (innerRadius+outerRadius)/2.
Syntax:
arc.centroid(arguments);
Parameters: This function accepts a single parameter as mentioned above and described below.
- arguments: These are the arbitrary arguments.
Return Values: This function return an array containing the points.
Example 1:
HTML
<!DOCTYPE html> <html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport"
content="width=device-width,
initial-scale=1.0"/>
<!--Fetching from CDN of D3.js -->
<script src=
</script>
</head>
<body>
<script>
// Creating an arc
var arc = d3.arc()
.innerRadius(40)
.outerRadius(45)
.startAngle(10)
.endAngle(8);
// arc.centroid function
console.log(arc.centroid());
</script>
</body>
</html>
|
Output:
Example 2:
HTML
<!DOCTYPE html> <html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport"
content="width=device-width,
initial-scale=1.0"/>
<!--Fetching from CDN of D3.js -->
<script src=
</script>
</head>
<body>
<script>
// Creating an arc
var arc = d3.arc()
.innerRadius(40)
.outerRadius(45)
.startAngle(0)
.endAngle(8);
// arc.centroid function
console.log("Change in start and end angle");
console.log("will change the centroid");
console.log(arc.centroid());
</script>
</body>
</html>
|
Output:
