The d3.lineRadial() method is used to construct a new Radial line generator with the default settings. The Radial line generator is then used to make a Radial line.
Syntax:
d3.lineRadial();
Parameters: This method does not accept any parameters.
Return Value: This method returns a Radial line Generator.
Example 1: The following example makes a Radial curve line using this method.
HTML
<!DOCTYPE html> <html>   <head>     <script src="     </script>       <script src="     </script> </head>   <body>     <h1 style="text-align:center;color: green;">         neveropen     </h1>     <center>         <svg id="gfg" width="200" height="200">             <g transform="translate(100, 100)"></g>         </svg>     </center>       <script>         var lineRadialGenerator = d3.lineRadial();         var data = [             [0, 10],             [3.14 * .5, 35],             [3.14 * .75, 55],             [3.14, 60],             [3.14 * 1.25, 65],             [3.14 * 1.5, 70],             [3.14 * 1.75, 75],             [3.14 * 2, 80],             [3.14 * 2.25, 85],             [3.14 * 2.5, 90],             [3.14 * 2.75, 95],             [3.14 * 3, 100],             [3.14 * 3.25, 105],             [3.14 * 3.5, 110]];           var a = lineRadialGenerator(data);           d3.select("#gfg")             .select("g")             .append("path")             .attr("d", a)             .attr("fill", "none")             .attr("stroke", "green");     </script> </body>   </html> |
Output:
Example 2:
HTML
<!DOCTYPE html> <html> Â Â <head> Â Â Â Â <meta charset="utf-8"> Â Â Â Â Â Â <script src=" Â Â Â Â </script> Â Â Â Â <script src= Â Â Â Â </script> </head> Â Â <body> Â Â Â Â <h1 style="text-align:center; color:green;"> Â Â Â Â Â Â Â Â neveropen</h1> Â Â Â Â <center> Â Â Â Â Â Â Â Â <svg id="gfg" width="200" height="200"> Â Â Â Â Â Â Â Â Â Â Â Â <g transform="translate(100, 100)"></g> Â Â Â Â Â Â Â Â </svg> Â Â Â Â </center> Â Â Â Â Â Â <script> Â Â Â Â Â Â Â Â var lineRadialGenerator = d3.lineRadial(); Â Â Â Â Â Â Â Â var data = [ Â Â Â Â Â Â Â Â Â Â Â Â [0, 80], Â Â Â Â Â Â Â Â Â Â Â Â [(Math.PI * 0.25), 80], Â Â Â Â Â Â Â Â Â Â Â Â [(Math.PI * 0.5), 80], Â Â Â Â Â Â Â Â Â Â Â Â [(Math.PI * 0.75), 80], Â Â Â Â Â Â Â Â Â Â Â Â [(Math.PI), 80], Â Â Â Â Â Â Â Â Â Â Â Â [(Math.PI * 1.25), 80], Â Â Â Â Â Â Â Â Â Â Â Â [(Math.PI * 1.5), 80], Â Â Â Â Â Â Â Â Â Â Â Â [(Math.PI * 1.75), 80], Â Â Â Â Â Â Â Â Â Â Â Â [(Math.PI * 2), 80] Â Â Â Â Â Â Â Â ]; Â Â Â Â Â Â Â Â var a = lineRadialGenerator(data); Â Â Â Â Â Â Â Â Â Â d3.select("#gfg") Â Â Â Â Â Â Â Â Â Â Â Â .select("g") Â Â Â Â Â Â Â Â Â Â Â Â .append("path") Â Â Â Â Â Â Â Â Â Â Â Â .attr("d", a) Â Â Â Â Â Â Â Â Â Â Â Â .attr("fill", "none") Â Â Â Â Â Â Â Â Â Â Â Â .attr("stroke", "green"); Â Â Â Â </script> </body> Â Â </html> |
Output:

