Blog · Custom Web Controls

Die 8 besten Datentabellen Custom Web Controls für WinCC Unified und WinCC V8 (kostenlos)

Wir haben Anfang November 2026 jedes Datentabellen Custom Web Control im HMIx-Katalog aufgemacht – Datentabellen, Protokolle und SQL-Grids, dreizehn Kandidaten –, jede Vorschau aus nächster Nähe begutachtet, jedes Produktblatt gelesen und die acht behalten, die wir ohne Zögern in ein Bild unter WinCC Unified oder WinCC V8 ziehen würden. Alle kostenlos, alle als CWC-ZIP verpackt und alle mit Eigenschaften, die im Produktblatt mit Namen stehen, damit du weißt, was du verbindest.

Vom HMIx-Team11 Min. LesezeitAktualisiert
  • Custom Web Control
  • CWC
  • WinCC Unified
  • WinCC V8
  • TIA Portal
  • Datentabelle
  • SQL Server
  • SCADA-Widgets
Vier Datentabellen Custom Web Controls aus dem HMIx-Katalog im Raster: ein dunkles Qualitätskontrollprotokoll mit Zählern für Gesamt, bestanden, fehlgeschlagen und Warnungen, ein heller CSV-Exporter für historische Daten mit Start- und Endzeitstempel, eine dunkle Tabelle mit Chargendatensätzen und Seitenumschaltung sowie eine dunkle Tabelle für historische Daten mit Spalten für Datum, Uhrzeit und Prozesswerte
Die Aufstellung: echte Vorschauen von vier Datentabellen aus diesem Artikel, genau so, wie ihre Ersteller sie veröffentlicht haben. Wir haben sie nur nebeneinander gerahmt.

Warum sich ein Datentabellen Custom Web Control lohnt

Früher oder später braucht jedes HMI-Projekt eine Tabelle. Die Fertigungsaufträge der Schicht, die letzten zwanzig Chargen, Qualitätsprüfungen mit Gut oder Schlecht, Prüfgewichte, eine SQL-Abfrage, die der Werksleiter auf dem Bildschirm sehen will, „genau wie in Excel“. Anzeigen und Trends sagen dem Bediener, wie es dem Prozess geht; eine Datentabelle sagt ihm, was passiert ist, Eintrag für Eintrag, mit Namen, Zeiten und Werten zum Nachschlagen.

Die Standardobjekte von WinCC sind für bestimmte Daten gebaut: Meldungen, Trends, Parametersätze. Willst du ein Grid mit deinen eigenen Datensätzen, mit Suche, Seiten, Statusfarben und einer Zeile, die der Bediener anklicken kann, ist ein Datentabellen Custom Web Control (CWC) die Abkürzung. Ein CWC ist eine kleine Webanwendung – HTML, CSS und JavaScript, verpackt als ZIP –, die WinCC Unified (TIA Portal) und WinCC V8 im Bild ausführen. Ein Tabellen-CWC nimmt seine Zeilen meist als JSON-String in einer Eigenschaft wie dataJson oder recordsJson entgegen und sendet Ereignisse wie RowSelected, auf die deine HMI-Skripte reagieren können.

Was ein Datentabellen Custom Web Control downloadwürdig macht

Bevor es losgeht, der Maßstab. Danach haben wir gesucht, grob sortiert danach, wie sehr es uns nervt, wenn es fehlt:

  • Auf einen Blick lesbar. Ein klarer Tabellenkopf, ausgerichtete Zahlen, Einheiten und Statusfarben, die etwas bedeuten. Eine Tabelle, die der Bediener erst entziffern muss, liest am Ende niemand.
  • Datenmenge im Griff. Suche, Seitenumschaltung oder ein Zeilenlimit (rowsPerPage, pageSize, maxDisplayedRows), damit das Bild flott bleibt und niemand auf einem 12-Zoll-Panel durch tausend Zeilen scrollt.
  • Ein sauberer Datenvertrag. Die Zeilen in einer dokumentierten Eigenschaft, das Spaltenlayout in einer anderen, damit du genau weißt, was dein Skript schreiben muss.
  • Interaktion, die irgendwohin führt. Ein Ereignis beim Klick auf eine Zeile, eine Aktualisierungsanforderung oder ein CSV-Export machen aus einer Liste ein Werkzeug. Produktblätter, die ihre Eigenschaften nur zählen, sind bei den lobenden Erwähnungen gelandet.
  • Die richtige Tabelle für die Aufgabe. Ein Protokoll historischer Daten, ein SQL-Server-Editor, ein Qualitätsprotokoll, eine Liste mit Live-Variablen, ein Chargen-Browser, ein Exporter, ein Prüfprotokoll und ein Alleskönner-Grid: Wir haben einen Champion pro Aufgabe gekürt.

