当前位置:编程学习 > C#/ASP.NET >>

求画圆的算法

<script>
//code by redhacker
function drawCircle(r){
var x0 = screen.width/2;//圆心纵坐标
var y0 = screen.height/2;//圆心横坐标
var r0 = Number(r);//半径
var x1 = x0-r0;
var x2 = x0+r0;
var x,y;
document.write("<div style=\"position:absolute;left:"+ x0 +"px;top:500px;color: #FF0000\"><h2>Draw Circle Demo</h2></div>");
for(var i=x1;i<=x2;i++){
x = i;
y = Math.sqrt(Math.pow(r0,2) - Math.pow(x - x0,2)) + y0;
document.write("<div style=\"position:absolute;left:"+ x +"px;top:"+ y +"px;color: #FF0000\">.</div>");
}
for(var i=x2;i>=x1;i--){
x = i;
y = -Math.sqrt(Math.pow(r0,2) - Math.pow(x - x0,2)) + y0;
document.write("<div style=\"position:absolute;left:"+ x +"px;top:"+ y +"px;color: #FF0000\">.</div>");
}
}
</script>
<input name="radii" type="text" id="radii" value="100" size="10" />
<input type="submit" name="Submit" value="画圆" onclick="drawCircle(document.getElementById('radii').value)"/>


哪位给我解释一下这个画圆的算法、公式或原理,越详细越好,谢谢!!

如果要求平均在圆上的8个点坐标,该如何求得? --------------------编程问答-------------------- 额,“圆的标准方程”应该是高中的内容吧

自己百度把,估计百度百科上有详细的解释 --------------------编程问答-------------------- 除 --------------------编程问答-------------------- 勾股定理算出圆上的一系列坐标点,每个点放置一个div并填充为红色,最后就连成一个圆。
求平均在圆上的8个点坐标,就要知道角度了,例如0度、45度、90度、135度、180度、225度、270度、315度。通过角度和半径算出以圆心为参考的相对坐标,然后把圆心的坐标加进去,算出页面坐标就可以了。 --------------------编程问答--------------------

function drawCircle(r)
{     var x0 = screen.width/2;//圆心纵坐标
       var y0 = screen.height/2;//圆心横坐标
       var r0 = Number(r);//半径
       var x1 = x0-r0; //圆的最左端点的x坐标,相当于画圆的左边起点
       var x2 = x0+r0;//圆的最右端点的x坐标,相当于画圆的右边终点
      var x,y;//画圆的点
      document.write("<div style=\"position:absolute;left:"+ x0+"px;top:500px;color: #FF0000\"><h2>Draw Circle Demo</h2></div>");
      for(var i=x1;i<=x2;i++) //从左往右画圆,画圆的上半圆弧
      {      x = i; //圆点的x坐标
             y = Math.sqrt(Math.pow(r0,2) - Math.pow(x - x0,2)) + y0;//利用勾股定理R2=x2+y2,通过半径、X方向位置长度,计算y坐标 
             document.write("<div style=\"position:absolute;left:"+ x +"px;top:"+ y +"px;color: #FF0000\">.</div>");  //画圆上的点
     }
     for(var i=x2;i>=x1;i--)//画下半圆弧,方法同上
     {     x = i;
           y = -Math.sqrt(Math.pow(r0,2) - Math.pow(x - x0,2)) + y0;         document.write("<div style=\"position:absolute;left:"+ x +"px;top:"+ y +"px;color: #FF0000\">.</div>");
     } }




这个算法效率不高,画的也不均匀,一般都是用角坐标来画的,用Sin和Cos来求X、Y,这样比较均匀。
--------------------编程问答-------------------- 加上个角度,用sin和cos算八个点

