How to create a canvas in Html5

Question

I want to know it.

Answer 1

in xxxxx.html (example for canvas 400x400 with black border 1px)

<canvas id="canvas" width="400" height="400" style="border:1px solid #000000;">

in xxxxx.js (you need js to draw something)

const myCanvas = document.getElementById('canvas');
const ctx = myCanvas.getContext('2d');

Answer 2

use the <canvas></canvas> element inside the body of the html document

Answer 3

window.onload = function(){
const myCanvas=document.getElementById("canvas");
const ctx=myCanvas.getContext("2d");
ctx.beginPath();
ctx.arc(100,75,50,0,2*Math.PI);
ctx.stroke();
}

window.onload - waiting for DOM otherwise can you have error that element returns null

ctx.beginPath(); - start drawning

ctx.arc(100,75,50,0,2*Math.PI);

in example:
100 - x center coordinats
75 - y center coordinats
50 - radius
0 - start (in radians)
2*Math.PI - finish (in radians)

2*Math.PI means full circle

ctx.stroke(); - ending draw

Answer 4

Thanks you all! :)