Wie wir ausgewählt haben (und was wir nicht gemacht haben)

Wir haben den HMIx-Katalog Anfang November 2026 nach jedem kostenlosen Custom Web Control durchsucht, bei dem sich alles um Zeilen und Spalten dreht: Datentabellen, Protokolle, SQL-Grids, CSV-Exporter und Datensatz-Browser. Komplette Anwendungen, die zufällig eine Tabelle enthalten, etwa Lager- oder Chargenverwaltungen, heben wir uns für ein andermal auf. Bei jedem Kandidaten haben wir uns die echte Vorschau angesehen (nicht das Katalog-Cover mit dem großen Titel obendrauf) und das Produktblatt gelesen, um zu sehen, welche Eigenschaften, Ereignisse und Methoden es dokumentiert. Downloads waren nur das Zünglein an der Waage.

Controls, deren Produktblätter ihre Eigenschaften nicht nennen, sind bei den lobenden Erwähnungen gelandet. Vier flogen raus: Bei drei zeigt die Galerie nur das Icon des Controls, da gibt es schlicht nichts zu bewerten, und beim vierten ist der Text in den Zellen praktisch unsichtbar. Und eine faire Warnung: Wir haben Vorschauen und Dokumentation bewertet; in einer laufenden Runtime oder an einer echten Datenbank haben wir diese Controls nicht betrieben. Sie wurden mit KI erstellt, und jede Produktseite erinnert dich daran, sie vor dem Produktiveinsatz in deinem eigenen Projekt in TIA Portal zu testen.

Die 8 besten Datentabellen Custom Web Controls im Einzelnen

Jeder Eintrag zeigt die echte Vorschau, was uns gefällt, was du wissen solltest und welche Eigenschaften das Produktblatt nennt, gefolgt vom Vorschaubild aus dem Katalog: Ein Klick darauf öffnet die Produktseite, auf der du die Tabelle kostenlos herunterlädst.

01Gesamtsieger

Dynamic Data Table

Dynamische Datentabelle als Custom Web Control im Dark Mode mit Suchfeld, Datums- und Uhrzeitspalten in Blau sowie Spalten für Tankfüllstand, Pumpendrehzahl, Ventilstellung, Temperatur und Druck, dazu eine Seitenumschaltung mit der Anzeige Page 1 of 2 (20 records)
Die echte Vorschau des Controls, so wie sie im Katalog veröffentlicht ist. Ein Klick öffnet die Produktseite.

Dürften wir nur eine behalten, wäre es diese. Ein dunkles, ruhiges Grid mit einem Feld „Search all columns...“ oben, Datum und Uhrzeit jedes Datensatzes in blauer Monospace-Schrift und fünf Prozessspalten: Tankfüllstand, Pumpendrehzahl, Ventilstellung, Temperatur und Druck. Unten „Page 1 of 2 (20 records)“ und eine kleine Seitenumschaltung. Nichts Auffälliges, alles da, wo man es erwartet, und im November 2026 mit zwei Fünf-Sterne-Bewertungen.

Sie ist für historische Daten gebaut. Laut Produktblatt erzeugt sie die Spalten Datum und Uhrzeit selbst und ergänzt fünf konfigurierbare Prozessspalten, definiert in columnSettings und gefüttert über historicalData. rowsPerPage legt die Seitengröße fest, searchPlaceholder und noDataMessage kümmern sich um die Texte, und backgroundColor passt sie an dein Theme an. Mit RowSelected und PageChanged reagieren deine Skripte, und die Methode exportToCsv lädt die gefilterten Zeilen für einen Bericht herunter.

Was uns gefällt

  • Suche, Seitenumschaltung und CSV-Export in einem aufgeräumten Control
  • Datum und Uhrzeit erledigt sie für dich, die Werte stehen in klaren Spalten
  • Kurze Schnittstelle: Zwei JSON-Eigenschaften erledigen den Großteil der Arbeit

Gut zu wissen

  • Laut Produktblatt fünf Prozessspalten: Für breitere Datensätze nimm eine andere Tabelle
  • Die Vorschau zeigt keine Export-Schaltfläche: Ruf exportToCsv über eine eigene Schaltfläche auf

Dynamisierbare Eigenschaften

  • historicalData
  • columnSettings
  • rowsPerPage
  • searchPlaceholder
  • noDataMessage
  • backgroundColor
Dynamic Data Table: kostenloses Datentabellen Custom Web Control für WinCC Unified und WinCC V8, Vorschaubild aus dem Katalog

Dynamic Data Table

Kostenlos · WinCC Unified & V8 · CWC (.zip)

02Am besten für SQL-Server-Datensätze (anlegen, bearbeiten, löschen)

Table SQL Server

