Complete guide to all visualization widgets in Serial Studio. Choose the right widget to bring your data to life!

Serial Studio organizes widgets into two categories:

Container widgets that display data from an entire group (which contains multiple datasets).

Examples: Multiple Plots, Accelerometer, GPS Map

Individual visualizations for a single dataset within a group.

Examples: Plot, Bar, Gauge

When you create a project in the Project Editor, you:

1. Create Groups (containers for related data)
2. Add Datasets to each group (individual data points)
3. Choose Group Widget (how to display the whole group)
4. Choose Dataset Widget for each dataset (how to display individual values)

Group widgets visualize all datasets in a group together.

Description: Displays multiple line plots in a single widget, each with its own color and scale.

Best for:

• Time-series data from multiple sensors
• Comparing related measurements
• Continuous data streams

Configuration:

• Add datasets to the group
• Each dataset becomes a separate plot line
• Each line gets its own color automatically
• All plots share the same time axis

Requirements:

• Minimum datasets: 1
• Maximum datasets: Unlimited (practical limit ~20 for readability)
• Pro required: No

Example use cases:

• Multi-channel ADC readings (8 channels)
• Temperature, humidity, and pressure together
• Motor speed and current on same graph
• Multi-sensor environmental station

Tips:

• Use meaningful dataset titles (they become legend labels)
• Set appropriate min/max if you know the range
• Too many plots become hard to read - consider multiple groups

Screenshot: Multiple plot widget showing 3 sensor readings over time

Description: 3D visualization of X, Y, Z acceleration data with real-time device orientation display.

Best for:

• IMU/accelerometer sensors
• Tilt/orientation monitoring
• Motion detection
• Vibration analysis

Configuration:

• Requires exactly 3 datasets (X, Y, Z)
• Dataset 1: X-axis acceleration
• Dataset 2: Y-axis acceleration
• Dataset 3: Z-axis acceleration
• Units typically in m/s² or g

Requirements:

• Minimum datasets: 3
• Maximum datasets: 3
• Pro required: No
• OpenGL: Required for 3D visualization

Example use cases:

• MPU6050/MPU9250 accelerometer data
• Drone/quadcopter orientation
• Vehicle tilt monitoring
• Seismic activity detection

Tips:

• Calibrate your sensor (zero offset) for best results
• Typical Earth gravity: 9.81 m/s² or 1g on Z-axis
• Make sure axes are labeled correctly in your device code

Data format:

0.05, 0.12, 9.81    # Small X/Y movement, 1g on Z (device flat)
2.45, 3.21, 8.12    # Device tilted

Screenshot: 3D accelerometer visualization showing device orientation

Description: 3D visualization of rotational velocity around X, Y, Z axes.

Best for:

• Gyroscope data from IMU sensors
• Angular velocity monitoring
• Rotation rate analysis
• Combined with accelerometer for full IMU visualization

Configuration:

• Requires exactly 3 datasets (X, Y, Z)
• Dataset 1: X-axis rotation (roll rate)
• Dataset 2: Y-axis rotation (pitch rate)
• Dataset 3: Z-axis rotation (yaw rate)
• Units typically in °/s or rad/s

Requirements:

• Minimum datasets: 3
• Maximum datasets: 3
• Pro required: No
• OpenGL: Required for 3D visualization

Example use cases:

• MPU6050/MPU9250 gyroscope data
• Camera gimbal monitoring
• Spacecraft attitude control
• Robot arm motion

Tips:

• Gyroscope drift is normal - recalibrate periodically
• Zero values when stationary
• Combine with accelerometer widget for complete IMU dashboard

Data format:

0.0, 0.0, 0.0       # Device stationary
15.3, -8.2, 45.7    # Device rotating around all axes

Screenshot: 3D gyroscope visualization showing rotation rates

Description: Interactive map showing GPS position, path history, and optional altitude visualization.

Best for:

• GPS/GNSS data visualization
• Vehicle tracking
• Navigation monitoring
• Flight path recording

Configuration:

