@sergey_ovechkin

Почему метод putImageData библиотеки canvas вырезает пиксели?

Подскажите пожалуйста кто сталкивался с подобным вопросом, искал в гугле не нашол.

Суть проблемы в том что я создаю объект ImageData с прозрачностью равной 0, но метод putImageData
его вырезает, вместо того чтобы нарисовать с веху.

const canvas = document.getElementById('canvas');
   const ctx = canvas.getContext('2d');
  ctx.fillStyle = 'green';
  ctx.fillRect(0, 0, 400, 400);
	
  var imgMap = ctx.getImageData(20, 20, 50 , 50);
	
	for(var y=0; y< 50; y++){
		for(var x=0; x<50; x++){
			
			var i = (y*50+x)*4;
			
			imgMap.data[i] = 255;
			imgMap.data[i+1] = 0;
			imgMap.data[i+2] = 0;
			imgMap.data[i+3] = 0;		
		}	
	}
	
	ctx.putImageData(imgMap, 20, 20);


5f362224ad6ad776398609.png
  • Вопрос задан
  • 94 просмотра
Решения вопроса 1
twobomb
@twobomb
Он вставляет прозрачным. Что такое по вашему прозрачность?
Измените фон страницы на красный и он будет красным, а не белым
P.S. Может вы ожидали что в этом квадрате будет видна стенка за монитором?
P.P.S. Достаточно было написать imgMap.data[i+3] = 0; , остальные не имеют значения когда нет альфы
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы