围绕圆圈对齐元素

时间:2014-09-18 18:15:23

标签: javascript jquery css alignment raphael

我正在尝试使用jQuery的cos和sin函数在圆圈中对齐元素。我目前遇到的问题是我的问题" dot"未正确排列。我通过将总点数除以总计 - 360度圆半径来计算角度。它以某种方式给我带来麻烦,我似乎无法找到答案。

var paper = Raphael('svg', '100%', '100%');
var circles = 20;
var angle = 360 / circles;

for (i = 0; i < circles; i++) {
    var x = 200 + 100 * Math.sin(angle * i);
    var y = 200 + 100 * Math.cos(angle * i);
    console.log(angle * i);
    paper.circle(x, y, 10).attr({
        fill: 'green'
    });
}
.wrapper {
width:100%;
height:100%;
position:absolute;
}
#svg {
    width:100%;
    height:100%;
    position:relative;
    background:gray;
}
<div class="wrapper">
<div id="svg"></div>
</div>

1 个答案:

答案 0 :(得分:1)

Math.sin正在使用radians,因此请使用 2 *π而不是 360

var angle = 2 * Math.PI / circles;