HTML5 - Изменить непрозрачность ничьей Прямоугольник

Скажем, я рисую элемент HTML5 прямоугольника, используя это:

context.clearRect(25, 72, 32, 32);

Как я могу сделать его прозрачным на 50%?

Ответы

Ответ 1

Использовать globalAlpha. Вам также придется рисовать с помощью fillRect. clearRect просто стирает пиксели. Он не может частично стираться, поэтому вам придется использовать fillRect или другие примитивы рисования.

из w3schools.com:

    ctx.globalAlpha = 0.2;
    ctx.fillRect(50,50,75,50);
    ctx.globalAlpha = 1.0;

Ответ 2

ClearRect удаляет то, что было там, и оставляет его пустым. Лучший способ - использовать значение rgba fillStyle, поскольку оно сделает только прямоугольник (или любую другую фигуру, которую вы рисуете) прозрачным. Код будет выглядеть следующим образом:

ctx.fillStyle = 'rgba(225,225,225,0.5)';
ctx.fillRect(25,72,32,32);

(спасибо Как изменить непрозрачность (альфа, прозрачность) элемента в элементе canvas после его рисования?)