Allgemeines

• SVG (Scalable Vector Graphics) ist ein vektorbasiertes Dateiformat für zweidimensionale Grafiken, Diagramme oder Illustrationen. Vorteil davon ist, dass Bilder ohne Qualitätsverlust in verschiedene Größen skaliert werden können.
  
  
• Beschreibendes Grafikformat: speichert Bilddaten als mathematische Beschreibungen von Kurven, Linien & Formen und wird erst zur Laufzeit gerendert, wodurch verlustfrei skaliert werden kann.
  
  
• Als primäres Bibliotheksformat geeignet.
  
  

Empfohlene Verwendung

• Zoomen ohne Qualitätsverlust, dynamische SVGs.
  
  
• Verringerung der Anzahl von Elementen in einem HMI-Bild, indem mehrere Objekte durch eine einzelne SVG-Datei ersetzt werden. Dies minimiert Renderzeit und erhöht damit die Effizienz. (Bevor eigene Lösung erstellt wird, überprüfen, ob bestehende Lösung aus der Industry Graphic Library verwendet werden kann.)
  
  
• Für komplexere, statische Bilder ohne Interaktivität oder Skalierung sind Rasterformate (PNG, JPEG) aufgrund Performanz & Speicherplatz besser geeignet.

Dynamische SVG

• WinCC stellt mithilfe von Bibliotheken neben verschiedenen statischen Grafiken und Symbolen auch die Möglichkeit bereit, dynamische SVGs zu verwenden.
• Diese besitzen eine Schnittstelle innerhalb des TIA Portals, mit der vordefinierte Eigenschaften wie Farben oder Füllstände (auch mittels Dynamisierung) verändert werden können.
• Verwendung:

                  - Unter dem Reiter dynamische Widgets kann unter einer Vielzahl
                     von dynamischen SVG-Dateien gewählt werden.
                   - In diesem Beispiel (dargestellte Bilder) wird unter 
                    Robots der Portalkran-Roboter ausgewählt und
                    per Drag and Drop eingefügt. (Bild 1)
                  - Unter „Schnittstelle“ können vordefinierte Eigenschaften
                    verändert werden. (Bild 2)
                  - Im Beispiel können damit Hintergrundfarben,
                    das Werkzeug sowie die Position des Roboters
                    angepasst werden. Damit ist es möglich mit Hilfe von Variablen
                    eine Dynamisierung innerhalb der HMI-Visualisierung
                    zu realisieren.

                       
                    (Bild 1)

                           
                    (Bild 2)

• Es besteht außerdem die Möglichkeit eigene dynamische SVG-Dateien zu erstellen und innerhalb der Visualisierung zu verwenden, womit individuelle Lösungen realisiert werden können. Bei Interesse stehen wir Ihnen gerne für weitere Informationen zur Verfügung.
  
  
  

Hinweis:

Die in diesem Beitrag beschriebene Vorgehensweise bezieht sich auf den Zeitpunkt der Erstellung dieses Beitrags (Stand: Juli 2025).

Viele Grüße

Eure Fachberatung Deutschland (RW)