Refactor text rendering and adjust viewport defaults

Introduced a drawTextWithBackground helper to centralize and simplify text rendering with backgrounds in CanvasRenderer (JS/TS). Updated all relevant usages to use this helper. Adjusted initial viewport x/y offsets in Canvas and Canvas.ts for improved default positioning.

src/Canvas.ts

@@ -108,8 +108,8 @@ export class Canvas {
         this.lastMousePosition = {x: 0, y: 0};
 
         this.viewport = {
-            x: -(this.width / 4),
-            y: -(this.height / 4),
+            x: -(this.width / 1.5),
+            y: -(this.height / 2),
             zoom: 0.8,
         };