Рисовать на холсте JavaScript
Все рисование на холсте HTML должно быть сделано с JavaScript:
пример
<script>
var canvas = document.getElementById("myCanvas");
var ctx = canvas.getContext("2d");
ctx.fillStyle = "#FF0000";
ctx.fillRect(0,0,150,75);
</script>
Попробуй сам " Шаг 1: Найдите элемент Canvas
Прежде всего, вы должны найти <canvas> элемент.
Это делается с помощью метода HTML DOM getElementById() :
var canvas = document.getElementById("myCanvas");
Шаг 2: Создание объекта чертежа
Во-вторых, вам нужен графический объект для холста.
getContext() представляет собой встроенный в HTML - объект, со свойствами и методами для рисования:
var ctx = canvas.getContext("2d");
Шаг 3: рисовать на холсте
И, наконец, вы можете рисовать на холсте.
Установите стиль заливки объекта рисования до красного цвета:
ctx.fillStyle = "#FF0000";Свойство FillStyle может быть цвет CSS, градиент или узор. По умолчанию FillStyle черный.
fillRect( x,y,width,height ) метод рисует прямоугольник, заполненный с стилем заливки, на холсте:
ctx.fillRect(0,0,150,75);