Diagramme rechnen mit der vollen Länge, eigene Symbole für CPU und GPU

Frisch gestartet hat der Verlauf fünf Messwerte statt sechzig. Gerechnet
wurde aber „Breite geteilt durch Anzahl" — also war jeder Balken ein
Fünftel breit, und mit jedem weiteren wurden sie schmaler. Das Diagramm sah
nach einem Ausschlag aus und bedeutete nichts.

Jetzt kommt die Schrittweite aus der vollen Länge. Fehlende Werte bleiben
als freie Fläche links stehen; der Verlauf wächst nach links weg, wie bei
jedem Zeitdiagramm.

Das steckte an **drei** Stellen, alle mit derselben Rechnung: dem
Balkendiagramm im Netzwerk-Popover, der Sparkline in den Kacheln und der
Linie in den Menüleisten-Modulen. Die gemeinsame Rechnung liegt jetzt in
`GraphLayout` und ist geprüft, statt dreimal danebenzugehen.

Nebenbei: die Fläche unter der Sparkline begann am linken Rand statt am
ersten Messwert — ein Keil über die ganze Breite, wo noch nichts gemessen
war.

CPU und GPU bekommen eigene Symbole aus chip.svg und graphic-card.svg. SF
Symbols hat für beides nur denselben Chip, und „cpu" neben „cpu.fill" ist
kein Unterschied, den man in der Menüleiste erkennt.

Die Beschriftung unter den Ringen klebte am Rand und sah aus, als gehörte
sie noch hinein — sechs Punkte Abstand statt zwei. Und die Popover für CPU
und GPU tragen jetzt einen Titel: bei drei gleich aussehenden Ringen sieht
man sonst nicht, vor welchem man steht.

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

Packages/OnyxKit/Sources/MetricsProvider/MetricMenuBarModule.swift

@@ -222,6 +222,10 @@ final class MetricStatusView: NSView, WidthReporting {
             if metric == .battery {
                 drawBattery(color: color,
                             at: NSPoint(x: 0, y: bounds.midY - BatteryGlyph.size.height / 2))
+            } else if let image = Self.customGlyphs[metric] {
+                MenuBarText.drawTemplate(image, color: color,
+                                         in: NSRect(x: 0, y: bounds.midY - 6.5,
+                                                    width: glyph, height: 13))
             } else {
                 MenuBarText.drawSymbol(currentSymbol, color: color,
                                        in: NSRect(x: 0, y: bounds.midY - 6.5,
@@ -246,6 +250,19 @@ final class MetricStatusView: NSView, WidthReporting {
         MenuBarText.draw(text, color: color, in: rect ?? bounds)
     }
 
+    /// Eigene Vorlagen für CPU und GPU — SF Symbols hat für beides nur den
+    /// gleichen Chip, und „cpu" neben „cpu.fill" ist kein Unterschied, den man
+    /// in der Menüleiste erkennt.
+    private static let customGlyphs: [MetricKind: NSImage] = {
+        var glyphs: [MetricKind: NSImage] = [:]
+        for (metric, name) in [(MetricKind.cpu, "chip"), (.gpu, "graphic-card")] {
+            guard let url = Bundle.main.url(forResource: name, withExtension: "svg"),
+                  let image = NSImage(contentsOf: url) else { continue }
+            glyphs[metric] = image
+        }
+        return glyphs
+    }()
+
     private func drawSymbol(color: NSColor) {
         if metric == .battery {
             drawBattery(color: color,
@@ -254,6 +271,12 @@ final class MetricStatusView: NSView, WidthReporting {
             return
         }
         let side: CGFloat = 15
+        let rect = NSRect(x: bounds.midX - side / 2, y: bounds.midY - side / 2,
+                          width: side, height: side)
+        if let glyph = Self.customGlyphs[metric] {
+            MenuBarText.drawTemplate(glyph, color: color, in: rect)
+            return
+        }
         let width = MenuBarText.symbolWidth(currentSymbol, height: side)
         MenuBarText.drawSymbol(currentSymbol, color: color,
                                in: NSRect(x: bounds.midX - width / 2,
@@ -299,8 +322,10 @@ final class MetricStatusView: NSView, WidthReporting {
     /// Wie breit das Glyph ist. Der Akku wird selbst gezeichnet und hat eigene
     /// Maße; alles andere ist ein SF-Symbol.
     private var symbolSlot: CGFloat {
-        metric == .battery ? BatteryGlyph.size.width
-                           : MenuBarText.symbolWidth(currentSymbol, height: 13)
+        if metric == .battery { return BatteryGlyph.size.width }
+        // Eigene Vorlagen sind quadratisch; ihre Breite folgt der Höhe.
+        if Self.customGlyphs[metric] != nil { return 13 }
+        return MenuBarText.symbolWidth(currentSymbol, height: 13)
     }
 
     /// Das Symbol zum **Zustand**, nicht zur Metrik.
@@ -316,14 +341,21 @@ final class MetricStatusView: NSView, WidthReporting {
     }
 
     private func drawGraph(color: NSColor, in rect: NSRect) {
-        guard history.count > 1, let context = NSGraphicsContext.current?.cgContext else { return }
-        let step = rect.width / CGFloat(history.count - 1)
+        guard let context = NSGraphicsContext.current?.cgContext else { return }
+        // Die Schrittweite kommt aus der vollen Länge des Verlaufs, nicht aus
+        // der Anzahl vorhandener Werte: frisch gestartet sind es zwei statt
+        // sechzig, und daraus gerechnet spannte sich der Weg über die ganze
+        // Breite.
+        let xs = GraphLayout.positions(count: history.count,
+                                       capacity: MetricsModel.historyLength, in: rect)
+        guard !xs.isEmpty else { return }
 
         context.setStrokeColor(color.withAlphaComponent(0.85).cgColor)
         context.setLineWidth(1)
         context.setLineJoin(.round)
-        for (index, value) in history.enumerated() {
-            let point = CGPoint(x: rect.minX + CGFloat(index) * step,
+        for (index, x) in xs.enumerated() {
+            let value = history[history.count - xs.count + index]
+            let point = CGPoint(x: x,
                                 y: rect.minY + rect.height * CGFloat(min(max(value, 0), 1)))
             index == 0 ? context.move(to: point) : context.addLine(to: point)
         }