zoukankan      html  css  js  c++  java
  • canvas绘制圆形

    canvas绘制圆形的思路:

    1、创建路径 XXX.beginpath();

    2、创建圆形的路径;

    3、关闭路径;XXX.closepath(); 路径不关闭也能绘制出图形

    4、设定绘制样式。

    创建圆形路径时需要用到对象的arc方法,方法定义如:XXX.arc(x,y,radius,startAngle,endAngle,anticlockwise)

    x为圆形起点的横坐标,y为圆形起点的纵坐标,radius为圆形半径,startAngle为开始角度,endAngle为结束角度,anticlockwise是否按顺时针方向进行绘制。

     1 <!DOCTYPE html>
     2 <meta charset="utf-8">
     3 <head>
     4 </head>
     5 
     6 <body>
     7 <canvas id="yuanxing" width="1000" height="1000"></canvas>
     8 <script type=text/javascript>
     9 var canvas=document.getElementById("yuanxing");
    10 var context=canvas.getContext("2d");
    11 context.fillStyle="#FF0000";
    12 context.beginPath();
    13 context.arc(700,400,200,0,Math.PI*2,true); //Math.PI*2是JS计算方法,是圆
    14 context.closePath();
    15 context.fill();
    16 </script>
    17 </body>
    18 </html>
  • 相关阅读:
    函数调用本质
    互联网协议入门
    iOS开发系列-Block本质篇
    iOS组件化开发-CocoaPods简介
    版本控制-Git
    iOS开发系列-NSDate
    iOS开发系列-线程同步技术
    Python 抓取网页gb2312乱码问题
    常用正则表达式
    Java 命名规范
  • 原文地址:https://www.cnblogs.com/52css/p/2669150.html
Copyright © 2011-2022 走看看