Как сделать полупрозрачные фигуры в canvas?

Чтобы сделать полупрозрачные фигуры в canvas, можно использовать свойство globalAlpha или функцию rgba(). developer.mozilla.org professorweb.ru

Свойство globalAlpha позволяет задать значение прозрачности для всех будущих фигур, которые будут нарисованы на canvas. developer.mozilla.org Значение полупрозрачности может быть между 0,0 (полная прозрачность) и 1,0 (полная непрозрачность). developer.mozilla.org По умолчанию свойство равно 1,0 (полная непрозрачность). developer.mozilla.org

Функция rgba() позволяет установить прозрачность индивидуально для каждой формы, когда указывается её цвет. developer.mozilla.org Функция принимает три параметра — значения красной, зелёной и синей цветовых составляющих (от 0 до 255) и дополнительное значение альфа-канала (от 0 до 1), которое указывает прозрачность цвета. professorweb.ru Значение альфа, равное 1, соответствует полной непрозрачности, а значение, равное 0 — полной прозрачности. professorweb.ru

Выбор подхода зависит от задачи: если требуется нарисовать несколько фигур разного цвета, но с одинаковым уровнем прозрачности, то лучше использовать свойство globalAlpha. professorweb.ru Если же нужен один прозрачный цвет, то лучше применять функцию rgba(). professorweb.ru