Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

Design Dashboard Displays (Tutorial) teaches you to:

  • Layout dashboard displays
  • Add KPI indicators
  • Configure charts
  • Auto-refresh data

Prerequisites

  • Tags and historian configured
  • Basic display knowledge

In this page:

Table of Contents
maxLevel2
minLevel2
indent10px
excludeSteps
stylenone

    


Dashboard →  Tutorial | Concept | How-to Guide | Reference

Dashboard Layout

  1. Create new display: Dashboard_Main
  2. Set grid layout:
    • 3 columns × 2 rows
    • Margins: 10px
    • Responsive sizing

Add KPI Cards

Create KPI card for OEE:

  1. Add GroupBox (300×150)
  2. Inside add:
    • Title: "Overall OEE"
    • Large value: @Tag.OEE + "%"
    • Trend sparkline (last 24h)
    • Color indicator (Green >85%, Yellow >70%, Red <70%)

Production Metrics

Add production counter card:

  • Current shift production
  • Target vs actual
  • Run rate per hour
  • Percentage of target

Add Charts

Production Trend:

  1. Add TrendChart
  2. Show last 7 days
  3. Daily production totals
  4. Target line overlay

Downtime Pareto:

  1. Add BarChart
  2. Data: Top 5 downtime reasons
  3. Sort by duration
  4. Show percentages

Alarm Summary

Add alarm statistics panel:

  • Active alarms count
  • Unacknowledged count
  • Last alarm time
  • Mean time to acknowledge

Step 6: Auto-Refresh

Configure updates:

csharp

// Refresh every 30 seconds
Timer.Interval = 30000;
Timer.Tick += RefreshDashboard;

Next Steps

  • [Reports Module] - Scheduled reports
  • [Visualize on Web and Mobile] - Remote access


    1. Create Display

    1. Navigate to Displays → Draw
    2. Click New a New Document
    3. Name: Dashboard_System
    4. Template: Dashboard
    5. Click OK

    2. Add Charts / Gauges

    1. Add TrendChart by dragging and drop them into the Placeholders
    2. Add Temperature pens to the chart
    3. Add different Gauges
    4. You can customize the display to have any symbol or graphical component available

    In this section...

    Page Tree
    root@parent
    spaces93DRAF