Table SQL Server Custom Web Control im Light Mode mit Suchfeld, den Schaltflächen Add New in Blau, Edit, Delete in Rot und Aktualisieren, sortierbaren Spalten für ID, Zeitstempel, Variablenname, Wert, Einheit, Status und Bediener sowie einer Fußzeile mit dem Text SQL Server: Connected to Production_DB
Die echte Vorschau des Controls, so wie sie im Katalog veröffentlicht ist. Ein Klick öffnet die Produktseite.

Die Tabelle für alle, die in einer Datenbank zu Hause sind. Eine helle Werkzeugleiste mit Suchfeld, einem blauen „Add New“, „Edit“, einem roten „Delete“ und einer Aktualisieren-Schaltfläche sitzt über einer sortierbaren Tabelle mit den Spalten ID, Zeitstempel, Variablenname, Wert, Einheit, Status und Bediener. In der Fußzeile steht auf der einen Seite „SQL Server: Connected to [Production_DB]“ und auf der anderen „No row selected“. Mit vier Bewertungen und im Schnitt 4,75 Sternen im November 2026 ist sie die meistbewertete Tabelle in diesem Artikel.

Ihr Produktblatt zählt 21 Eigenschaften und nennt zwanzig davon. Die SQL-Seite ist eindeutig: sqlSelectQuery, sqlInsertQuery, sqlUpdateQuery und sqlDeleteQuery enthalten die Abfragevorlagen, primaryKeyColumn identifiziert die Zeile, und die Verbindung läuft entweder über dbConnectionString oder über dbServer, dbDatabase, dbUser und dbPassword. showAddButton, showEditButton und showDeleteButton legen fest, was der Bediener darf, jeweils mit eigener Beschriftung. Die Schaltflächen lösen AddRequested, EditRequested, DeleteRequested und RefreshRequested für deine WinCC-Skripte aus, und über setTableData, setConnectionStatus und clearSelection schreiben Skripte zurück.

Was uns gefällt

  • Kompletter Ablauf zum Anlegen, Bearbeiten und Löschen, mit einem Ereignis für jede Aktion
  • Schaltflächen, die du pro Bild oder pro Benutzerrolle ausblenden kannst
  • Die meistbewertete Tabelle in diesem Artikel

Gut zu wissen

  • Lies die mitgelieferte Dokumentation, um zu sehen, wo die Abfragen in deiner Architektur tatsächlich laufen, bevor du Live-SQL versprichst, und leg niemals ein Datenbankpasswort in eine Variable, die Bediener lesen können
  • In der Vorschau ist jeder Text kursiv, „Search records...“ ist oben abgeschnitten, „Add New“ bricht um und die Bedienerspalte läuft über den Rand hinaus

Dynamisierbare Eigenschaften

  • sqlSelectQuery
  • sqlInsertQuery
  • sqlUpdateQuery
  • sqlDeleteQuery
  • primaryKeyColumn
  • dbConnectionString
  • dbServer
  • dbDatabase
  • dbUser
  • dbPassword
  • showAddButton
  • showEditButton
  • showDeleteButton
  • addLabel
  • editLabel
  • deleteLabel
  • searchPlaceholder
  • connectionStatusText
  • noSelectionText
  • backgroundColor
Table SQL Server: kostenloses Datentabellen Custom Web Control für WinCC Unified und WinCC V8, Vorschaubild aus dem Katalog

Table SQL Server

Kostenlos · WinCC Unified & V8 · CWC (.zip)

03Am besten für Qualitätskontrollprotokolle

Quality Control Log

Qualitätskontrollprotokoll als Custom Web Control im Dark Mode mit vier Übersichtskarten für insgesamt 20 Prüfungen, 11 bestanden, 4 fehlgeschlagen und 5 Warnungen, über einer Tabelle mit Chargennummern, Parametern mit Icons, Werten, Status-Badges OK, Warnung und Fehler, Zeitstempeln und Initialen der Bediener
Die echte Vorschau des Controls, so wie sie im Katalog veröffentlicht ist. Ein Klick öffnet die Produktseite.

Die schönste Tabelle der Liste. Oben sitzen vier Übersichtskarten: Total Checks 20, Passed 11 (55 %), Failed 4 (20 %) und Warnings 5 (25 %), jede in ihrer Farbe. Darunter listet eine dichte Tabelle Chargennummern ab B-1024, einen Parameter mit eigenem Icon (Kerntemperatur, Siegeldruck, Füllmenge, pH-Wert …), den Wert mit Einheit, ein leuchtendes Badge OK, WARNING oder FAIL, die Uhrzeit und den Bediener mit einem runden Avatar seiner Initialen.

Das Produktblatt listet 10 Eigenschaften und nennt neun davon: title und subtitle, die Kartenbeschriftungen totalLabel, passedLabel, failedLabel und warningsLabel, showFilters und searchPlaceholder für Suche und Statusfilter sowie backgroundColor. OnRowSelection öffnet die Tür zu einem Detailbild der Charge, und mit den Methoden clearSearch und setFilter springt ein Skript direkt zu den Fehlern.

