HLJ 发布于
2018-08-20 09:25:05

HTML5 Canvas设置线条的宽度

上一篇文章:

HTML5 Canvas绘制一条线

要定义HTML5 Canvas行的宽度,我们可以使用canvas上下文的lineWidth属性。 必须在调用stroke()之前设置lineWidth属性。
html代码:
<!DOCTYPE HTML>
<html>
  <head>
    <style>
      body {
        margin: 0px;
        padding: 0px;
      }
    </style>
  </head>
  <body>
    <canvas id="myCanvas" width="578" height="200"></canvas>
    <script>
      var canvas = document.getElementById('myCanvas');
      var context = canvas.getContext('2d');

      context.beginPath();
      context.moveTo(100, 150);
      context.lineTo(450, 50);
      context.lineWidth = 15;
      context.stroke();
    </script>
  </body>
</html>

当前文章内容为原创转载请注明出处:http://www.good1230.com/detail/2018-08-20/131.html
最后生成于 2023-06-18 18:37:34
上一篇文章:

HTML5 Canvas绘制一条线

此内容有帮助 ?
0