diff --git a/Docker Backend/src/lib/svg-font-engine.js b/Docker Backend/src/lib/svg-font-engine.js index ac20282..0ae2362 100644 --- a/Docker Backend/src/lib/svg-font-engine.js +++ b/Docker Backend/src/lib/svg-font-engine.js @@ -173,6 +173,8 @@ function layoutTextToPaths({ for (const line of lines) { let x = startX; + let drift = 0; + const lineSlope = (Math.random() - 0.5) * 0.012; // ±2.4px über 400px Zeilenbreite for (let i = 0; i < line.length; i++) { const ch = line[i]; @@ -182,19 +184,27 @@ function layoutTextToPaths({ // Leerzeichen mit festem Abstand const spacePx = fontSizePx * 0.4; x += spacePx; + drift += (Math.random() - 0.5) * 0.3; + drift = Math.max(-3, Math.min(3, drift)); continue; } const d = glyph.d; const advPx = (glyph.adv || unitsPerEm * 0.5) * scale; - // Einfache Transform-Matrix ohne Rotation - const transform = `matrix(${scale},0,0,${-scale},${x},${baselineY})`; + const yJitter = (Math.random() - 0.5) * 2.5; + drift += (Math.random() - 0.5) * 0.4; + drift = Math.max(-3, Math.min(3, drift)); - resultPaths.push({ - d, - transform, - }); + const charY = baselineY + yJitter + drift + lineSlope * (x - startX); + + const angleDeg = (Math.random() - 0.5) * 3; + const pivotX = x + advPx / 2; + const pivotY = charY - fontSizePx * 0.3; + + const transform = `rotate(${angleDeg.toFixed(3)},${pivotX.toFixed(1)},${pivotY.toFixed(1)}) matrix(${scale},0,0,${-scale},${x},${charY})`; + + resultPaths.push({ d, transform }); x += advPx; }