Algunas líneas con lineJoin="round" se representan de forma extraña en ciertas escalas, aquí hay un ejemplo con una escala de 1.403619311470477 y sin ella: https://jsfiddle.net/kxjcosgf/2/

 <canvas id="canvas" width="2000" height="2000"> </canvas> <script> const points = "45.13869240187139,481.020616681278,45.13869240187139,480.72980663647314,44.84788235706651,479.5665664572536,44.70247733466407,477.9671112108268,44.84788235706651,477.53089614361943,44.84788235706651,477.385491121217,44.993287379468946,476.80387103160723,45.28409742427383,476.22225094199746,46.44733760349335,475.059010762778,47.319767737907995,474.9136057403755,47.90138782751775,475.34982080758283,48.19219787232263,475.7860358747902,48.483007917127516,476.5130609868024,48.62841293952995,476.94927605400966,48.33760289472507,477.67630116602186".split(",") const ctx = canvas.getContext("2d") ctx.strokeStyle = "black" ctx.lineWidth = 2 ctx.lineCap = "round" ctx.lineJoin = "round" ctx.beginPath() ctx.moveTo(points[0], points[1]) for (let i = 2; i < points.length; i += 2) { ctx.lineTo(points[i], points[i + 1]) } ctx.stroke() ctx.scale(1.403619311470477, 1.403619311470477) ctx.beginPath() ctx.moveTo(points[0], points[1]) for (let i = 2; i < points.length; i += 2) { ctx.lineTo(points[i], points[i + 1]) } ctx.stroke() window.scrollBy(0, 400) </script>

Espero una versión escalada del trazo superior (marcado en azul), pero en su lugar aparece un rayo extraño en Chrome 94.0.