问答详情
源自:2-3 线条组成的图形和beginPath

当linewidth=10的时候我得到了一个缺角的三角形,谁能帮我修改下代码让我得到一个完整的三角形

547d4c8800014f5205000418.jpg

<!DOCTYPE html>

<html>

<head>

  <meta charset="UTF-8">

  <title>Canvas 特效</title>

</head>

<body>

  <canvas id="canvas" style="border:1px solid #aaa; display:block; margin:50px auto;" > 

   当前浏览器不支持Canvas,请更换浏览器后再试

  </canvas>


  <script>

     window.onload = function(){

     

           var canvas = document.getElementById("canvas");

           

               canvas.width = 800;

               canvas.height = 800;     

     

           var context = canvas.getContext("2d");


           context.moveTo(100,100);

           context.lineTo(700,700);

           context.lineTo(100,700);

           context.lineTo(100,100);

           context.lineWidth = 10;

           context.strokeStyle = "red";

           context.stroke();


     }

  </script>

</body>

</html>


提问者:白水向前冲 2014-12-02 13:22

个回答

  • l1uyub0b0b0
    2014-12-02 16:17:21
    已采纳

    接着往后看,要使用closePath

  • 8年默
    2014-12-04 16:25:26

    最后一个context.lineTo(100,100); 可以改为 context.closePath();也可以在其后面加上 context.closePath();