Simple demo of using SVG transform with path 'd' attribute to create radial axes.
Apply transform attributes to a group (<g>) to modify all nested elements:
xxxxxxxxxx<meta charset='utf-8'><body> <div id="stage"> <svg xmlns="https://www.w3.org/2000/svg" width="960" height="500"> <g transform="translate(300,300) rotate(-60)"> <path d="M -40,0 L 250,0" stroke="#000"></path> <circle cx="-40" cy="0" r="10"></circle> <circle cx="0" cy="0" r="10"></circle> <circle cx="250" cy="0" r="10"></circle> </g> <g transform="translate(500,300) rotate(10)"> <path d="M -100,0 L 100,0" stroke="#000"></path> <circle cx="-100" cy="0" r="10"></circle> <circle cx="0" cy="0" r="10"></circle> <circle cx="100" cy="0" r="10"></circle> </g> <g transform="translate(200,200) rotate(60)"> <path d="M -50,0 L 50,0" stroke="#000"></path> <circle cx="-50" cy="0" r="10"></circle> <circle cx="0" cy="0" r="10"></circle> <circle cx="50" cy="0" r="10"></circle> </g> <g transform="translate(550,150) rotate(-20)"> <path d="M -100,0 L 100,0" stroke="#000"></path> <circle cx="-100" cy="0" r="10"></circle> <circle cx="0" cy="0" r="10"></circle> <circle cx="100" cy="0" r="10"></circle> </g> </svg> </div></body>