Datenpunktkonnektivität

Die WebUI Runtime verbindet sich über die OaRxJsApi-Bibliothek mit WinCC OA-Datenpunkten und ermöglicht die Live-Datenanzeige sowie Steuerungsaktionen.

Datenpunkte lesen (dpConnect)

dpConnect erstellt ein reaktives Abonnement für einen Datenpunktwert. Das Abonnement empfängt sofort den aktuellen Wert (wenn der zweite Parameter true ist) sowie alle nachfolgenden Änderungen. Der WebUI Runtime-Wrapper bildet die CTRL-Funktion dpConnect() ab.

import { OaRxJsApi } from '@etm-professional-control/oa-rx-js-api';
import { container } from 'tsyringe';
import { map } from 'rxjs';

const oaRxJsApi = container.resolve<OaRxJsApi>(OaRxJsApi);

const subscription = oaRxJsApi
  .dpConnect('System1:MyDatapoint.Value', true)
  .pipe(map((data) => (data.value[0] as number) ?? 0))
  .subscribe((value) => {
    console.log('Current value:', value);
  });
  • Datenpunktnamen im Browser erfordern immer das Präfix System1:.
  • Der zweite Parameter (true) liefert den aktuellen Wert sofort beim Verbinden.
  • data.value[0] enthält den Datenpunktwert.
  • Abonnements müssen in disconnectedCallback() bereinigt werden, um Speicherlecks zu vermeiden.

Datenpunkte schreiben (dpSet)

dpSet sendet Werte an WinCC OA. Der Web UI Runtime-Wrapper bildet die CTRL-Funktion dpSet() ab.

oaRxJsApi.dpSet(['System1:MyDatapoint.Value'], [42.5]).subscribe({
  next: (success) => { console.log('Value set:', success); },
  error: (err) => { console.error('Error:', err); }
});
  • dpSet akzeptiert Arrays für mehrere Datenpunkte: dpSet([name1, name2], [value1, value2]).
  • Gibt ein Observable zurück, das abonniert werden muss, um die Operation auszuführen.
  • Verwenden Sie SuccessNotificationEvent und ErrorNotificationEvent für Benutzer-Feedback.

Widgets mit wui-context-generator verwenden

Die Komponente wui-context-generator bindet Dashboard-Widgets deklarativ an Datenpunkte.

<wui-context-generator
  .component=${'wui-widget-gauge'}
  .config=${{
    value: {
      context: 'data-point',
      config: {
        dpName: 'System1:MyDatapoint.Value',
        definedConfigs: ['value']
      }
    }
  }}
  .properties=${{ min: 0, max: 100, label: 'Load', unit: 'MW' }}
></wui-context-generator>
Anmerkung:
Für Anzeigeinstrumente und Fortschrittsbalken ist die direkte Eigenschaftsbindung über @state() und OaRxJsApi oft zuverlässiger als der Datapoint-Kontext. Der Context Generator eignet sich besser für Trenddiagramme und komplexe Widgets.

Weitere OaRxJsApi-Methoden

Neben dpConnect und dpSet bietet die OaRxJsApi einen umfassenden Satz von Methoden, die CTRL-Funktionen für Datenpunktzugriff, Abfragen und Systeminteraktion widerspiegeln. Die folgende Tabelle listet die verfügbaren Methodenkategorien auf:

Kategorie Methoden
Datenpunkt-Subskriptionen dpConnect, dpConnectList, dpConnectListAdd, dpConnectListGet, dpConnectListRemove
Datenpunkte lesen/schreiben dpGet, dpGetAsynch, dpSet, getValue, setValue
Abfragen dpQuery, dpQueryConnect
Datenpunkt-Metadaten dpNames, dpElementType, dpGetAlias, dpGetDescription, dpGetFormat, dpGetUnit
Historische Daten dpGetPeriod, alertGetPeriod
System und Verbindung connect, disconnect, getConnectionState, connectToHeartbeat, systemInfoConnect, sysConnectDpDpt, prepareSysConnects
Benutzerdefinierte Befehle und MSA customCommand, customCommandWithId, customCommandSharedId
Konfiguration setBaseParams, setLocale, cnsGetCompletions

Alle Methoden geben RxJS Observables zurück. Die vollständige API-Dokumentation finden Sie in der -Referenz.