lineTo() Not working
Question
lineTo() function is not working for me, why? Here is the code.
<canvas id="sid" height="1000px" width="1000px"> </canvas>
<script>
var can = document.querySelector('#sid');
var a = can.getContext('2d');
a.beginPath();
a.moveTo(0, 0);
a.lineTo(140, 140);
a.lineTo(160, 160);
</script>
3 answers
solution1
3 2016-06-06 14:36:03
You forgot to call the stroke() function. It would be very helpful for you to check out the documentation, where it's explained in a more clear way.
From the docs :
The
CanvasRenderingContext2D.stroke()method of the Canvas 2D API strokes the current or given path with the current stroke style using the non-zero winding rule.
<canvas id="sid" height="1000px" width="1000px"></canvas> <script> var can = document.querySelector('#sid'); var a = can.getContext('2d'); a.beginPath(); a.moveTo(0, 0); a.lineTo(140, 140); a.lineTo(160, 160); // After this you need to run the stroke command to get the line. a.stroke(); </script>
solution2
1 2016-06-06 14:37:51
You're not stroking the line after you've defined it. Just add the stroke() method.
<canvas id="sid" height="1000px" width="1000px"> </canvas>
<script>
var can = document.querySelector('#sid');
var a = can.getContext('2d');
a.beginPath();
a.moveTo(0, 0);
a.lineTo(140, 140);
a.lineTo(160, 160);
a.stroke(); // This line is the import one being omitted.
a.closePath(); // You should close your path also. Not absolutely necessary in this case, given that stroke() will do this for you.
</script>
solution3
0 2016-06-06 14:41:32
this help you :
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<canvas id="sid" height="1000px" width="1000px"></canvas>
<script>
var can = document.getElementById("sid");
var a = can.getContext('2d');
a.beginPath();
a.lineWidth = "5";
a.strokeStyle = "green";
a.moveTo(0,0);
a.lineTo(140,140);
a.lineTo(160,160);
a.stroke();
</script>
</body>
</html>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.