Widget Types Reference
A comprehensive guide to all widget types available for Infodeck dashboards, including configuration options and best use cases.
KPI Card
Display a single current value prominently.
Use Cases
- Current temperature reading
- Latest humidity level
- Real-time energy consumption
- Battery level indicator
Configuration
| Setting | Description | Example |
|---|---|---|
| Title | Widget header | "Server Room Temp" |
| Asset | Data source device | Temperature sensor |
| Property | Which reading to show | Temperature |
| Mode | Display style | Default, Compact |
Best Practices
- Use for critical metrics that need immediate visibility
- Place at top of dashboard for priority
- Use large size on NOC displays
Line Chart
Visualize data trends over time.
Use Cases
- Temperature trends over 24 hours
- Energy consumption patterns
- Humidity fluctuations
- Historical sensor readings
Configuration
| Setting | Description | Options |
|---|---|---|
| Title | Chart header | Any text |
| Asset | Data source | Select sensor |
| Property | Data series | Temperature, humidity, etc. |
| Time Range | Period to display | 24h, 7d, 30d, custom |
| Aggregation | Data grouping | None, Hourly, Daily |
Best Practices
- Use for identifying patterns and anomalies
- Set appropriate time range for the analysis need
- Enable data quality filtering for accurate trends
Combo Chart
Display multiple data series with independent scales.
Use Cases
- Temperature and humidity on same chart
- Energy (kWh) and cost ($) comparison
- Multiple sensor comparison
- Correlated metrics analysis
Configuration
| Setting | Description |
|---|---|
| Primary Series | Left Y-axis data (e.g., Temperature) |
| Secondary Series | Right Y-axis data (e.g., Humidity) |
| Primary Scale | Left axis range |
| Secondary Scale | Right axis range |
Best Practices
- Use when comparing metrics with different units
- Limit to 2-3 series for readability
- Choose contrasting colors for each series
Mini-Chart Card
Compact visualization combining current value with trend sparkline.
Use Cases
- Dashboard grids with many sensors
- Quick-glance overviews
- Space-constrained layouts
- Executive summary views
Configuration
| Setting | Description |
|---|---|
| Title | Short label |
| Asset | Data source |
| Property | Metric to display |
| Sparkline Range | Time period for mini trend |
Best Practices
- Use for dense displays with many sensors
- Group similar mini-charts together
- Ideal for tablet and mobile views
Data Combination (Device Overview)
Comprehensive view of all properties from a single device.
Use Cases
- Complete sensor overview
- Device health dashboard
- Multi-property monitoring
- Device diagnostic view
Configuration
| Setting | Description |
|---|---|
| Title | Widget header |
| Asset | Device to display |
| Mode Key | Display layout (default, detailed) |
Data Shown
- All sensor properties from the device
- Last update timestamp
- Connection status
- Signal quality (for IoT devices)
Best Practices
- Use when you need all data from one device
- One widget per critical device
- Useful for troubleshooting
Widget Type Comparison
| Widget | Data Points | Best For | Size |
|---|---|---|---|
| KPI Card | 1 current value | Quick status | Small-Medium |
| Line Chart | Time series | Trends | Medium-Large |
| Combo Chart | Multiple series | Correlation | Large |
| Mini-Chart Card | Value + sparkline | Dense grids | Small |
| Data Combination | All device data | Overview | Medium-Large |
Choosing the Right Widget
By Data Type
| Data Type | Recommended Widget |
|---|---|
| Single current value | KPI Card |
| Historical trend | Line Chart |
| Multiple correlated metrics | Combo Chart |
| Many sensors, quick view | Mini-Chart Card |
| All device properties | Data Combination |
By Dashboard Purpose
| Dashboard Type | Widget Mix |
|---|---|
| NOC Display | Large KPI Cards + Alert indicators |
| Executive Summary | Mini-Chart Cards in grid |
| Technical Analysis | Combo Charts + Line Charts |
| Device Diagnostic | Data Combination widgets |
| Compliance Report | Line Charts with time ranges |
By Screen Size
| Display | Recommended |
|---|---|
| Large wall display | Few large KPI Cards |
| Desktop monitor | Mix of medium widgets |
| Tablet | Mini-Chart Cards, compact layout |
| 4K display | Full dashboard, all widget types |
Real-World Dashboard Examples
Operations Center Dashboard
┌─────────────────────────────────────────────┐
│ ┌───────────┐ ┌───────────┐ ┌───────────┐ │
│ │ Server A │ │ Server B │ │ Server C │ │
│ │ 22°C │ │ 21°C │ │ 23°C │ │
│ │ KPI Card │ │ KPI Card │ │ KPI Card │ │
│ └───────────┘ └───────────┘ └───────────┘ │
│ ┌─────────────────────────────────────────┐ │
│ │ Temperature Trend (24h) │ │
│ │ Line Chart │ │
│ └─────────────────────────────────────────┘ │
│ ┌─────────────────────────────────────────┐ │
│ │ Temperature vs Humidity (Combo) │ │
│ │ Combo Chart │ │
│ └─────────────────────────────────────────┘ │
└─────────────────────────────────────────────┘
Air Quality Grid Dashboard
┌─────────────────────────────────────────────┐
│ ┌───────┐ ┌───────┐ ┌───────┐ ┌───────┐ │
│ │ F1 CO2│ │ F2 CO2│ │ F3 CO2│ │ F4 CO2│ │
│ │ ─▁▂▄▅ │ │ ─▁▁▂▂ │ │ ▂▂▃▄▅ │ │ ─▁▁▁▂ │ │
│ │ Mini │ │ Mini │ │ Mini │ │ Mini │ │
│ └───────┘ └───────┘ └───────┘ └───────┘ │
│ ┌───────┐ ┌───────┐ ┌───────┐ ┌───────┐ │
│ │F1 PM25│ │F2 PM25│ │F3 PM25│ │F4 PM25│ │
│ │ ▁▁▁▂▂ │ │ ▁▂▂▃▂ │ │ ▂▃▃▄▃ │ │ ▁▁▁▁▁ │ │
│ │ Mini │ │ Mini │ │ Mini │ │ Mini │ │
│ └───────┘ └───────┘ └───────┘ └───────┘ │
└─────────────────────────────────────────────┘
Widget Customization
Text and Icon Sizing
Adjust visual elements for different displays:
| Display Type | Text Size | Icon Size |
|---|---|---|
| Wall display | Extra Large | Large |
| Desktop | Medium | Medium |
| Tablet | Small | Small |
Color Coding
Use colors to indicate status:
| Color | Meaning |
|---|---|
| Green | Normal/Good |
| Yellow | Warning/Attention |
| Red | Critical/Alert |
| Blue | Information |
| Gray | Inactive/No Data |
Data Quality in Widgets
Widgets can filter data based on quality flags:
| Filter | Shows |
|---|---|
| All Data | Everything including flagged invalid |
| Valid Only | Excludes flagged bad data |
Compliance Dashboards
For compliance and reporting dashboards, always use Valid Only filter to ensure accuracy.
Troubleshooting Widgets
No Data Displayed
| Symptom | Cause | Solution |
|---|---|---|
| "No data" | Device offline | Check IoT Management |
| Empty chart | No data in time range | Expand time range |
| "--" value | Property not available | Check asset type |
Incorrect Data
| Symptom | Cause | Solution |
|---|---|---|
| Wrong units | Wrong property selected | Edit widget config |
| Old values | Auto-refresh disabled | Enable dashboard refresh |
| Spikes/gaps | Data quality issues | Enable quality filter |
Related Articles
Need help? Contact Infodeck Support
Was this page helpful?