悬赏问答
1回答 176查看 1收藏
悬赏 1 金币
test
最近在学canvas,现在我创建一个离屏canvas并且设置imageData的像素,在调用context.drawImage()方法将离屏canvas绘制到屏幕中的时候设置的像素点会有一部分透明出现

  1. const canvas = document.getElementById('canvas') as HTMLCanvasElement;
  2. const dpr = window.devicePixelRatio;

  3. const width = 200;
  4. const height = 200;

  5. canvas.width = width * dpr;
  6. canvas.height = height * dpr;
  7. canvas.style.width = width + 'px';
  8. canvas.style.height = height + 'px';
  9. const context = canvas.getContext('2d')!;

  10. const offCanvas = document.createElement('canvas');
  11. const offContext = offCanvas.getContext('2d')!;

  12. const imageData = offContext.getImageData(0, 0, offCanvas.width, offCanvas.height);
  13. imageData.data[0] = 0;
  14. imageData.data[1] = 0;
  15. imageData.data[2] = 0;
  16. imageData.data[3] = 255;

  17. offContext.putImageData(imageData, 0, 0);

  18. context.scale(20, 20);
  19. context.drawImage(offCanvas, 0, 0);
复制代码

一个实心的方块,但是现在有一部分透明了,请问如何解决
回答 1 条
吊儿郎当 2022-10-23 13:11:28
关注, 学习一下
您需要登录后才可以回帖 登录 | 注册
Smilies Code
高级模式