• Requires 2-3 datasets:
  • Dataset 1: Latitude (required)
  • Dataset 2: Longitude (required)
  • Dataset 3: Altitude (optional)
• Set dataset widgets to "lat", "lon", "alt"

Map Providers: Serial Studio supports multiple map tile providers:

1. OpenStreetMap (default, free)

   • No API key required
   • Good worldwide coverage

2. Thunderforest (requires API key)

   • Higher quality tiles
   • Different map styles
   • Get API key

3. MapTiler (requires API key)

   • High-quality maps
   • Custom styles
   • Get API key

Requirements:

• Minimum datasets: 2 (lat/lon)
• Maximum datasets: 3 (lat/lon/alt)
• Pro required: No
• Internet: Required for map tiles

Example use cases:

• Drone flight path tracking
• Vehicle telemetry
• CanSat competition telemetry
• Hiking GPS tracker
• Robot outdoor navigation

Coordinate format:

37.7749, -122.4194, 100.5    # San Francisco, 100.5m altitude

• Latitude: -90 to +90 (negative = South)
• Longitude: -180 to +180 (negative = West)
• Altitude: meters above sea level (optional)

Tips:

• GPS takes time to acquire fix (30-120 seconds typically)
• Indoor GPS often doesn't work
• First valid coordinate centers the map
• Path history shows your trail

Screenshot: GPS map showing flight path with markers

Description: Displays heading/bearing as a compass rose with cardinal directions.

Best for:

• Heading/bearing data
• Magnetometer readings
• Navigation displays
• Directional indicators

Configuration:

• Requires exactly 1 dataset
• Value should be 0-360 degrees
• 0° = North, 90° = East, 180° = South, 270° = West

Requirements:

• Minimum datasets: 1
• Maximum datasets: 1
• Pro required: No

Example use cases:

• Magnetometer heading display
• Vehicle compass
• Drone heading indicator
• Robot navigation direction

Data format:

0       # North
90      # East
180     # South
270     # West
45      # Northeast

Tips:

• Magnetometer requires calibration (figure-8 motion)
• Magnetic declination differs by location
• Metal objects nearby affect readings

Screenshot: Compass widget showing NE heading

Description: Tabular display of all datasets in a group, showing titles, values, and units in a clean grid format.

Best for:

• Text and numeric readouts
• Status displays
• Configuration parameters
• When you need exact values, not graphs

Configuration:

• Add any number of datasets to group
• Each dataset appears as a row: Title | Value | Units
• Automatically updates in real-time

Requirements:

• Minimum datasets: 1
• Maximum datasets: Unlimited
• Pro required: No

Example use cases:

