Les 6 meilleures courbes de tendance Custom Web Control pour WinCC Unified et WinCC V8 (gratuites)

Pourquoi une courbe de tendance Custom Web Control en vaut la peine

Un chiffre dit à l’opérateur où en est le process. Une courbe de tendance lui dit où il va. Le four chauffe-t-il encore ou s’est-il stabilisé ? La pression a-t-elle chuté avant ou après le mouvement de la vanne ? Voilà pourquoi les trends finissent sur presque toutes les vues WinCC Unified, de la simple page d’une cuve jusqu’au mur de la salle de contrôle.

WinCC Unified fournit déjà un contrôle de courbes pour les variables archivées et en direct, et pour bien des vues, il suffit amplement. Une courbe de tendance Custom Web Control (CWC) mérite sa place quand vous voulez ce que l’objet standard ne donne pas tel quel : trois axes indépendants avec un panneau latéral de signaux, une sparkline dans une tuile KPI, un trend intégré à un tableau de bord énergie ou des courbes que l’opérateur peut faire glisser. Un CWC est une petite application web — HTML, CSS et JavaScript emballés dans un ZIP — que WinCC Unified (TIA Portal) et WinCC V8 exécutent dans la vue. Il expose des propriétés comme timeRangeSeconds ou yAxisMax que vous reliez à des variables IHM, et il peut déclencher des événements vers vos scripts IHM, comme LimitExceeded.

Ce qui fait qu’une courbe de tendance Custom Web Control mérite d’être téléchargée

Avant la liste, la grille d’évaluation. Voici ce que nous avons regardé, à peu près dans l’ordre de ce qui nous agace le plus quand ça manque :

• Un axe du temps fiable. De vrais horodatages, une fenêtre glissante réglable et une échelle qui ne saute pas à chaque nouvel échantillon.
• Une échelle maîtrisée. Mise à l’échelle automatique pour la mise en service, yAxisMin et yAxisMax fixes pour la production, et des axes séparés quand vous mélangez bar, °C et m³/h.
• Des seuils et des événements. Des lignes de seuil et un événement quand une valeur les franchit transforment une jolie courbe en outil sur lequel l’opérateur peut agir.
• Une interface documentée. Des propriétés nommées sur la fiche produit, pour savoir ce que vous allez relier avant même d’ouvrir TIA Portal. Les fiches qui se contentent de compter leurs propriétés sont passées dans les mentions honorables.
• Le bon trend pour le bon usage. Un visualiseur d’analyse complet, une comparaison de deux signaux, une tuile pour les vues d’ensemble, un tableau de bord et un éditeur de consignes : nous avons retenu un champion par usage.

Comment nous les avons choisies (et ce que nous n’avons pas fait)

En octobre 2026, nous avons cherché dans le catalogue HMIx tous les Custom Web Controls gratuits construits autour d’une courbe dans le temps : visualiseurs de tendances, graphiques multi-courbes, tuiles sparkline, tableaux de bord avec un panneau de trend et éditeurs de courbes de consigne. Les graphiques à barres ont déjà leur propre article. Pour chaque candidat, nous avons regardé son vrai aperçu (pas la couverture du catalogue avec son grand titre par-dessus) et lu sa fiche produit pour voir quelles propriétés, quels événements et quelles méthodes elle documente. Les téléchargements n’ont servi qu’à départager les ex aequo.

Les contrôles dont la fiche ne nomme pas les propriétés, ou dont l’aperçu montre des défauts visibles, sont passés dans les mentions honorables, même les plus séduisants. Deux ont été écartés : l’aperçu de galerie de l’un est une image blanche, et dans celui de l’autre, la sparkline qui donne son nom au contrôle n’apparaît pas. Et une mise en garde : nous avons jugé des aperçus et de la documentation ; nous n’avons pas fait tourner ces contrôles dans un Runtime réel. Ils ont été générés par IA et chaque fiche produit rappelle de les tester dans votre propre projet TIA Portal avant la mise en production.

Les 6 meilleures courbes de tendance Custom Web Control, une par une

Chaque fiche montre le vrai aperçu, ce que nous avons aimé, ce qu’il faut garder en tête et les propriétés nommées sur sa fiche produit, puis la vignette du catalogue : cliquez dessus pour ouvrir la fiche produit et télécharger la courbe de tendance gratuitement.

