Open athomann opened 3 months ago
glOptions
is replaced by deviceProps
in v9. The documentation should be updated.
Okay, great. I briefly see device
mentioned in the updates section but not about deviceProps
. I still see glOptions in https://deck.gl/docs/api-reference/core/deck#gloptions
You also might want to look into CropTarget.fromElement
instead of html2canvas. It's faster and native.
Something like this:
const cropTarget = await CropTarget.fromElement(root);
const controller = new CaptureController();
const stream = await navigator.mediaDevices.getDisplayMedia({
controller,
preferCurrentTab: true,
cursor: "never",
frameRate: fps,
audio: false,
video: {
width,
height,
frameRate,
displaySurface: "browser",
resizeMode: "none",
logicalSurface: true,
},
});
const [track] = stream.getVideoTracks();
controller.setFocusBehavior("focus-captured-surface");
await root.requestFullscreen({ navigationUI: "hide" });
await track.cropTo(cropTarget);
const processor = new MediaStreamTrackProcessor({ track });
const reader = processor.readable.getReader();
const result = await reader.read();
const screenFrame = result.value;
If you don't need to composite html with the canvas, then the process is even simpler. Just use this:
const track = canvas.captureStream(0).getVideoTracks()[0]
const mediaProcessor = new MediaStreamTrackProcessor(track)
const reader = mediaProcessor.readable.getReader()
track.requestFrame()
const result = await reader.read()
const frame = result.value
Description
When attempting to use html2canvas to capture a screenshot of a deck.gl canvas with the preserveDrawingBuffer option set to true, the operation fails. I'm only able to see the base map from react-map-gl. The error message suggests that preserveDrawingBuffer is set to false, despite being explicitly set to true. However, directly using the toDataURL method on the canvas works as expected and does not produce any error.
I had this working in previous versions of deck.gl, but need further testing.
Flavors
Expected Behavior
html2canvas should be able to capture the canvas image when preserveDrawingBuffer is set to true, without errors suggesting otherwise.
Actual Behavior html2canvas fails to capture the canvas, with an error message incorrectly stating that preserveDrawingBuffer is set to false. Direct usage of toDataURL on the canvas works correctly, indicating that preserveDrawingBuffer is indeed set to true.
Steps to Reproduce
Environment
deck.gl version: 9.0.14 Browser and version: All OS: Mac OS Sonoma
Logs
No response