Как заполнить весь холст определенным цветом

17

Как заполнить весь HTML5 <canvas> одним цветом.

Я видел некоторые решения, такие как для изменения цвет фона с использованием CSS, но это не очень хорошее решение, поскольку холст остается прозрачным, единственное, что меняется, это цвет занимаемого им пространства.

Другим является создание чего-то с цветом внутри холста, например прямоугольником ( см. здесь ), но он по-прежнему не заполняет весь холст цветом (в случае, если холст больше, чем форма, которую мы создали).

Есть ли решение для заполнения всего холста конкретным цветом?

    
задан Enve 02.01.2015 в 02:09
источник

1 ответ

40

Да, просто заполните прямоугольник сплошным цветом на холсте, используйте height и width самого холста:

var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");
ctx.fillStyle = "blue";
ctx.fillRect(0, 0, canvas.width, canvas.height);
canvas{ border: 1px solid black; }
<canvas width=300 height=150 id="canvas">
    
ответ дан Spencer Wieczorek 02.01.2015 в 02:14
источник