01Meilleur choix global

Trend Chart

S’il ne fallait en garder qu’une, ce serait celle-ci. « Process Trend Viewer » trône en haut d’une carte sombre, et trois lignes lumineuses, Pressure A en cyan, Pressure B en vert et Flow Rate en violet, courent sur des aires légèrement ombrées le long d’un axe du temps aux vrais horodatages. Une légende en bas nomme chaque signal. Le look est moderne sans en faire trop, et c’est la courbe de tendance pure la plus téléchargée du catalogue en octobre 2026.

D’après sa fiche, elle tourne sur le moteur ECharts, et son interface est courte et droit au but : le tableau lines porte les séries avec leurs couleurs et leurs données, timeRangeSeconds fixe la fenêtre glissante, autoScaleY ou les valeurs fixes yAxisMin et yAxisMax décident de l’échelle, et showLimits trace une ligne de consigne. chartTitle, showGrid et backgroundColor font le reste. Deux événements la rendent utile au-delà du simple coup d’œil : LimitExceeded se déclenche quand une valeur franchit son seuil et PointClicked signale le point que l’opérateur a touché.

Ce qu’on aime

• +Plusieurs signaux dans un seul graphique, au style net et lisible
• +Ligne de seuil plus un événement LimitExceeded pour vos scripts
• +Interface courte, rapide à relier

À garder en tête

• –Dans l’aperçu, l’échelle automatique s’arrête sur des bornes bizarres (10.26 à 49.12) : fixez yAxisMin et yAxisMax pour la production
• –Toutes les séries partagent un seul axe : ne mélangez que des signaux aux plages similaires

Propriétés à relier

• lines
• autoScaleY
• yAxisMin
• yAxisMax
• showLimits
• timeRangeSeconds
• chartTitle
• showGrid
• backgroundColor

Trend Chart

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

↓Voir et télécharger gratuitement✦Modifier avec l’IA

02Le meilleur trend multi-axes pour la salle de contrôle

Real-Time Trend Chart

Ce qui se rapproche le plus d’un vrai visualiseur de tendances dans cette liste. « Mill Area Configuration » coiffe une barre d’outils avec Manage Groups, Rename Group, Clear View, Export CSV, Light/Dark et Refresh. À gauche, un panneau latéral liste les signaux du groupe, chacun affecté à l’axe 1, 2 ou 3 avec son épaisseur de ligne, plus les options d’affichage et la configuration du temps : Real-Time (Rolling window) sur les 5 dernières minutes. À droite, trois signaux en °C, en bar et en m³/h se partagent le graphique sur trois axes indépendants, dont un tracé en escalier.

Sa fiche compte 21 propriétés reliables. axis1, axis2 et axis3 configurent les axes, maxPointsPerLine plafonne le tampon interne, timeRangeSeconds fixe la fenêtre glissante, et autoScaleY ou yAxisMin et yAxisMax gèrent l’échelle. showLimits, showGrid, backgroundColor et chartBackgroundColor finissent l’habillage. LimitExceeded se déclenche quand un signal franchit son seuil, et la méthode exportToCSV enregistre les données pour l’analyse.

Ce qu’on aime

• +Trois axes indépendants pour des signaux aux unités différentes
• +Groupes de signaux, fenêtre glissante et export CSV
• +Thèmes sombre et clair depuis la barre d’outils

À garder en tête

• –Chargé : donnez-lui un grand écran. Dans l’aperçu, certains libellés de boutons passent à la ligne et « + Select » déborde de son bouton
• –Un signal de l’aperçu s’appelle « Prueba 1 » (« Test 1 » en espagnol) : renommez vos signaux avant que le client ne tombe dessus

Propriétés à relier

• axis1
• axis2
• axis3
• maxPointsPerLine
• autoScaleY
• yAxisMin
• yAxisMax
• timeRangeSeconds
• showLimits
• showGrid
• backgroundColor
• chartBackgroundColor

Real-Time Trend Chart

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

↓Voir et télécharger gratuitement✦Modifier avec l’IA

03La meilleure pour comparer deux signaux

Trend Chart

