HTML5 canvas使用ImageData设置像素之后会有一部分透明的问题?
最近在学canvas,现在我创建一个离屏canvas并且设置imageData的像素,在调用context.drawImage()方法将离屏canvas绘制到屏幕中的时候设置的像素点会有一部分透明出现const canvas = document.getElementById('canvas') as HTMLCanvasElement;
const dpr = window.devicePixelRatio;
const width = 200;
const height = 200;
canvas.width = width * dpr;
canvas.height = height * dpr;
canvas.style.width = width + 'px';
canvas.style.height = height + 'px';
const context = canvas.getContext('2d')!;
const offCanvas = document.createElement('canvas');
const offContext = offCanvas.getContext('2d')!;
const imageData = offContext.getImageData(0, 0, offCanvas.width, offCanvas.height);
imageData.data = 0;
imageData.data = 0;
imageData.data = 0;
imageData.data = 255;
offContext.putImageData(imageData, 0, 0);
context.scale(20, 20);
context.drawImage(offCanvas, 0, 0);
一个实心的方块,但是现在有一部分透明了,请问如何解决
关注, 学习一下
页:
[1]