<html>
<head>
</head>
<body>
<script>
//code by redhacker
function drawCircle(r,j){
var x0 = screen.width/2;//圆心纵坐标
var y0 = screen.height/2;//圆心横坐标
var r0 = Number(r);//半径
var x1 = x0-r0;
var x2 = x0+r0;
var x,y;
document.write("<div style=\"position:absolute;left:"+ x0 +"px;top:500px;color: #FF0000\"><h2>Draw Circle Demo</h2></div>");
for(var i=x1;i<=x2;i++){
x = i;
y = Math.sqrt(Math.pow(r0,2) - Math.pow(x - x0,2)) + y0;
document.write("<div style=\"position:absolute;left:"+ x +"px;top:"+ y +"px;color: #00FF00\">.</div>");
}
for(var i=x2;i>=x1;i--){
x = i;
y = -Math.sqrt(Math.pow(r0,2) - Math.pow(x - x0,2)) + y0;
document.write("<div style=\"position:absolute;left:"+ x +"px;top:"+ y +"px;color: #00FF00\">.</div>");
}
var j0=Number(j);
j0=(j0/180)*Math.PI;
j1=Math.PI/4;
for(var i=0;i<8;i++)
{
j0=j0+i*j1;
x=x0+Math.cos(j0)*r;
y=y0+Math.sin(j0)*r;
document.write("<div style=\"position:absolute;left:"+ x +"px;top:"+ y +"px;color: #FF0000\">.</div>");
}
}
</script>
<input name="radii" type="text" id="radii" value="100" size="10" />
<input name="jiaodu" type="text" id="jiaodu" value="0" size="10" />
<input type="submit" name="Submit" value="画圆" onclick="drawCircle(document.getElementById('radii').value,document.getElementById('jiaodu').value)"/>
</body>
</html>
--------------------编程问答--------------------
引用 3 楼 hengwang007 的回复:
勾股定理算出圆上的一系列坐标点,每个点放置一个div并填充为红色,最后就连成一个圆。
求平均在圆上的8个点坐标,就要知道角度了,例如0度、45度、90度、135度、180度、225度、270度、315度。通过角度和半径算出以圆心为参考的相对坐标,然后把圆心的坐标加进去,算出页面坐标就可以了。


假如知道中心点(x,y)的坐标, 能否算出平均的N个点的坐标?? --------------------编程问答--------------------
引用 4 楼 attidust 的回复:
JavaScript code
?



12345678910111213141516171819

function drawCircle(r) {     var x0 = screen.width/2;//圆心纵坐标        var y0 = screen.height/2;//圆心横坐标        var r0 = Number(r);//半径        va……


能否举个例子呀?? --------------------编程问答--------------------
引用 6 楼 xiaocai0923 的回复:
假如知道中心点(x,y)的坐标, 能否算出平均的N个点的坐标??


使用角度。已知圆心坐标和半径长度,就可以算出各个角度下的x、y坐标。

上面有那么多答复已经说了。你是不是不理解三角函数呢? --------------------编程问答--------------------
引用 8 楼 sp1234 的回复:
引用 6 楼 xiaocai0923 的回复:
假如知道中心点(x,y)的坐标, 能否算出平均的N个点的坐标??

使用角度。已知圆心坐标和半径长度,就可以算出各个角度下的x、y坐标。

上面有那么多答复已经说了。你是不是不理解三角函数呢?


几何知识都忘了, 不明白他所说的角度是什么意思, 为什么要输入一个角度呢? 请大哥解释一下好吗?小弟不才. --------------------编程问答-------------------- 强烈建议学完高中再编程。 --------------------编程问答--------------------
引用 3 楼 hengwang007 的回复:
勾股定理算出圆上的一系列坐标点,每个点放置一个div并填充为红色,最后就连成一个圆。
求平均在圆上的8个点坐标,就要知道角度了,例如0度、45度、90度、135度、180度、225度、270度、315度。通过角度和半径算出以圆心为参考的相对坐标,然后把圆心的坐标加进去,算出页面坐标就可以了。


如果改成画9个或10个点, 只修改循环的个数好像不行也, 怎么弄呢, 大哥. --------------------编程问答--------------------
var j0=Number(j);
j0=(j0/180)*Math.PI;
j1=Math.PI/3;
for(var i=0;i<6;i++)
{
j0=j0+i*j1;
x=x0+Math.cos(j0)*r;
y=y0+Math.sin(j0)*r;
document.write("<div style=\"position:absolute;left:"+ x +"px;top:"+ y +"px;color: #FF0000\">.</div>");
if (i != 0) {
    strPoints += "、";
}
strPoints += "("+x+","+y+")";
}


分为6个点, 平均是60度, 60度是特殊角对应的是π/3, 怎么不对呢?? 急求呀.. --------------------编程问答--------------------             double oldWidth = (double)100;
            //角度转弧度 角度*PI/180
            double theta = angle * Math.PI / 180;
            double locked_theta = theta;
            double adjacentTop = Math.Cos(locked_theta) * 50; //X
            //底边长
            double oppositeTop = Math.Sin(locked_theta) * 50; //Y
我也研究了好久,我初中没念完,自己学的。 --------------------编程问答-------------------- 圆的标准方程中(x-a)^2+(y-b)^2=r^2中,有三个参数a、b、r,只要求出a、b、r,这时圆的方程就被确定,因此确定圆方程,须三个独立条件,其中圆心坐标是圆的定位条件,半径是圆的定形条件。
补充:.NET技术 ,  ASP.NET
CopyRight © 2012 站长网 编程知识问答 www.zzzyk.com All Rights Reserved
部份技术文章来自网络,