Parfois, la question est simplement : « B suit-il A ? ». Ce trend à deux séries y répond : Series 1 en bleu et Series 2 en jaune oscillent en opposition de phase sur un axe « Value » de 0 à 100, avec des horodatages en bas et des aires remplies qui rendent les croisements évidents.

Sa fiche liste 13 propriétés et en nomme douze. curveData1 et curveData2 portent les deux flux de données, labelCurve1, labelCurve2, colorCurve1 et colorCurve2 les nomment et les colorent, et lineThickness, showGrid et backgroundColor règlent l’apparence. L’échelle est soit automatique avec autoScale, soit fixe avec yAxisMin et yAxisMax. L’événement PointSelected se déclenche au clic sur un point, et deux méthodes bien pratiques complètent le tout : clearChart pour repartir sur un nouveau cycle et exportAsImage pour enregistrer la vue courante en PNG.

Ce qu’on aime

• +Taillée pour consigne contre mesure ou entrée contre sortie
• +Export PNG intégré
• +Noms et couleurs des deux courbes reliables

À garder en tête

• –L’aperçu dessine un marqueur sur chaque échantillon, ce qui transforme des données denses en collier de perles : vérifiez le rendu avec votre période d’échantillonnage
• –Les aires qui se chevauchent virent au marron et au bleu-vert ; les libellés restent « Series 1 » et « Series 2 » tant que vous ne les changez pas

Propriétés à relier

• curveData1
• curveData2
• labelCurve1
• labelCurve2
• colorCurve1
• colorCurve2
• lineThickness
• autoScale
• yAxisMin
• yAxisMax
• showGrid
• backgroundColor

Trend Chart

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

↓Voir et télécharger gratuitement✦Modifier avec l’IA

04Le meilleur pour les tableaux de bord énergie (le plus téléchargé)

Power Monitor Dashboard

Ce n’est pas une courbe de tendance à proprement parler, mais c’est le trend qui fait ce tableau de bord. Sous « Analyzer Monitor, 3-Phase Power Analysis », six jauges en arc affichent tension et courant sur L1, L2 et L3, une colonne à droite regroupe puissances active, réactive et apparente avec leurs barres, une jauge de facteur de puissance indique 0.957 et la fréquence 50.01 Hz. En bas, un « Active Power Trend » avec un badge « Live » trace la ligne jaune de puissance face à une ligne de seuil blanche en pointillés.

C’est le contrôle le plus téléchargé de cet article, avec 42 téléchargements et trois avis cinq étoiles en octobre 2026. Sa fiche compte 34 propriétés et en nomme une poignée : voltageMax et currentMax pour les échelles des jauges, des libellés comme labelVoltage et labelTrend, et backgroundColor. Elle décrit la plage de temps configurable du trend, son axe Y à échelle automatique et ses lignes de seuil, deux événements, PowerLimitExceeded et PhaseImbalanceDetected, et une méthode resetTrend.

Ce qu’on aime

• +Une vue triphasée complète avec le trend intégré
• +Événements de dépassement de puissance et de déséquilibre de phases
• +Le chouchou du public, donc le plus éprouvé par d’autres utilisateurs

À garder en tête

• –L’aperçu affiche le bas de l’axe du trend en 21.849999999999998
• –Sa fiche ne nomme que quelques-unes de ses 34 propriétés, et les valeurs de démo de l’aperçu sont factices (la puissance apparente y est inférieure à la puissance active) : vérifiez la liste Interface dans TIA Portal avant de relier quoi que ce soit

Propriétés à relier

• voltageMax
• currentMax
• labelVoltage
• labelTrend
• backgroundColor

Power Monitor Dashboard

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

↓Voir et télécharger gratuitement✦Modifier avec l’IA

05La meilleure tuile sparkline pour les vues d’ensemble

KPI Sparkline Tile

Pas besoin d’être grand pour être utile. Cette tuile affiche « DISCHARGE PRESSURE », 43.6 bar en gros caractères, un badge vert avec une flèche montante et 1.2 %, et en dessous une sparkline cyan qui se termine par un point lumineux sur la dernière valeur. Dix tuiles comme celle-ci sur une vue d’ensemble, et l’opérateur voit quelles valeurs dérivent avant même d’en lire une seule.

