Einführung

In diesem Leitfaden wird erläutert, wie Sie Overlay-Anmerkungen im LumiScan Cockpit so konfigurieren, dass visuelle Markierungen auf Bildern angezeigt werden. Overlays ermöglichen es Ihnen, Bereiche von Interesse hervorzuheben oder Positionen im Bild für die Kalibrierung oder Ausrichtung direkt auf dem von LumiScan CamDriver erfassten Bildfeed zu markieren. Sie konfigurieren Overlay-Anmerkungen mit einer JSON-Konfigurationsdatei und überprüfen die Ergebnisse in der LumiScan Cockpit-Weboberfläche.

Voraussetzungen

Erforderliche Komponenten

• LumiScan Cockpit-Anwendung installiert und läuft auf ctrlX CORE
• LumiScan CamDriver installiert, läuft und erhält aktiv Bilder
• Auf Ihrem Computer installierter Webbrowser
• Netzwerkkonnektivität zum StrgX-Gerät

Erforderliches Wissen

• Grundlegendes Verständnis der JSON-Dateistruktur
• Vertrautheit mit der ctrlX-Weboberfläche

Systemübersicht

Architektur

LumiScan Cockpit ist eine webbasierte Visualisierungsanwendung, die Bilddaten von kompatiblen Kameratreibern über die ctrlX-Datenschicht liest. Die Anwendung erzeugt keine eigenen Daten, sondern abonniert Bilder, die von anderen Anwendungen wie LumiScan CamDriver bereitgestellt werden.

Datenschichtkommunikation

The LumiScan Cockpit application monitors the Data Layer path hdvisionsystems/lumiscan-cam-driver for active camera modules. Each folder node under this path represents an available camera instance. When you access the LumiScan Cockpit web interface, the application displays all available images from detected cameras.

Überlagerungskonfiguration

Overlay-Anmerkungen werden über eine JSON-Datei konfiguriert, die im Anwendungsdatenverzeichnis gespeichert ist. Die Konfigurationsdatei verwendet ein musterbasiertes Schlüsselsystem, um Overlays mit bestimmten Anwendungen und Images zu verknüpfen. Wenn die Anwendung neu gestartet wird, wird die neue Overlay-Konfiguration wirksam und die visuellen Markierungen erscheinen auf den Bildern in der Weboberfläche.

Schritt 1: Überprüfen Sie die Kamerabedienung

Schritt 2: Bildansicht verfügbar im LumiScan-Cockpit

1. Wählen Sie LumiScan Cockpit in der Seitenleiste der StrgX-Weboberfläche
2. Sie sehen eine Übersicht über die verfügbaren Bilder, gruppiert nach der App, aus der sie stammen
3. Wählen Sie ein Bild aus, indem Sie auf seinen Namen klicken, dies öffnet eine Vorschauseite in einem neuen Browser-Tab

Schritt 3: Zugriff auf das Anwendungsdatenverzeichnis

1. Navigieren Sie in der Weboberfläche von StrgX auf der Registerkarte „Home“ zu „App-Daten verwalten„.
2. Wählen Sie Dateiansicht öffnen
3. Suchen Sie in der Verzeichnisliste lumiscan-cockpit und wählen Sie es aus.
4. Das Anwendungsdatenverzeichnis wird geöffnet und zeigt den Ordnerinhalt an.
5. Dieses Verzeichnis enthält die Datei lumiscan-cockpit.json, wählen Sie diese Datei aus, um die Overlay-Konfiguration zu bearbeiten

Der integrierte Dateieditor bietet Fehlerprüfungen und einige Vorschläge beim Bearbeiten dieser Datei.

Schritt 4: Erstellen oder Ändern einer Overlay-Konfiguration

Um eine einfache Overlay-Anmerkung hinzuzufügen, ändern Sie die Konfigurationsdatei, um eine Kreuzmarkierung einzuschließen, die auf dem Bild zentriert ist. Folgen Sie diesem Beispiel:

1. Locate or create a key under overlay that corresponds to your camera setup. Use the pattern lumiscan-cam-driver/imageName where imageName is the specific image identifier from the cam-driver. This identifier is also used inside the Cockpit overview visible in step 2.
2. Wenn für dieses Bild keine Überlagerungen vorhanden sind, erstellen Sie einen neuen Array-Eintrag.
3. Fügen Sie das folgende Overlay-Element hinzu, um ein Kreuz in der Mitte des Bildes anzuzeigen:

{
  "overlay": {
    "lumiscan-cam-driver/camera 1": [
      {
        "color": "green",
        "shape": "cross",
        "centerX": 0.5,
        "centerY": 0.5,
        "width": 30,
        "height": 30
      }
    ]
  }
}

Eigenschaften des Überlagerungselements

Jedes Overlay-Element muss die folgenden Eigenschaften enthalten:

