fix: Karos und Linien in gleichmäßigen Abständen (Issue #10)

Karo, Linien und Punkte waren Dreiecke mit 0,15 mm breiten Linien –
schmaler als ein Bildschirmpixel. Je nach Lage auf dem Pixelraster
erschienen sie stärker, schwächer oder versetzt, die Abstände wirkten
unregelmäßig. Jetzt berechnet ein Fragment-Shader das Muster für jedes
Pixel aus der Seitenkoordinate: Linien und Punkte sind mindestens ein
Pixel breit, kantengeglättet und gleichmäßig; bei sehr kleinen Abständen
(weit herausgezoomt) blendet das Muster aus. Gemessen: Karo-Abstand
13,5 ± 0,04 Pixel bei gleicher Linienstärke.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

src/shader.wgsl

@@ -77,3 +77,84 @@ fn vs_image(in: ImageVertexInput) -> ImageVertexOutput {
 fn fs_image(in: ImageVertexOutput) -> @location(0) vec4<f32> {
     return textureSample(image_texture, image_sampler, in.uv);
 }
+
+// Karo, Linien und Punkte: pro Pixel aus der Seitenkoordinate berechnet, damit die Abstände
+// in jedem Zoom gleichmäßig bleiben. Linien und Punkte sind mindestens ein Pixel breit und
+// kantengeglättet; werden die Abstände sehr klein, blendet das Muster aus statt zu flimmern.
+struct PatternInput {
+    @location(0) position: vec2<f32>,
+    @location(1) color: vec4<f32>,
+    // Art (1 Karo, 2 Linien, 3 Punkte), Abstand, Linienstärke, Punktgröße
+    @location(2) params: vec4<f32>,
+    // Seitenbreite, Seitenhöhe, Rand oben/unten bei Linien
+    @location(3) bounds: vec4<f32>,
+};
+
+struct PatternOutput {
+    @builtin(position) clip_position: vec4<f32>,
+    @location(0) page: vec2<f32>,
+    @location(1) color: vec4<f32>,
+    @location(2) params: vec4<f32>,
+    @location(3) bounds: vec4<f32>,
+};
+
+@vertex
+fn vs_pattern(in: PatternInput) -> PatternOutput {
+    var out: PatternOutput;
+    let ndc = in.position * camera.transform_scale + camera.transform_offset;
+    out.clip_position = vec4<f32>(ndc, 0.0, 1.0);
+    out.page = in.position;
+    out.color = in.color;
+    out.params = in.params;
+    out.bounds = in.bounds;
+    return out;
+}
+
+// Deckung einer Linie bei `line` für die Koordinate `c` (`upp`: Seiteneinheiten je Pixel).
+fn line_coverage(c: f32, line: f32, half_width: f32, upp: f32) -> f32 {
+    let half_px = max(half_width / upp, 0.5);
+    let d = abs(c - line) / upp;
+    return clamp(half_px + 0.5 - d, 0.0, 1.0);
+}
+
+@fragment
+fn fs_pattern(in: PatternOutput) -> @location(0) vec4<f32> {
+    let p = in.page;
+    let kind = in.params.x;
+    let spacing = in.params.y;
+    let upp = max(max(fwidth(p.x), fwidth(p.y)), 1e-4);
+    let size = in.bounds.xy;
+    // Unter 3 Pixel Abstand ausblenden (ganz herausgezoomt)
+    let fade = clamp((spacing / upp - 3.0) / 3.0, 0.0, 1.0);
+
+    var coverage = 0.0;
+    if (kind < 1.5) {
+        // Karo: senkrechte und waagerechte Linien bei k · Abstand, nicht am Blattrand
+        let k = round(p / spacing);
+        let line = k * spacing;
+        if (k.x >= 1.0 && line.x < size.x - 0.01) {
+            coverage = max(coverage, line_coverage(p.x, line.x, in.params.z * 0.5, upp));
+        }
+        if (k.y >= 1.0 && line.y < size.y - 0.01) {
+            coverage = max(coverage, line_coverage(p.y, line.y, in.params.z * 0.5, upp));
+        }
+    } else if (kind < 2.5) {
+        // Linien: waagerecht ab dem oberen Rand bis zum unteren Rand
+        let margin = in.bounds.z;
+        let k = round((p.y - margin) / spacing);
+        let line = margin + k * spacing;
+        if (k >= 0.0 && line <= size.y - margin + 0.01) {
+            coverage = line_coverage(p.y, line, in.params.z * 0.5, upp);
+        }
+    } else {
+        // Punkte: an den Kreuzungen des Karos
+        let k = round(p / spacing);
+        let point = k * spacing;
+        if (all(k >= vec2<f32>(1.0)) && point.x < size.x - 0.01 && point.y < size.y - 0.01) {
+            let radius_px = max(in.params.w * 0.5 / upp, 0.6);
+            let d = length(p - point) / upp;
+            coverage = clamp(radius_px + 0.5 - d, 0.0, 1.0);
+        }
+    }
+    return vec4<f32>(in.color.rgb, in.color.a * coverage * fade);
+}