html5 canvas绘制矩形和圆形的实例代码

2020-04-24 19:49:32易采站长站整理

    }   
    //绘制圆形   
   function drawarc(){   
    var canvas2=document.getElementById(‘yuan’); //获取canvas元素   
        if (canvas2==null)   
    if(canvas2==null)   
       return false;   
       var context2=canvas2.getContext(‘2d’);  //取得上下文   
       context2.fillStyle=’#EEEEEF’;   
       context2.fillRect(0,0,400,300);   
       var n=0;   
       for(var i=0;i<10;i++){   
              context2.beginPath();  //开始创建路径   
              context2.arc(i*25,i*25,i*10,0,Math.PI*2,true);  //创建圆形路径   
              context2.closePath();  //关闭路径   
              context2.fillStyle=’Rgba(255,0,0,0.25)’; //设置颜色   
              context2.fill();  //填充图形   
       }   
}   
       
       
</script>  

以上就是小编为大家带来的html5 canvas绘制矩形和圆形的实例代码的全部内容了,希望大家多多支持脚步之家。