Was uns gefällt

  • Übersichtszähler und detailliertes Protokoll in einem einzigen Control
  • Status-Badges, die auffallen, ohne zu schreien
  • Suche und Statusfilter eingebaut

Gut zu wissen

  • Das Produktblatt nennt nicht die Eigenschaft, die die Datensätze trägt: Prüf die Liste unter Schnittstelle in TIA Portal, bevor du verbindest
  • In der Vorschau ist der Kopf mit Titel und Filtern unscharf, und der rechte Rand der Übersichtskarten ist abgeschnitten

Dynamisierbare Eigenschaften

  • title
  • subtitle
  • totalLabel
  • passedLabel
  • failedLabel
  • warningsLabel
  • showFilters
  • searchPlaceholder
  • backgroundColor
Quality Control Log: kostenloses Datentabellen Custom Web Control für WinCC Unified und WinCC V8, Vorschaubild aus dem Katalog

Quality Control Log

Kostenlos · WinCC Unified & V8 · CWC (.zip)

04Beste schlanke Tabelle für Live-Variablenwerte

Data Table

Datentabelle als Custom Web Control im Dark Mode mit Variablennamen wie PUMP-001, VALVE-003 und FLOW-005, dazu Werte, Einheiten und Statuspunkte für Active, Idle, Error und Offline
Die echte Vorschau des Controls, so wie sie im Katalog veröffentlicht ist. Ein Klick öffnet die Produktseite.

Manchmal braucht man einfach nur eine saubere Liste. Diese hier zeigt Variablenname, Wert, Einheit und Status für zehn Signale, von PUMP-001 mit 145,2 m³/h bis COOL-001 mit 22,1 °C, mit einem farbigen Punkt für Active, Idle, Error oder Offline. Die ausgewählte Zeile markiert ein blauer Balken am linken Rand. Hoher Kontrast, kein Schnickschnack, auch aus einem Meter Abstand gut lesbar.

Die Schnittstelle ist genauso schlank. dataJson trägt die Zeilen und columns definiert das Schema, rowHeight und headerHeight regeln die Dichte, emptyMessage deckt den Fall ohne Daten ab und backgroundColor passt sie an dein Bild an. Laut Produktblatt bleibt der Kopf beim Scrollen stehen, RowSelected feuert beim Klick, und selectedRowIndex kann die Auswahl in eine Variable zurückschreiben (dafür Nur lesend deaktivieren). clearSelection und scrollToTop setzen die Ansicht zurück.

Was uns gefällt

  • Sehr gut lesbar, mit fixiertem Tabellenkopf für lange Listen
  • Auswahl wird in eine Variable zurückgeschrieben, ideal für verknüpfte Faceplates
  • Schnell verbunden: eine Dateneigenschaft und eine Spaltendefinition

Gut zu wissen

  • Das Produktblatt erwähnt weder Suche noch Sortierung noch Seitenumschaltung: Nimm sie für kurze Listen
  • Die Hälfte der Vorschau ist leere Fläche unter den Zeilen; dimensioniere sie also passend zu deiner Zeilenzahl

Dynamisierbare Eigenschaften

  • dataJson
  • columns
  • selectedRowIndex
  • rowHeight
  • headerHeight
  • emptyMessage
  • backgroundColor
Data Table: kostenloses Datentabellen Custom Web Control für WinCC Unified und WinCC V8, Vorschaubild aus dem Katalog

Data Table

Kostenlos · WinCC Unified & V8 · CWC (.zip)

05Am besten zum seitenweisen Durchblättern von Chargendatensätzen

Paginated Records Table

Tabelle mit Seitenumschaltung als Custom Web Control im Dark Mode mit den Spalten Charge, Rezept, Linie, Start und Menge, die Chargen wie B-24-0412 Tomato Sauce 500 auf Linie L2 mit 1.250 kg zeigt, und einer Seitenumschaltung mit der Anzeige Rows 1 to 5 of 47
Die echte Vorschau des Controls, so wie sie im Katalog veröffentlicht ist. Ein Klick öffnet die Produktseite.

Die jüngste Tabelle in diesem Artikel, veröffentlicht im Oktober 2026, und eine durchdachte. Fünf Chargendatensätze füllen das Control, von B-24-0412 „Tomato Sauce 500“ auf Linie L2 bis B-24-0416 „Basil Purée“, mit Rezept, Linie, Startzeit und einer rechtsbündigen Menge in kg. In der Fußzeile steht „Rows 1–5 of 47“ neben einer Seitenumschaltung mit erster, vorheriger, Seitenzahlen, nächster und letzter Seite.