• System status dashboard (CPU temp, voltage, uptime)
• Configuration readout
• Multi-parameter monitoring (when graphs aren't needed)
• Text-based sensor data

Display format:

Temperature    |  22.5  | °C
Humidity       |  60    | %
Pressure       |  1013  | hPa
Status         |  OK    |

Tips:

• Great for dashboards combining numbers and text
• Use clear, descriptive titles
• Add units for clarity

Screenshot: Data grid showing multiple sensor readings

Description: Visual indicator panel using colored LEDs that change based on dataset values.

Best for:

• Boolean/binary status indicators
• Alarm states
• Multi-state displays
• On/off indicators

Configuration:

• Add datasets to group
• Each dataset becomes an LED
• LED color changes based on value and configured thresholds
• Supports custom color mapping

Requirements:

• Minimum datasets: 1
• Maximum datasets: Unlimited
• Pro required: No

Example use cases:

• System health indicators (green=ok, yellow=warning, red=critical)
• Alarm panel
• On/off states for multiple outputs
• Multi-sensor status board

Typical configuration:

Dataset 1 "Motor 1": 0=OFF (gray), 1=ON (green)
Dataset 2 "Motor 2": 0=OFF (gray), 1=ON (green)
Dataset 3 "Alarm": 0=OK (green), 1=ALERT (red)

Tips:

• Use meaningful titles (they label each LED)
• Consider color-blind friendly colors
• Great for quickly scanning system status

Screenshot: LED panel with multiple status indicators

Description: Real-time 3D scatter or line plot for visualizing X, Y, Z coordinates in 3D space.

Best for:

• 3D trajectories
• Spatial data visualization
• Complex mathematical visualizations
• Particle simulations

Configuration:

• Requires exactly 3 datasets (X, Y, Z)
• Dataset 1: X coordinate
• Dataset 2: Y coordinate
• Dataset 3: Z coordinate
• Can display as points or connected line

Requirements:

• Minimum datasets: 3
• Maximum datasets: 3
• Pro required: Yes
• OpenGL: Required

Example use cases:

• Lorenz attractor visualization
• 3D orbital mechanics
• Particle trajectory tracking
• Magnetic field visualization

Data format:

1.5, 2.3, -0.8      # Point at (1.5, 2.3, -0.8)
1.6, 2.4, -0.9      # Next point

Tips:

• Works best with continuous, smooth data
• Can rotate/zoom the 3D view
• Great for demonstrating chaos theory (Lorenz attractor example)

Screenshot: 3D plot showing Lorenz attractor

Description: 2D scatter plot displaying Y values against X values (instead of time).

Best for:

• Correlation analysis
• Phase plots
• Lissajous curves
• I-V characteristic curves
• Control system analysis

Configuration:

• Requires exactly 2 datasets
• Dataset 1: X values
• Dataset 2: Y values
• Plots (X, Y) coordinates

Requirements:

• Minimum datasets: 2
• Maximum datasets: 2
• Pro required: Yes

Example use cases:

• I-V curves (current vs voltage)
• Control system phase portraits
• Lissajous patterns from two oscillators
• Pressure-volume diagrams
• Signal correlation analysis

Data format:

1.5, 2.8     # Point at X=1.5, Y=2.8
2.0, 3.1     # Point at X=2.0, Y=3.1

Tips:

• Different from normal plots (which plot Y vs time)
• Useful for finding correlations between two variables
• Phase portraits reveal system behavior

Screenshot: XY plot showing phase portrait

Dataset widgets determine how individual values within a group are displayed.

Description: Standard line plot showing value over time.

Best for: Time-series data, continuous values, trending

Configuration:

• Automatically plots value vs time
• Can set min/max range
• Auto-scales if range not set

Example: Temperature readings over time, ADC values

Description: Fast Fourier Transform - displays frequency spectrum of incoming data in real-time.

Best for:

• Audio signals
• Vibration analysis
• Periodic waveforms
• Finding dominant frequencies

Configuration:

• Automatically performs FFT on incoming data
• Shows frequency on X-axis, magnitude on Y-axis
• Configurable FFT size (larger = better frequency resolution, slower updates)

Example use cases:

• Audio frequency analysis
• Detecting vibration frequencies in machinery
• Finding resonance peaks
• Signal processing

Tips:

• Input should be continuous waveform data
• Higher sample rates → higher frequency range
• Requires steady stream of data

Description: Horizontal bar indicator with minimum and maximum range.

Best for:

• Bounded values (0-100%, 0-255, etc.)
• Visual progress indicators
• Level displays
• When you want to see value relative to range

Configuration:

• Set min value (e.g., 0)
• Set max value (e.g., 100)
• Bar fills from left to right

Example: Battery percentage (0-100%), servo position (0-180°), CPU usage

Description: Circular gauge with needle pointer, like a speedometer.

Best for:

• Speed, RPM, pressure readings
• Analog-style displays
• Dashboard aesthetics
• Bounded values that benefit from circular visualization

Configuration:

• Set min value for gauge start
• Set max value for gauge end
• Needle points to current value

Example: RPM (0-10000), speed (0-200 km/h), temperature (0-100°C)

Tips:

• Choose min/max that cover expected range
• Gauge looks best when value stays within range

Description: Vertical level indicator, like a thermometer or bar graph.

Best for:

• Fluid levels
• Signal strength
• Vertical bar displays
• Fill level visualization

Configuration:

• Set min and max values
• Fills from bottom to top

Example: Tank level, audio level meter, signal strength

Description: When used as a dataset widget, displays heading value.

Note: Usually you'll use the Compass group widget instead, which provides better visualization.

Different widgets have different performance characteristics:

Tips:

• Serial Studio targets 60 FPS dashboard rendering
• Higher data rates don't always improve visualization
• For logging: high rate OK, dashboard will sample it

Multiple Plots:

• Tested with 100+ simultaneous plots
• Practical limit: ~20 plots for readability
• More plots = more memory and CPU

Plot History:

• Default: Shows last few seconds
• Longer history = more memory
• Reduce history length if experiencing slowdowns

3D Widgets:

• Require OpenGL-capable graphics
• More GPU-intensive than 2D widgets
• Best at 30 FPS or below

Group 1: "Environmental Sensors"
├─ Dataset 1: Temperature → Plot + Gauge
├─ Dataset 2: Humidity → Plot + Bar
├─ Dataset 3: Pressure → Plot + Gauge
└─ Group Widget: Multiple Plots

Alternative: Data Grid for numeric readouts

Group 1: "Position"
├─ Latitude → lat
├─ Longitude → lon
├─ Altitude → alt
└─ Widget: GPS Map

Group 2: "Attitude"
├─ Accel X → x
├─ Accel Y → y
├─ Accel Z → z
└─ Widget: Accelerometer

Group 3: "Orientation"
├─ Gyro X → x
├─ Gyro Y → y
├─ Gyro Z → z
└─ Widget: Gyroscope

Group 4: "Telemetry"
├─ Battery → Plot + Bar
├─ Altitude → Plot
├─ Speed → Plot + Gauge
└─ Widget: Multiple Plots

Group 5: "Navigation"
├─ Heading → compass
└─ Widget: Compass

Group 1: "Process Variables"
├─ Tank Level → Plot + Bar
├─ Flow Rate → Plot + Gauge
├─ Temperature → Plot + Gauge
├─ Pressure → Plot + Gauge
└─ Widget: Multiple Plots

Group 2: "Status"
├─ Pump 1 Running → LED (0=off, 1=on)
├─ Pump 2 Running → LED (0=off, 1=on)
├─ Valve State → LED
├─ Alarm Status → LED
└─ Widget: LED Panel

Group 3: "Readings"
├─ Current Reading → value
├─ Setpoint → value
├─ Mode → value
└─ Widget: Data Grid

Some widgets require OpenGL support:

• Accelerometer (3D visualization)
• Gyroscope (3D visualization)
• 3D Plot (Pro)

If OpenGL is not available:

• These widgets will show a 2D fallback or error message
• Update graphics drivers
• Check virtual machine settings (VMs often don't support OpenGL)

GPS Map widget requires internet connection to download map tiles.

Offline operation:

• Map tiles are cached
• Previously viewed areas work offline
• New areas won't load without internet

These widgets require Serial Studio Pro:

• 3D Plot (group)
• XY Plot (group)

Learn about Pro features

❌ "T1", "T2", "T3"
✅ "Ambient Temp (°C)", "Engine Temp (°C)", "Exhaust Temp (°C)"

For temperature sensor (0-50°C):
✅ Set min=0, max=50 for gauges/bars
❌ Leave auto-scale (wastes range on impossible values)

✅ "Speed" with units "km/h"
✅ "Temperature" with units "°C"
❌ Just "Speed" (ambiguous)

✅ Group: "IMU" with accel X, Y, Z
❌ Separate groups for each axis

Want to see trends? → Use Plot
Want current value? → Use Gauge or Data Grid
Want to compare to max? → Use Bar
Want frequency content? → Use FFT Plot

✅ 3-5 groups with clear purpose
❌ 20+ groups with scattered data

• Project Editor - How to configure widgets in your project
• Operation Modes - Different dashboard modes
• Data Flow - How data reaches widgets
• Examples Repository - Real-world widget configurations
• Pro vs Free Features - Compare Pro and free widgets

• Widget not working? Check Troubleshooting Guide
• Choosing widgets? Ask on GitHub Discussions
• Want examples? See Examples Repository

Happy visualizing! 📊