Sa fiche compte 8 propriétés reliables. trendData alimente la sparkline, deltaValue pilote le badge coloré, title et unit l’étiquettent, et sparklineColor et backgroundColor fixent la palette. highThreshold est la bonne idée : au-dessus, la tuile passe en état d’alarme avec une bordure rouge pulsante. KPITileClicked ouvre la porte à une vue de détail, triggerAlarmManual permet de tester l’aspect de l’alarme et resetTrend efface l’historique.

Ce qu’on aime

• +Valeur, variation et historique récent dans une petite tuile
• +État d’alarme avec bordure pulsante au-dessus de highThreshold
• +Événement de clic pour naviguer vers le détail

À garder en tête

• –L’aperçu publié est une petite tuile perdue dans un grand canevas vide (nous l’avons recadré pour cet article)
• –La bordure d’alarme pulsante n’apparaît pas dans l’aperçu : testez-la avec triggerAlarmManual

Propriétés à relier

• trendData
• deltaValue
• highThreshold
• title
• unit
• sparklineColor
• backgroundColor

KPI Sparkline Tile

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

↓Voir et télécharger gratuitement✦Modifier avec l’IA

06Le meilleur pour éditer des courbes de consigne

Curve Scheduler

Le mouton noir de la liste, et on s’en réjouit : un trend qu’on écrit au lieu de le lire. « Greenhouse Climate Strategy » trace trois courbes de consigne, rouge, bleue et verte, sur un axe de 24 heures, et une astuce à l’écran résume tout : « Drag points on graph to adjust time and values. Timeline sorts automatically. » (faites glisser les points pour ajuster heures et valeurs, la chronologie se trie toute seule). En dessous, un tableau liste les points (Morning, Day, Evening et Night à 06:00, 12:00, 18:00 et 22:00) avec des curseurs pour le chauffage en °C, la ventilation en % et l’irrigation en L/m², plus des boutons Import, Export et Add Point.

Sa fiche nomme les couleurs et unités de chaque variable (heatingColor, ventilationColor, irrigationColor, heatingUnit, ventilationUnit, irrigationUnit), les limites d’échelle heatingMax et irrigationMax, des libellés comme nameColumnLabel et importBtnLabel, et backgroundColor. La propriété clé, c’est scheduleData : quand l’opérateur modifie une courbe, OnDataChanged se déclenche et le JSON mis à jour repart vers la variable — c’est donc l’une des propriétés pour lesquelles il faut décocher Lecture seule. SetStrategyData, AddPoint et ClearAllPoints sont là pour vos scripts.

Ce qu’on aime

• +L’opérateur modifie le profil sur le graphique ou dans le tableau
• +Réécrit le programme en JSON avec un événement
• +Idéal pour le séchage, la chauffe de lots et les cycles de serre

À garder en tête

• –Les trois variables partagent un seul axe de 0 à 100 : lisez les valeurs exactes dans le tableau
• –Les premier et dernier libellés horaires sont coupés aux bords de l’aperçu

Propriétés à relier

• scheduleData
• heatingColor
• ventilationColor
• irrigationColor
• heatingUnit
• ventilationUnit
• irrigationUnit
• heatingMax
• irrigationMax
• nameColumnLabel
• importBtnLabel
• backgroundColor

Curve Scheduler

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

↓Voir et télécharger gratuitement✦Modifier avec l’IA

Mentions honorables : 4 autres courbes de tendance qui valent le coup d’œil

De bons contrôles qui n’ont pas intégré le top 6, parce qu’un cousin l’a fait, que leur fiche produit ne nomme pas les propriétés ou que leur aperçu montre un défaut à vérifier d’abord. Cliquez sur une vignette pour ouvrir sa fiche produit.

• 

  Process Trend Monitor

  Un proche cousin du Real-Time Trend Chart avec panneau latéral repliable, export CSV, événements PointAdded et ExportTriggered et prise en charge de données historiques issues de fichiers dans lines. Dans l’aperçu, les courbes débordent de la zone de tracé et un libellé d’axe est tronqué en « 38.684... ».

  Voir le produit →