Ihre 17 Eigenschaften beschreiben eine saubere Arbeitsteilung. Deine Projektskripte fragen die Datenbank ab und schreiben nach einem PageChanged-Ereignis die aktuelle Seite in rows, die Gesamtzahl der Datensätze in totalCount und die bestätigte Seite in pageIndex. pageSize, columns (Beschriftungen, Ausrichtung und Einheiten) und rangeTemplate formen die Ansicht. Ein Klick auf eine Zeile oder Enter bzw. Leertaste löst RowClicked aus und öffnet ein abgedunkeltes Detailblatt mit Name, Wert und Einheit jedes gespeicherten Parameters, die du über selectedParameters und parametersRowId lieferst.

Was uns gefällt

  • Serverseitige Seitenumschaltung: Das Panel hält nur die Zeilen, die gerade zu sehen sind
  • Ein Detailblatt mit Parametern zu jedem Datensatz, mit Esc schließbar
  • Tastaturbedienung und barrierefreie Beschriftungen

Gut zu wissen

  • In der Vorschau sind die Zeilen sehr hoch, man sieht also nur wenige Datensätze auf einmal
  • Ohne deine Skripte läuft nichts: Die Abfragen leben in deinem Projekt, nicht im Control

Dynamisierbare Eigenschaften

  • rows
  • totalCount
  • pageIndex
  • pageSize
  • columns
  • rangeTemplate
  • selectedParameters
  • parametersRowId
  • backgroundColor
Paginated Records Table: kostenloses Datentabellen Custom Web Control für WinCC Unified und WinCC V8, Vorschaubild aus dem Katalog

Paginated Records Table

Kostenlos · WinCC Unified & V8 · CWC (.zip)

06Am besten für den CSV-Export historischer Daten

Historical Data CSV Exporter

CSV-Exporter für historische Daten als Custom Web Control im Light Mode mit Auswahlfeldern für Start- und Endzeitstempel, einer Vorschautabelle mit Werten für TT_101 Temperatur, PT_201 Druck, FT_301 Durchfluss und LT_401 Füllstand, dem Text Configured 4 tags, Previewing 15 of 26 records und einer grünen Schaltfläche Export CSV
Die echte Vorschau des Controls, so wie sie im Katalog veröffentlicht ist. Ein Klick öffnet die Produktseite.

Für den Klassiker unter den Anfragen: „Krieg ich die Daten von heute Nacht in Excel?“ Zwei Datums- und Uhrzeitauswahlen legen das Zeitfenster fest, in der Vorschau von 09:16 bis 10:16, und eine Tabelle zeigt die Datensätze vorab mit Zeitstempel und vier Archivvariablen: TT_101 Temperatur in °C, PT_201 Druck in bar, FT_301 Durchfluss in m³/h und LT_401 Füllstand in %. In der Fußzeile steht „Configured: 4 tags • Previewing: 15 of 26 records“, daneben eine große grüne Schaltfläche „Export CSV“.

Das Produktblatt benennt den ganzen Ablauf. startTimestamp und endTimestamp halten das Zeitfenster (Nur lesend deaktivieren, damit die Auswahl des Bedieners in den Variablen ankommt), startLabel und endLabel übersetzen die Beschriftungen, und loggingTags listet die Spalten. Dein Skript beantwortet QueryRequested, indem es die Datensätze in historicalDataJson schreibt, maxPreviewRows begrenzt die Vorschau, und der Export erzeugt eine CSV-Datei, benannt mit fileNamePrefix, und löst ExportTriggered aus. previewButtonText, exportButtonText, setHistoricalData und triggerExport runden es ab.

Was uns gefällt

  • Kompletter Ablauf aus Abfrage, Vorschau und Export in einem Bild
  • Einheitliche Dateinamen für Schicht- und Auditberichte
  • Helle, büroähnliche Optik, die gut zu Berichtsbildern passt

Gut zu wissen

  • In der Vorschau verschwindet eine Schaltfläche unter den Datumsauswahlen fast vollständig hinter der Tabelle
  • Es liest dein Archiv nicht von selbst: Ein Skript muss historicalDataJson füllen

Dynamisierbare Eigenschaften

  • startTimestamp
  • endTimestamp
  • loggingTags
  • historicalDataJson
  • maxPreviewRows
  • fileNamePrefix
  • startLabel
  • endLabel
  • previewButtonText
  • exportButtonText
  • backgroundColor
Historical Data CSV Exporter: kostenloses Datentabellen Custom Web Control für WinCC Unified und WinCC V8, Vorschaubild aus dem Katalog

Historical Data CSV Exporter

Kostenlos · WinCC Unified & V8 · CWC (.zip)

07Am besten für Prüf- und Wägeprotokolle

Inspection Log

