我试图围绕一个正方形绘制坐标

时间:2012-11-30 14:13:44

标签: javascript math loops

我正在尝试以编程方式在一个正方形周围绘制坐标,这是一个很难编码以显示我所追求的内容。

http://jsfiddle.net/zwkny/

// amount of chairs
var aoc = 4;
// table width
var tw = 200;
// table height
var th = 200;

// chair width height
var cwh = 60 / 2;

var space = tw * 4 / aoc;

var left = [-30,100,-30,-160];
var top = [-160,-30,100,-30];

// straing point
var sp = 12;

for(var i=0; i<aoc; i++){


    var x = cwh + space * i / aoc;
    console.log(x);
    //var y = space / 2 - cwh * i;

    $("#center").append("<div class='chair' style='left:"+left[i]+"px;top:"+top[i]+"px;'>"+i+"</div>");

}
数学绝对不是我的强项,只是想我会在这里发布看看是否有人可以帮助指出我正确的方向我继续前进并更新如果我得到它?

我需要用这种方式来代表人们站在大广场周围的小圆圈,但会有随机数量的人,他们都需要在相同的距离。

我昨天发布了关于圆形物体的相同帖子,现在我在广场上,我无法理解数学,任何帮助。

感觉这已经被投票了,只是以为我会更新一篇文章将所有这些放在一起 http://devsforrest.com/116/plot-positions-around-shapes-with-javascript 希望它可以帮助别人

1 个答案:

答案 0 :(得分:1)

var x,y;

// amount of chairs
var totalChairs = 12;
// square size
var squareSize = 200;
var chairSize = 20;

for(var i=0; i<totalChairs; i++){

var angle = 2*Math.PI * i/totalChairs;

if (angle > Math.PI/4 && angle <= Math.PI* 3/4){
    x = (squareSize/2) / Math.tan(angle);
    y = -squareSize/2;
} else if (angle > Math.PI* 3/4 && angle <= Math.PI* 5/4){
    x = -squareSize/2;
    y = (squareSize/2) * Math.tan(angle);
} else if (angle > Math.PI* 5/4 && angle <= Math.PI* 7/4){
    x = -(squareSize/2) / Math.tan(angle);
    y = -squareSize/2 + squareSize;
} else {
    x = -squareSize/2 + squareSize;
    y = -(squareSize/2) * Math.tan(angle);
}

x -= chairSize/2;
y -= chairSize/2;

$("#center").append("<div class='chair' style='left:"+x+"px;top:"+y+"px;'></div>");
}

Demo