Как создать новый элемент Canvas на веб-странице?

@krista 

Для создания нового элемента Canvas на веб-странице нужно сначала определить местоположение и размеры элемента на странице с помощью HTML-тега canvas и CSS-свойства:

1
2
3
4
5
6
7

  #myCanvas {
    border: 1px solid black;
  }

Затем можно получить доступ к элементу Canvas в JavaScript, используя его ID, и выполнять рисование на нем с помощью методов canvas API:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13

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

// Нарисовать линию
ctx.beginPath();
ctx.moveTo(0, 0);
ctx.lineTo(200, 200);
ctx.stroke();

// Нарисовать круг
ctx.beginPath();
ctx.arc(300, 100, 50, 0, 2 * Math.PI);
ctx.fill();

Методы canvas API позволяют рисовать различные фигуры, линии, тексты, а также использовать градиенты и шаблоны для создания более сложных изображений.