Prüfprotokoll als Custom Web Control im Light Mode mit dem Titel Tube Weight Inspection Log, einem Badge Standalone / Ready und einer Tabelle mit Tubennummern, Datum und Uhrzeit, Gewicht und Gewichtsstatus, in der die Zellen OK HIGH gelb hervorgehoben sind
Die echte Vorschau des Controls, so wie sie im Katalog veröffentlicht ist. Ein Klick öffnet die Produktseite.

Ein schnörkelloses Protokoll direkt von der Produktionslinie. „TUBE WEIGHT INSPECTION LOG“ steht über einer hellen Tabelle mit Rahmenlinien, die Tubennummer, Datum und Uhrzeit, Gewicht und Gewichtsstatus für die Tuben 101 bis 108 zeigt. Die Gewichte liegen um 17,7 bis 17,9, und die drei mit „OK HIGH“ bekommen eine knallgelbe Zelle, sodass sie sofort ins Auge springen. Ein Badge „STANDALONE / READY“ in der Ecke zeigt den Verbindungsstatus.

Das Produktblatt zählt 7 Eigenschaften und nennt alle: recordsJson nimmt die Datensätze entgegen (zum Beispiel das Ergebnis einer SQL-Abfrage), maxDisplayedRows hält die Ansicht kurz, titleText und connectionStatusText beschriften sie, headerColor und backgroundColor legen die Palette fest, und highlightHighWeightColor wählt die Warnfarbe. RowSelected und RefreshRequested sprechen mit deinen Skripten, während appendRecord Live-Ergebnisse einzeln anhängt und clearRecords eine neue Sitzung beginnt.

Was uns gefällt

  • Ergebnisse außerhalb der Toleranz sind nicht zu übersehen
  • appendRecord für Live-Daten direkt von einer Kontrollwaage
  • Klassische, druckfreundliche Optik, die Qualitätsteams mögen

Gut zu wissen

  • Für Gewichte gemacht: Andere Prüfungen bedeuten umbenannte Spalten, und die Gewichtsspalte zeigt keine Einheit
  • Das Produktblatt spricht von hervorgehobenen Zeilen, in der Vorschau wird aber nur die Statuszelle gelb

Dynamisierbare Eigenschaften

  • recordsJson
  • maxDisplayedRows
  • titleText
  • connectionStatusText
  • highlightHighWeightColor
  • headerColor
  • backgroundColor
Inspection Log: kostenloses Datentabellen Custom Web Control für WinCC Unified und WinCC V8, Vorschaubild aus dem Katalog

Inspection Log

Kostenlos · WinCC Unified & V8 · CWC (.zip)

08Publikumsliebling: die flexibelste (Tabulator)

Custom table

Custom table Custom Web Control in einem Fenster mit blauer Titelleiste, den Spalten Name, Salary und Rating, grünen Fortschrittsbalken und Sternebewertungen für Donald, Peter und Ronaldo, einer ausgewählten Zeile und dem Text The content of the selected row is name Peter
Die echte Vorschau des Controls, so wie sie im Katalog veröffentlicht ist. Ein Klick öffnet die Produktseite.

Der Veteran der Liste, veröffentlicht im Juli 2025, und mit 45 Downloads im November 2026 die meistgeladene Tabelle im Katalog. Die Vorschau ist eine Demo, kein Anlagenbild: Ein Fenster mit blauer Titelleiste enthält die Spalten Name, Salary und Rating für Donald, Peter und Ronaldo, mit grünen Fortschrittsbalken und Sternebewertungen. Peters Zeile ist ausgewählt, und eine Zeile darunter gibt den Klick wieder: „The content of the selected row is: {"name":"Peter"}“.

Was ihr an Optik fehlt, macht sie an Reichweite wett. Laut Produktblatt basiert sie auf Tabulator, einer bekannten Open-Source-Tabellenbibliothek; Filter, Spaltenformatierer und dynamisches Styling sind also alle an Bord. Gefüttert wird sie über zwei Eigenschaften, TableDataString für die Zeilen und ColumnStyleString für die Spaltendefinitionen, und ein Klick-Ereignis verrät deinem Skript, welche Zeile und Spalte angeklickt wurden, bereit für ein Popup oder einen Bildwechsel. Der Download enthält ein Beispielprojekt und eine Integrationsanleitung auf Englisch.

Was uns gefällt

  • Tabulator unter der Haube: Formatierer, Filter und Sortierung mit Online-Dokumentation
  • Klick-Ereignis für Zeile und Spalte für den Drill-down
  • Beispielprojekt inklusive, und die meistgeladene Tabelle

Gut zu wissen

  • Angestaubte Optik und Demodaten in der Vorschau: Plan ein neues Styling ein
  • Die Spaltendefinitionen schreibst du als JSON-String, was etwas Lektüre der Tabulator-Doku erfordert

Dynamisierbare Eigenschaften

  • TableDataString
  • ColumnStyleString
