zoukankan      html  css  js  c++  java
  • HTML5画布

    arc(cx,cy,radius,start_angle,end_angle,direction);

    cx  水平坐标

    cy  垂直坐标

    radius  半径

    start-angel  圆周起始位置  (配图详细解释)

    end_angle  弧长 Math.PI是半圆  Math.PI*2是整个圆  0.5为四分之一

    direction 顺、逆时针  false为顺时针,true为逆时针(决定了圆弧的方向)

     JavaScript 代码:

    <script type="text/javascript">
    
    var c=document.getElementById("myCanvas");
    var cxt=c.getContext("2d");
    cxt.fillStyle="#FF0000";
    cxt.beginPath();
    cxt.arc(70,18,15,0,Math.PI*2,true);
    cxt.closePath();
    cxt.fill();
    
    </script>

    canvas 元素:

    <canvas id="myCanvas" width="200" height="100" style="border:1px solid #c3c3c3;">
    Your browser does not support the canvas element.
    </canvas>

    画半圆

    <script type="text/javascript">
    
        var c=document.getElementById("myCanvas");
        var cxt=c.getContext("2d");
        cxt.fillStyle="#FFFF00";
        cxt.beginPath();
        cxt.arc(200,200,75,0,Math.PI*1.5,true);
        cxt.lineTo(200,200);
        cxt.closePath();
        cxt.fill();
        
    
    </script>

  • 相关阅读:
    代码分层之模拟servlet调用dao
    Request对象和Response对象
    jquery-动画
    jquery-easyui
    phpcms
    Ajax做分页
    phpcms安装
    cms替换主页的步骤
    php 复习
    登录验证——————生成随机数
  • 原文地址:https://www.cnblogs.com/chloe-0328/p/10130479.html
Copyright © 2011-2022 走看看