HTML5 Canvas translate (0.5,0.5) no soluciona el desenfoque de línea
Leyendorelacionado artículos, He intentado forzar el tamaño del lienzo en píxeles, especificando medios píxeles para las rutas y también context.translate (0.5) pero mis líneas de lienzo todavía están borrosas.
const ctx = canvas.getContext("2d");
ctx.translate(0.5, 0.5);
/* Function to draw HTML5 canvas line */
const drawPath = (startX, startY, endX, endY) => {
ctx.beginPath();
ctx.lineWidth = "1";
ctx.strokeStyle = "red";
ctx.moveTo(startX, startY);
ctx.lineTo(endX, endY);
ctx.stroke();
};
¿Dónde me estoy equivocando y cómo puedo hacer que mis líneas sean nítidas como el borde alrededor de los cuadros en la demostración?
Cómo me parece a mí:
