antialias=false 阻碍 readPixels 在 MacOS 上使用 Safari

Question

我使用“readPixels()”读取 webgl-canvas 上的像素颜色。当 getContext 选项的抗锯齿设置为 false 时，我无法读取像素。我可以在 Safari/MacOS、Chrome、Firefox 和 Safari/iOS.

上阅读以下内容

const gl = canvas.getContext('webgl', {'preserveDrawingBuffer':true, 'antialias':true});

但我无法在 Safari/MacOS 上阅读以下内容，但可以在 Chrome、Firefox 和 Safari/iOS 上阅读。

const gl = canvas.getContext('webgl', {'preserveDrawingBuffer':true, 'antialias':false});

ADD LINE: console output Uint8Array [0, 0, 0, 0]，但是像素有颜色。

Safari/MacOS 有问题吗？或者我需要 Safari/MacOS 的任何选项吗？我可以使用 Safari/MacOS 和 antialias=false 读取像素颜色吗？

抱歉我的英语不好，谢谢。

Answer 1

Post 最小回购 snippet 如果你需要帮助调试

这对我在 Mac 和 iPhone

的 Safari 中有效

function test(antialias) {
  const gl = document.createElement('canvas').getContext('webgl', {
    preserveDrawingBuffer: true,
    antialias,
  });
  gl.clearColor(1, 0.5, 0.25, 1);
  gl.clear(gl.COLOR_BUFFER_BIT);
  const pixel = new Uint8Array(4);
  gl.readPixels(0, 0, 1, 1, gl.RGBA, gl.UNSIGNED_BYTE, pixel);
  log(JSON.stringify(gl.getContextAttributes(), null, 2));
  log('pixel:', pixel);
}

function log(...args) {
  const elem = document.createElement('pre');
  elem.textContent = args.join(' ');
  document.body.appendChild(elem);
}

test(false);
test(true);

antialias=false 阻碍 readPixels 在 MacOS 上使用 Safari

antialias=false hinder readPixels with Safari on MacOS

javascript

safari

antialiasing

glreadpixels

webgl