JavaScript和三角/椭圆

我一直在使用这个椭圆函数（我发现在维基百科http://en.wikipedia.org/wiki/Ellipse）用于在布局中绘制点。我一直在用椭圆形绘制两到五个点，没有任何问题。该函数有一个名为'steps'的参数; 'steps'参数设置椭圆周围绘制点的数量。JavaScript和三角/椭圆

以下是主要问题：如果'steps'（绘制的点数）等于数字7,11,13或14，则会打破。自从我进行三角学习已有几年了，所以基本上我被卡住了。

第二个小问题：我有打印所有点的代码，但是当我复制/粘贴并删除无关代码以在此处发布时，它仅打印出最后一个绘图点（不知道为什么）。

<html> 
<head> 
<script type="text/javascript"> 
    var elipticalLayout=new Array(); 
    for (i=0; i <36; i++){ 
     elipticalLayout[i]=new Array(2); 
    } 

    /* 
    * This functions returns an array containing the specified 
    * number of 'steps' (points) to draw an ellipse. 
    * 
    * @param x {double} X coordinate 
    * @param y {double} Y coordinate 
    * @param a {double} Semimajor axis 
    * @param b {double} Semiminor axis 
    * @param angle {double} Angle of the ellipse 
    * 
    * Attribution: This function is from http://en.wikipedia.org/wiki/Ellipse 
    */ 
    function calculateEllipticalLayout(x, y, a, b, angle, steps) { 

     var points = []; 

     // Angle is given by Degree Value 
     var beta = -angle * (Math.PI/180); //(Math.PI/180) converts Degree Value into Radians 
     var sinbeta = Math.sin(beta); 
     var cosbeta = Math.cos(beta); 

     for (var i = 0; i < 360; i += 360/steps) //{ 
     var alpha = i * (Math.PI/180) ; 
     var sinalpha = Math.sin(alpha); 
     var cosalpha = Math.cos(alpha); 

     var X = x + (a * cosalpha * cosbeta - b * sinalpha * sinbeta); 
     var Y = y + (a * cosalpha * sinbeta + b * sinalpha * cosbeta); 
     elipticalLayout[i/(360/steps)][0]=X; 
     elipticalLayout[i/(360/steps)][1]=Y; 
    } 

    </script> 
</head> 
<body> 
    <script type="text/javascript"> 

     calculateEllipticalLayout(300, 300, 245, 125, 15, 15); 

     for (i=0; i<elipticalLayout.length; i++){ 
      document.write(i + ", " + elipticalLayout[i][0] + ", " + elipticalLayout[i][1] + "<br>"); 
     } 
    </script> 

</body> 
</html>

来源

2011-05-16 John R

您只填写steps elipticalLayout中的元素数。但试图输出36个。

这个elipticalLayout[i/(360/steps)][0]=X;是错误的，因为会导致序列中由于float到int四舍五入造成的“漏洞”。

你应该有这样的事情：

var n = 0; 
for(...) 
    elipticalLayout[n][0]=X; 
    elipticalLayout[n][1]=Y; 
    ++n;

来源

2011-05-16 01:51:23

我会考虑一下;谢谢。关于阵列，阵列反复使用以布置具有不同数量点的不同椭圆。我一直在追踪步数（点数），所以数组大于实数点的数量并不是问题（虽然我意识到这不是一个优化解决方案，但我不相信数组的大小是一个问题）。 – 2011-05-16 01:56:23

修复它。谢谢。 – 2011-05-16 02:08:30

我想声明函数内elipticalLayout并返回。以下是我如何编写函数。

请注意，javascript中不存在“double”或甚至整数，变量的类型由其值定义。数字只是数字，它们可以是原始数字或数字对象（几乎从不需要）。

如果您使用返回值以像素为单位绘制位置，则可能需要先将它们四舍五入为整数。我用一个简单的截断方法将它们转换为整数。

var elipticalLayout = []; 

/* 
* This functions returns an array containing the specified 
* number of 'steps' (points) to draw an ellipse. 
* 
* @param x  - X coordinate 
* @param y  - Y coordinate 
* @param a  - Semimajor axis 
* @param b  - Semiminor axis 
* @param angle - Angle of the ellipse 
* 
* Attribution: This function is from http://en.wikipedia.org/wiki/Ellipse 
*/ 
function calculateEllipticalLayout(x, y, a, b, angle, steps) { 

    var points = []; 
    var step = 360/steps; 
    var k = Math.PI/180; // Convert deg to rad 
    var cos = Math.cos; 
    var sin = Math.sin; 
    var i = 0; 

    // Convert angle to radians 
    var beta = -angle * k; 
    var sinbeta = sin(beta); 
    var cosbeta = cos(beta); 

    while (i < 360) { 

    var alpha = i * k; 
    var sinalpha = sin(alpha); 
    var cosalpha = cos(alpha); 

    var X = x + (a * cosalpha * cosbeta - b * sinalpha * sinbeta); 
    var Y = y + (a * cosalpha * sinbeta + b * sinalpha * cosbeta); 

    // Truncate numbers to integer and put into array 
    elipticalLayout.push([X|0, Y|0]); 

    // Keep X,Y as floats 
    // elipticalLayout.push([X, Y]); 

    i += step; 
    } 
}

来源

2011-05-16 03:33:41 RobG

JavaScript和三角/椭圆

回答

相关问题