- Trending Categories
- Data Structure
- Operating System
- C Programming
- Selected Reading
- UPSC IAS Exams Notes
- Developer's Best Practices
- Questions and Answers
- Effective Resume Writing
- HR Interview Questions
- Computer Glossary
- Who is Who
How to draw lines using HTML5 Canvas?
The HTML5 <canvas> tag is used to draw graphics, animations, etc. using scripting. It is a new tag introduced in HTML5. Use the lineTo() method to draw lines using HTML5 canvas.
You can try to run the following code to learn how to draw lines using HTML5 Canvas
<!DOCTYPE html> <html> <head> <title>HTML5 Canvas Tag</title> </head> <body> <canvas id="newCanvas" width="400" height="300" style="border:1px solid #000000;"></canvas> <script> var c = document.getElementById('newCanvas'); var ctx = c.getContext('2d'); // Drawing lines ctx.beginPath(); ctx.moveTo(30, 30); ctx.lineTo(180, 100); ctx.moveTo(30, 10); ctx.lineTo(260, 100); ctx.stroke(); </script> </body> </html>
- How to draw a star by using canvas HTML5?
- How to draw grid using HTML5 and canvas or SVG?
- How to draw an oval in HTML5 canvas?
- How to draw large font on HTML5 Canvas?
- How to draw a rectangle on HTML5 Canvas?
- Draw Bezier Curve with HTML5 Canvas
- Draw a shadow with HTML5 Canvas
- How to draw a Bezier Curve with HTML5 Canvas?
- How to draw a quadratic curve on HTML5 Canvas?
- How to draw an SVG file on an HTML5 canvas?
- Load image from url and draw to HTML5 Canvas
- HTML5 drawImage() method to draw image onto the canvas
- HTML5 Canvas drawings like lines are looking blurry
- Draw part of an image inside HTML5 canvas
- How to draw shapes using SVG in HTML5?