svg js 在多个同心圆上标点

效果图：

代码：

function initMark( rad) {
    var center = {x:200,y:200}; //圆心坐标
    var radius = getRad(rad); //半径

    var mun = Math.floor(Math.random() * 360 + 1);//1-360度
    var hudu = (2*Math.PI / 360) * mun; //弧度

    var X = center.x + Math.sin(hudu) * radius ; //求出xx度角的x坐标
    var Y = center.y - Math.cos(hudu) * radius ; //求出xx度角的y坐标


    var svg = document.getElementById('myCircle');
    var newElement = document.createElementNS("http://www.w3.org/2000/svg", 'rect');
    newElement.setAttribute("x", X-15); //-15为了显示在园内
    newElement.setAttribute("y", Y-15);
    newElement.setAttribute("width", 5);
    newElement.setAttribute("height", 5);

    newElement.style.stroke = "#000000"; //Set stroke colour
    newElement.style.strokeWidth = "5px"; //Set stroke width

    svg.appendChild(newElement);


  }