Terminal Image display has low resolution about xterm.js HOT 2 OPEN

@jerch
I did the same thing,And there are also scenarios of DPR changes.

However, my scene is relatively simple without scaling, so CSS * DPR is sufficient.
reference:

from xterm.js.

@Tyriar Whats the right way to scale a canvas to operate on real device pixels instead of css pixels? Should that be done on width/height attribute level of the canvas object?

For example - lets say we have a DPR of 2 at hand - where should that "doubled" pixel values go? Would this be sufficent (and the browser deals with the low level stuff on its own):

const canvasObj = ...
// apply real pixel values to canvas (doubled  here)
canvasObj.width = cssWidth * DPR;
canvasObj.height = cssHeight * DPR;
// output is still within the logical css pixels
canvasObj.style.width = cssWidth;
canvasObj.style.height = cssHeight;

// later on during painting:
canvasObj.drawImage(...<metrics here now in real device pixels>...);

Would that already fix things? (Sorry if that question looks dumb to you, but I've never done this DPR correction myself, also I cannot really test it...)

from xterm.js.