• color: The color of the overlay shape. Accepted values are named colors (red, green, blue, black, white, yellow, cyan, magenta) or hexadecimal format (#RRGGBB or RRGGBB).
• shape: The type of geometric shape to draw. Accepted values are rectangle, circle, or cross.
• centerX: Die horizontale Position des Formzentrums. Werte zwischen 0,0 und 1,0 werden relativ zur Bildbreite behandelt (0,0 = linke Kante, 1,0 = rechte Kante). Werte von 1,0 oder mehr werden als absolute Pixelkoordinaten behandelt.
• centerY: Die vertikale Position des Formzentrums. Werte zwischen 0,0 und 1,0 werden als relativ zur Bildhöhe behandelt (0,0 = obere Kante, 1,0 = untere Kante). Werte von 1,0 oder mehr werden als absolute Pixelkoordinaten behandelt.
• Breite: Die Breite der Form. Werte zwischen 0,0 und 1,0 sind relativ zur Bildbreite. Werte von 1,0 oder mehr sind absolute Pixelwerte. Bei Kreisen definiert dieser Parameter den Durchmesser.
• Höhe: Die Höhe der Form. Werte zwischen 0,0 und 1,0 beziehen sich auf die Bildhöhe. Werte von 1,0 oder mehr sind absolute Pixelwerte.

Verwenden von Platzhaltern

Um Overlays auf mehrere Anwendungen oder Images anzuwenden, verwenden Sie Platzhalter (*) im Konfigurationsschlüssel:

• */resultImage: Wendet das Overlay auf jede Anwendung an resultImage
• lumiscan-cam-driver/*: Wendet Overlays auf alle Bilder aus dem LumiScan CamDriver an
• */*: Wendet das Overlay auf alle Bilder aus allen Anwendungen an

Wenn mehrere Overlays mit einem bestimmten Bild übereinstimmen, enthält es alle angegebenen Overlays.

Schritt 5: Speichern Sie die Konfigurationsdatei

1. Überprüfen Sie die JSON-Syntax, um sicherzustellen, dass sie gültig ist. Der Texteditor bietet eine Schemavalidierung und hebt alle Fehler hervor.
2. Klicken Sie auf die Schaltfläche Speichern oder verwenden Sie die Tastenkombination, um die Datei zu speichern.

Schritt 6: Starten Sie die LumiScan-Cockpit-Anwendung neu

Damit die neue Konfiguration wirksam wird, muss die Anwendung neu gestartet werden:

1. Navigieren Sie in der Weboberfläche strgX zur Registerkarte Einstellungen und wählen Sie dort den Abschnitt „Apps“ aus.
2. Suchen Sie LumiScan Cockpit in der Anwendungsliste.
3. Wählen Sie die Anwendung aus und klicken Sie auf Neustart, um die Anwendung neu zu starten.
4. Die Anwendung wird gestoppt und neu gestartet, wenn die neue Konfiguration geladen ist.
5. Kehren Sie wie in Schritt 2 beschrieben zur LumiScan-Cockpit-Oberfläche zurück, um die Bilder anzuzeigen, die das Overlay enthalten.

Ergebnis

• Die LumiScan Cockpit-Anwendung zeigt jetzt Overlay-Anmerkungen auf Bildern an, die vom LumiScan CamDriver erfasst werden.
• Die Kreuzmarkierung (oder andere konfigurierte Formen) erscheint an der angegebenen Position und Farbe.
• You can modify the overlay configuration at any time by editing the lumiscan-cockpit.json file and restarting the application.
• Zusätzliche Overlays können hinzugefügt werden, indem das Array von Overlay-Elementen in der Konfigurationsdatei erweitert wird.

Ein Beispielbild mit mehreren Überlagerungen in verschiedenen Farben und Formen:

  "$schema": "schemas/lumiscan-cockpit.schema.json",
  "overlay": {
    "lumiscan-cam-driver/*": [
      {
        "color": "green",
        "shape": "cross",
        "centerX": 0.5,
        "centerY": 0.5,
        "width": 30,
        "height": 30
      },
      {
        "color": "red",
        "shape": "circle",
        "centerX": 0.5,
        "centerY": 0.5,
        "width": 100,
        "height": 0
      },
      {
        "color": "yellow",
        "shape": "circle",
        "centerX": 0.5,
        "centerY": 0.5,
        "width": 150,
        "height": 0
      },
      {
        "color": "green",
        "shape": "circle",
        "centerX": 0.5,
        "centerY": 0.5,
        "width": 200,
        "height": 0
      },
      {
        "color": "#c8b100",
        "shape": "rectangle",
        "centerX": 400,
        "centerY": 400,
        "width": 250,
        "height": 200
      },
      {
        "color": "#c8b100",
        "shape": "rectangle",
        "centerX": 400,
        "centerY": 800,
        "width": 250,
        "height": 200
      }
    ]
  }
}

Das Unternehmen

HD Vision Systems ist ein führender Anbieter von industriellen Bildverarbeitungs- und KI-basierten Automatisierungslösungen. Unsere hardwareunabhängige Plattform ermöglicht die nahtlose Integration verschiedenster Kameras, Sensoren, Roboter und industrieller Systeme und bietet Kunden maximale Flexibilität und zukunftssichere Skalierbarkeit. Durch die Kombination fortschrittlicher Bildverarbeitungssoftware mit starken Partnerschaften im gesamten Automatisierungs-Ökosystem liefern wir maßgeschneiderte, leistungsstarke Lösungen für Qualitätsprüfung, Prozessoptimierung und intelligente Fertigung. Gemeinsam mit unseren Technologiepartnern unterstützen wir Unternehmen bei der Beschleunigung ihrer digitalen Transformation und der Erschließung des vollen Potenzials von Industrie 4.0.