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:
