1. 程式人生 > >繪製多條平滑曲線(基於二次貝塞爾曲線)

繪製多條平滑曲線(基於二次貝塞爾曲線)

繪製策略:在每兩對點之間,加入一個新點(中間點)放在這兩點的正中間。然後使用這些中間點作為起點和終點,而把最初的那些點(原始點)作為控制點。 

之前使用二次貝塞爾曲線繪製兩點的策略是已知的兩點作為起始點和終點,然後求出這兩點的中點作為控制點來繪製,結果曲線的圓滑程度不符合我所要求,之後使用上面的策略,曲線平滑程度得到了改善。

Java程式碼  收藏程式碼
  1. package  
  2. {  
  3.     import flash.display.Sprite;  
  4.     import flash.events.MouseEvent;  
  5.     public class MultiCurves3 extends
     Sprite  
  6.     {  
  7.         private var numPoints:uint = 9;  
  8.         public function MultiCurves3()  
  9.         {  
  10.             init();  
  11.         }  
  12.         private function init():void  
  13.         {  
  14.             var points:Array = new Array();  
  15.             for (var i:int = 0; i < numPoints; i++)  
  16.             {  
  17.                 points[i] = new Object();  
  18.                 points[i].x = Math.random() * stage.stageHeight;  
  19.                 points[i].y = Math.random() * stage.stageHeight;  
  20.             }  
  21.             // find the first midpoint and move to it  
  22.             var xc1:Number = (points[0].x + points[numPoints - 1
    ].x) / 2;  
  23.             var yc1:Number = (points[0].y + points[numPoints - 1].y) / 2;  
  24.             graphics.lineStyle(1);  
  25.             graphics.moveTo(xc1, yc1);  
  26.             // curve through the rest, stopping at midpoints  
  27.             for (i = 0; i < numPoints - 1; i ++)  
  28.             {  
  29.                 var xc:Number = (points[i].x + points[i + 1].x) / 2;  
  30.                 var yc:Number = (points[i].y + points[i + 1].y) / 2;  
  31.                 graphics.curveTo(points[i].x, points[i].y, xc, yc);  
  32.             }  
  33.             // curve through the last point, back to the first midpoint  
  34.             graphics.curveTo(points[i].x, points[i].y, xc1, yc1);  
  35.         }  
  36.     }  
  37. }