您的位置:68399皇家赌场 > 服务器租用 > JS canvas动态绘制饼图的方法言传身教

JS canvas动态绘制饼图的方法言传身教

发布时间:2019-07-13 06:50编辑:服务器租用浏览(89)

    但愿本文所述对大家JavaScript程序设计有所扶助。

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
      <title>canvas画圆圈</title>
      <script type="text/javascript" >
      function drawCircle(id){
        var canvas = document.getElementById(id);
        if(canvas ) {
          var context = canvas.getContext("2d");
          context.fillStyle = "gray";
          context.strokeStyle = "black";
          context.fillRect(0, 0, 400, 400);
          context.beginPath();
          context.arc(100, 100, 50, 0, Math.PI*2, true);
          context.closePath();
          context.fillStyle = "green";
          context.fill();
        } else {
          return;
        }
      }
      window.onload = function () {
        drawCircle("canvas");
      }
      </script>
    </head>
    <body>
    <canvas id="canvas" width="400" style="background:red;" height="400"></canvas>
    <hr />
    </body>
    </html>
    

    企望本文所述对我们JavaScript程序设计有所支持。

    指望本文所述对大家JavaScript程序设计有所支持。

    你恐怕感兴趣的篇章:

    • JS canvas绘制的动态电子表动画成效
    • js html5兑现canvas绘制圆形图案的章程
    • js canvas轻巧绘制圆圈的艺术
    • javascript HTML5 Canvas绘制转盘抽取奖金
    • js html5达成canvas绘制镂空字体文本的办法
    • JavaScript html5 canvas绘制的小丑效果
    • js html5兑现canvas绘制圆锥形图案的章程
    • JavaScript html5 canvas绘制渐变区域完全实例
    • JS canvas动态绘制饼图的方法以身作则

    切实代码如下:

    一体化实例代码:

    完整代码:

    本文由68399皇家赌场发布于服务器租用,转载请注明出处:JS canvas动态绘制饼图的方法言传身教

    关键词: 68399皇家赌场