Custom table: kostenloses Datentabellen Custom Web Control für WinCC Unified und WinCC V8, Vorschaubild aus dem Katalog

Custom table

Kostenlos · WinCC Unified & V8 · CWC (.zip)

Lobende Erwähnung: noch eine Tabelle, die einen Blick wert ist

Ein gut aussehendes Control, das es nicht in die Top Acht geschafft hat, weil sein Produktblatt die Eigenschaften nicht nennt. Ein Klick auf das Vorschaubild öffnet die Produktseite.

  • Modern table: kostenloses Datentabellen Custom Web Control für WinCC Unified und WinCC V8, Vorschaubild aus dem Katalog

    Modern table

    Ein Anlagenmonitor mit Live-Uhr, Zählern für Gesamtleistung und Alarme und einer Gerätetabelle mit Status-Badges, Temperatur, Lastbalken, Zustand und einer Schaltfläche „VER“. Die Texte der Vorschau sind auf Spanisch, und das Produktblatt zählt 14 Eigenschaften, 2 Ereignisse und 2 Methoden, ohne sie zu nennen.

    Zum Produkt

Nicht die passende Tabelle gefunden? Bau dir deine eigene (oder remixe eine) mit KI, kostenlos

Ein Geständnis: Jede Datentabelle in diesem Artikel wurde mit dem KI-Generator von HMIx erstellt. Deshalb können wir das sagen, ohne rot zu werden: Wenn keine davon deine Datensätze so zeigt, wie du es brauchst, generierst du dir in wenigen Minuten deine eigene.

Beschreib die Tabelle in einfachen Worten (zum Beispiel „Tabelle der letzten 50 Fertigungsaufträge mit Auftragsnummer, Produkt, Menge, Fortschrittsbalken und einer roten Zeile, wenn ein Auftrag im Verzug ist, mit Suche und einem Ereignis beim Klick auf eine Zeile“), und der Generator führt dich Schritt für Schritt durch: das Design, die Eigenschaften, Ereignisse und Methoden, die du in WinCC verwendest, eine Simulation zum Ausprobieren von Werten und das fertige Custom-Web-Control-Paket für WinCC Unified und WinCC V8. Dasselbe Werkzeug baut auch dynamische SVGs, wenn eine schlanke Zeichnung alles ist, was du brauchst.

  • Remixe jede Tabelle dieser Liste: Auf ihrer Produktseite öffnet die Schaltfläche „Im KI-Generator bearbeiten“ sie direkt im Generator, bereit für Änderungswünsche wie „entfern die Kursivschrift“, „füg der Gewichtsspalte eine Einheit hinzu“ oder „färb bei einem Fehler die ganze Zeile ein“. Die Links „Mit KI bearbeiten“ in diesem Artikel machen dasselbe.
  • Kostenlos ausprobieren: Du kannst ohne Konto loslegen, mit einem kleinen täglichen Kontingent an Credits, und der Community-Plan ist kostenlos.
  • Das Ergebnis kannst du direkt nutzen: Lade das Paket herunter und bring es in dein Projekt in TIA Portal, wie jede andere Tabelle auf dieser Seite.

So verwendest du ein Datentabellen Custom Web Control in WinCC Unified (und WinCC V8)

Die Kurzfassung für alle, die ihre Tabelle schon gewählt haben. Unsere Anleitung zu Custom Web Controls erklärt jeden Schritt mit Schemazeichnungen und Screenshots.

  1. Das ZIP herunterladen

    Öffne die Produktseite, melde dich mit deinem kostenlosen Konto an und lade die Tabelle herunter. Das heruntergeladene ZIP enthält die Dokumentation und darin das Control-Paket namens {GUID}.zip: Genau diese innere Datei brauchst du.

  2. In dein Projekt in TIA Portal kopieren

    Kopiere die Datei {GUID}.zip, weiterhin gepackt, in deinen Projektordner unter UserFiles\CustomControls (leg beide Ordner an, falls sie noch nicht existieren). Nicht entpacken.

  3. Meine Controls aktualisieren und ins Bild ziehen

    Öffne in TIA Portal die Task Card Werkzeuge, klappe die Palette Meine Controls auf und klicke auf Aktualisieren. Die Tabelle erscheint in der Liste: Zieh sie ins Bild und gib ihr genug Platz für ihre Spalten.

  4. Die Eigenschaften verbinden und testen

    Wähle das Control aus und öffne im Inspektorfenster Eigenschaften → Eigenschaften → Schnittstelle. Diese Tabellen nehmen ihre Zeilen als JSON-String entgegen (dataJson, historicalData, recordsJson, TableDataString …). Fang deshalb mit einer internen String-Variablen und einem kleinen Testskript an, das zwei oder drei Zeilen schreibt, und starte Runtime. Bei Eigenschaften, die das Control zurückschreibt, etwa selectedRowIndex oder pageIndex, deaktivierst du Nur lesend. Sehen die Zeilen richtig aus, wechselst du auf deine echten Daten.

  5. Unter WinCC V8

    Jeder Favorit in diesem Artikel ist auf seiner Produktseite als kompatibel mit WinCC V8 gekennzeichnet. Das Paket ist dasselbe; für Import und Projektierung von Custom Web Controls in dieser Umgebung folgst du der Dokumentation von WinCC V8.