• 

  Trend Viewer with Crosshair

  Un visualiseur tout en hauteur avec horloge en direct, trois pastilles de valeur (86,8 °C, 5,58 bar, 73 L/min) et un trend violet avec une ligne de consigne en pointillés. Sa fiche décrit l’inspection au réticule et des commandes de zoom, mais ne nomme pas ses 10 propriétés.

  Voir le produit →
• 

  Neon line chart

  Trois tracés néon, violet, cyan et orange en pointillés, sur un axe de 0 à 70 avec des horodatages en direct. Sa fiche mentionne la mise en tampon des données, des plages de temps configurables et la surveillance de seuils, et annonce 9 propriétés, 1 événement et 2 méthodes sans les nommer.

  Voir le produit →
• 

  KPI Card with line chart

  Une valeur sur un trend en arrière-plan, avec maxPoints, decimalPlaces et un passage de themeColor à alertColor quand ThresholdExceeded se déclenche. Dans l’aperçu, le libellé chevauche la courbe et le trend ne remplit qu’une partie de la carte.

  Voir le produit →

Comment utiliser une courbe de tendance Custom Web Control dans WinCC Unified (et WinCC V8)

La version courte, pour quand vous avez déjà choisi votre graphique. Notre guide des Custom Web Controls détaille chaque étape avec schémas et captures d’écran.

1. 1

   Téléchargez le ZIP

   Ouvrez la fiche produit, connectez-vous avec votre compte gratuit et téléchargez le graphique. Le ZIP téléchargé contient la documentation et, à l’intérieur, le paquet du contrôle nommé {GUID}.zip : c’est ce fichier intérieur qu’il vous faut.

2. 2

   Copiez-le dans votre projet TIA Portal

   Copiez le fichier {GUID}.zip, toujours compressé, dans le dossier de votre projet, sous UserFiles\CustomControls (créez les deux dossiers s’ils n’existent pas). Ne l’extrayez pas.

3. 3

   Actualisez Mes contrôles et faites-le glisser

   Dans TIA Portal, ouvrez la task card Outils, développez la palette Mes contrôles et cliquez sur Actualiser. Le graphique apparaît dans la liste : faites-le glisser sur votre vue et laissez-lui assez de place pour ses axes et sa légende.

4. 4

   Reliez et testez les propriétés

   Sélectionnez le contrôle et, dans la fenêtre d’inspection, ouvrez Propriétés → Propriétés → Interface. La plupart de ces graphiques reçoivent leurs séries sous forme de tableau ou de chaîne JSON (lines, curveData1, trendData…) : commencez donc par une variable interne, ajoutez un champ E/S ou un petit script de test qui écrit quelques valeurs et lancez Runtime. Une fois que les courbes bougent comme prévu, passez aux vraies variables de l’automate.

5. 5

   Sous WinCC V8

   Chaque graphique du top de cet article est indiqué comme compatible WinCC V8 sur sa fiche produit. Le paquet est le même ; suivez la documentation WinCC V8 pour importer et configurer des Custom Web Controls dans cet environnement.

Astuce de pro : ces graphiques gardent leur propre historique dans un tampon (timeRangeSeconds, maxPointsPerLine, maxPoints…) ; ils montrent donc ce qui s’est passé depuis l’ouverture de la vue, pas ce que contient votre archive. Si l’opérateur a besoin des postes précédents, remplissez les données depuis vos archives dans un script, ou réservez-les aux vues en direct, à côté du contrôle de courbes standard. Et fixez l’échelle sur la plage réelle de votre process : un axe qui se recalcule à chaque échantillon rend les dérives lentes invisibles.

Questions fréquentes

Notre verdict

Si vous n’en téléchargez qu’une, prenez le Trend Chart (586) : des courbes nettes, des seuils avec événement et une interface reliée en quelques minutes. Pour une salle de contrôle aux unités mélangées, le Real-Time Trend Chart et ses trois axes ; pour consigne contre mesure, le Trend Chart à deux séries (681) ; pour les vues d’ensemble, la KPI Sparkline Tile ; pour l’énergie, le Power Monitor Dashboard ; et quand l’opérateur doit dessiner lui-même le profil, le Curve Scheduler.

Et si votre process réclame un trend qu’aucune ne trace (c’est toujours le cas), n’oubliez pas que le générateur qui les a créées n’est qu’à un clic.