贝塞尔曲线绘制

来源：互联网发布：android 流程图软件编辑：程序博客网时间：2024/05/24 01:49

[代码] [JavaScript]代码

01function draw(id)
02{
03        var canvas=document.getElementById(id);
04        if(canvas==null)
05        return false;
06        var context=canvas.getContext('2d');
07        context.fillStyle="#eeeeff";
08        context.fillRect(0,0,400,300);
09        var n=0;
10        var dx=150;
11        var dy=150;
12        var s=100;
13        context.beginPath();
14        context.globalCompositeOperation='and';
15        context.fillStyle='rgb(100,255,100)';
16        context.strokeStyle='rgb(0,0,100)';
17        var x=Math.sin(0);
18        var y=Math.cos(0);
19        var dig=Math.PI/15*11;
20        for(var i=0;i<30;i++)
21        {
22                var x=Math.sin(i*dig);
23                var y=Math.cos(i*dig);
24                context.bezierCurveTo(dx+x*s,dy+y*s-100,dx+x*s+100,dy+y*s,dx+x*s,dy+y*s);
25        }
26        context.closePath();
27        context.fill();
28        context.stroke();
29  
30}