Profi-Tipp: Schick der Tabelle nur, was der Bediener auch lesen kann. Nutz die Zeilenlimits, die diese Controls bieten (rowsPerPage, pageSize, maxDisplayedRows, maxPreviewRows), und frag bei großen Datenmengen eine Seite nach der anderen ab, so wie es die Paginated Records Table macht. Ein JSON-String mit Tausenden Zeilen, der jede Sekunde neu geschrieben wird, ist Schwerstarbeit für ein Unified Comfort Panel und nutzlos für den Menschen davor.

Zur vollständigen Anleitung für Custom Web Controls

Häufige Fragen

Sind diese Datentabellen Custom Web Controls wirklich kostenlos?

Ja. Jede Tabelle in diesem Artikel ist bei HMIx als kostenloses Produkt veröffentlicht. Zum Herunterladen brauchst du nur ein kostenloses Konto.

Warum ein Custom Web Control für eine Tabelle in WinCC Unified?

Die Standardobjekte von WinCC sind für bestimmte Daten gebaut, etwa Meldungen, Trends oder Parametersätze. Willst du ein Grid mit deinen eigenen Datensätzen – Fertigungsaufträge, Chargen, Qualitätsprüfungen oder das Ergebnis einer Datenbankabfrage – mit Suche, Seitenumschaltung, Statusfarben und einem Ereignis beim Klick auf eine Zeile, liefert dir ein Datentabellen Custom Web Control genau dieses Grid, fertig zum Verbinden.

Wie bekomme ich Zeilen in die Tabelle?

Die meisten dieser Tabellen nehmen ihre Zeilen als JSON-String in einer Eigenschaft wie dataJson, historicalData, recordsJson oder TableDataString entgegen. Bau diesen String in einem WinCC-Skript zusammen oder verbinde eine String-Variable, die etwas anderes füllt; das genaue Format prüfst du in der Dokumentation, die im Download enthalten ist.

Kann ein Custom Web Control meine SQL-Server-Datenbank lesen?

Betrachte den Datenbankzugriff als Teil deines Projekts, nicht des Controls. Die SQL-orientierten Tabellen in dieser Liste stellen Abfrage- und Verbindungseigenschaften, Ereignisse wie RefreshRequested oder PageChanged und Methoden wie setTableData bereit, damit deine Skripte oder ein serverseitiger Konnektor die Abfragen ausführen und die Ergebnisse an die Tabelle übergeben. Lies die Dokumentation des gewählten Controls, nutz wo möglich einen Datenbankbenutzer mit reinen Leserechten und speichere niemals ein Datenbankpasswort in einer Variablen, die Bediener lesen können.

Funktionieren sie auf WinCC Unified Comfort Panels und unter WinCC V8?

Auf ihren Produktseiten ist die Kompatibilität mit WinCC Unified, einschließlich Unified Comfort Panels, und mit WinCC V8 angegeben. Wie bei jedem mit KI erzeugten Control gilt: Teste das Verhalten in deinem eigenen Projekt und auf deinem Zielgerät, bevor du in Produktion gehst, besonders mit der Zeilenzahl, die du anzeigen willst.

Kann ich eine dieser Tabellen verändern?

Na klar. Du kannst HTML, CSS und JavaScript des Controls selbst bearbeiten oder auf der Produktseite auf „Im KI-Generator bearbeiten“ klicken und die Änderungen in ganz normaler Sprache beschreiben. Die zweite Variante ist meist schneller, weil sich der Generator um Schnittstelle und Paketierung kümmert.

Unser Fazit

Wenn du nur eine herunterlädst, dann die Dynamic Data Table: Suche, Seitenumschaltung und CSV-Export in einem ruhigen Grid, das du in Minuten verbunden hast. Für einen SQL-Server-Editor die Table SQL Server; für die Qualität das Quality Control Log; für eine kurze Liste mit Live-Werten die Data Table; für lange Chargenhistorien die Paginated Records Table; für „Ich brauch das in Excel“ den Historical Data CSV Exporter; für eine Kontrollwaage das Inspection Log; und wenn du den kompletten Werkzeugkasten von Tabulator willst, die Custom table.

Und falls deine Datensätze eine Tabelle brauchen, die keine davon zeichnet (das tun sie immer), denk daran: Der Generator, der sie gebaut hat, ist nur einen Klick entfernt.