The Polar Chart Widget Node is a circular visualization used to display directional data, such as wind, movement, or heading-based metrics. It supports directional segmentation (e.g., N, NE, E...) and overlays values based on magnitude.
What Is a Polar Chart?
A Polar Chart visualizes values across 360 degrees of direction. It divides the circular axis into sectors (e.g., North, East, South), plots values based on directional JSON keys, and optionally displays them over a map. This chart is especially useful in IoT for representing orientation or directional activity such as wind direction, antenna signal strength, or motion tracking.
Step-by-Step: How to Configure the Polar Chart Widget Node
-
Add the widget
-
Drag the Polar Chart Widget Node from the Visualizations panel to the canvas.
-
-
Connect the widget to the data source
-
Link the widget to the upstream workflow node that outputs both:
-
the numeric value to plot
-
the direction value (0–360°)
-
-
These fields must match the JSON Key to Display and JSON Key for Direction.
-
-
Open configuration
-
Double-click the widget to open the configuration panel.
-
General Settings
| Field | Requirement | Description |
|---|---|---|
| Widget Name* | Required | Title for the widget. |
| Widget Subtitle | Optional | Context shown beneath the main title. |
| Widget Header | Optional | Show/hide the header bar. |
| Show UID / Label Name | Optional | Show the associated device ID or label name. |
Data Settings
| Field | Requirement | Description |
|---|---|---|
| Polar Chart Type | Optional | Set to Regular (or other modes if supported). |
| JSON Key to Display* | Required | Field for the numeric value to be shown. |
| JSON Key for Direction (0–360)* | Required | Field that defines the direction in degrees. |
| Calculation Interval* | Required | Time range for aggregating values (e.g., 5). |
| Time Units* | Required | Time unit (e.g., Minutes, Hours). |
| Refresh Interval (seconds) | Optional | Widget refresh frequency (default: 60 seconds). |
| Decimal Places | Optional | Number of decimal points for values. |
| Unit Symbol | Optional | Add unit (e.g., °, m/s, %). |
Sector Configuration
| Field | Requirement | Description |
|---|---|---|
| Sector Markers | Optional | Choose number of sectors (e.g., 8 for N, NE, E...). |
| Orient Left Side of First Sector to 0° | Optional | Sets origin of chart at left (vs. top). |
Series Range Styling
| Field | Requirement | Description |
|---|---|---|
| Range Min Value | Optional | Lower bound of a value range. |
| Range Max Value | Optional | Upper bound of a value range. |
| Hex Color | Optional | Fill color for the range. |
Add multiple ranges to visually distinguish value bands (e.g., low/medium/high intensity).
Map Overlay Settings
| Field | Requirement | Description |
|---|---|---|
| Show Map Background | Optional | Enable a geographic map overlay behind the polar chart. |
| Default Latitude | Optional | Default location if lat/lon keys aren't provided. |
| Default Longitude | Optional | Same as above. |
| Latitude JSON Key | Optional | Use incoming data to position chart dynamically. |
| Longitude JSON Key | Optional | Use incoming data to position chart dynamically. |
| Map Zoom Level (0–22) | Optional | Controls zoom for map background. |
| Map Type | Optional | Choose map visualization type (e.g., terrain, satellite). |
Tooltip & Interface Settings
| Field | Requirement | Description |
|---|---|---|
| Enable Tooltip | Optional | Show value/direction info when hovering. |
| Tooltip Text | Optional | Custom message inside tooltip. |
| Add to Interface* | Required | Choose one or more interfaces to display this widget on. |
Grouping & Display
| Field | Requirement | Description |
|---|---|---|
| Select Label | Required (if grouped) | Filter/group by device label. |
| Grouped Display Mode | Optional | Choose: - No Grouping - Group by Label Value - Group by Label Name |
| Number of Widgets to Display | Optional | Set maximum count of grouped charts to render. |
Use Cases
-
Visualize wind direction and strength over time
-
Show movement orientation or angle of rotation
-
Track heading of vehicles or machinery
-
Display sensor signal intensity by direction
Best Practices
-
Match 0–360 directional data carefully to the correct field
-
Use 8 sector markers for intuitive N/NE/E-style visualization
-
Enable the map if tracking moving devices or physical orientation
-
Add series ranges for threshold coloring (e.g., red zone above 75)
-
Use tooltip to provide instant directional insights
Frequently Asked Questions (FAQ)
Q: Can the chart rotate based on direction?
A: Yes, it maps values to directional segments based on the JSON key (0–360°).
Q: Can I use this for geospatial data?
A: Yes, especially with map overlay and latitude/longitude keys.
Q: How does range coloring work?
A: Define min/max values and assign a color. The chart highlights segments whose value falls within the specified band.