Question

我想绘制圆周长的左下部分（6到9点）的一系列点。但是，渲染X，Y坐标的起点总是从3点开始。！https://dl.dropboxusercontent.com/u/55849501/plotting-xy.png

这是我的代码的渲染部分：

var items = 5;
for(var i = 0; i < items; i++) {
    var x = 96 + 100 * Math.cos(0.665 * Math.PI * i / items);
    var y = 96 + 100 * Math.sin(0.665 * Math.PI * i / items);   
    $("#center").append("<div class='point' style='left:"+ x +"px;top:"+ y +"px'></div>");    
}

以下是代码的实用内容：http://jsfiddle.net/jE26S/198/

总结：我想让点从6点钟位置开始渲染而不是3点钟位置。

Answer 1

这样的东西？

var x = 86 + 100 * Math.cos(0.665 * Math.PI * (items-1+i-0.5) / items);
var y = 96 + 100 * Math.sin(0.665 * Math.PI * (items-1+i-0.5) / items);

Answer 2

你在这里真正做的是在theta的两个值之间进行插值。在你的情况下，你想从Pi / 2开始到Pi结束。我冒昧地使用这种插值范例重新编写你的代码片段。此外，您可以使用outerCircleRadius调整点/项远离圆的距离。

var items = 5;
var startTheta = .5 * Math.PI;
var endTheta = 1 * Math.PI;
var outerCircleRadius = 112;
var cx = 90;
var cy = 90;
for(var i = 0; i < items; i++) {
    var theta = startTheta + (endTheta - startTheta) * i / (items - 1)
    var x = cx + outerCircleRadius * Math.cos(theta);
    var y = cy + outerCircleRadius * Math.sin(theta);   
    $("#center").append("<div class='point' style='left:"+ x +"px;top:"+ y +"px'></div>");    
}

如何移动在圆周上绘制的X，Y坐标的起点？

2 个答案: