Adapt data canvas to hi-dpi screens

[fm3]

On high-dpi screens, the canvas where datasets are rendered is not adapted to the high-dpi-ness. Instead, it is rendered first and then scaled up, with some sort of interpolation, from what I can tell. Is there a way to change that?

The screenshot shows mag1 data, there is no soft border blending to black in the data. View settings are Very High Hardware Utilization, Best Quality First, No interpolation.

Related: #3785

When opening the EM data slice-wise with image viewers it looks a lot more crisp. I realize that loading this many pixels may bring the hardware to its limitations, but for this we have the settings, right? Maybe this adaptation to the device pixel ratio could even be an additional settings toggle

[philippotto]

I had a quick look into this, but didn't have much success. On my display, window.devicePixelRatio is 1 which means it's not high dpi. When I tried to call setPixelRatio(2) on the three js renderer, the canvas got blank.. 🤔 maybe somebody with another devicePixelRatio can give this a try..

[fm3]

Let me know if there is something specific I can try for you on my device :) I have window.devicePixelRatio 2. Happy to jump on a call as well

[daniel-wer]

Note: Explicitly setting the scale parameter of html2canvas to 1 when screenshotting the scale bar can be omitted once this issue is fixed. See the comment at https://github.com/scalableminds/webknossos/pull/6644/files#diff-aec43385006b0aa84f83242a87fe9278f33777ff2ae5904d50af81810df35556R116