🥳
PowerShell Universal
Ironman SoftwareForums
v3
v3
  • About
  • What's New in v3?
  • Get Started
  • Additional Resources
  • Installation
    • Docker
    • Upgrading
    • Uninstall
  • Licensing
  • System Requirements
  • Supported Browsers
  • Cmdlet Help
  • Modules
  • API
    • About
    • Endpoints
    • Security
    • Error Handling
    • Rate Limiting
  • Automation
    • About Automation
    • Scripts
      • Parameters
    • Jobs
    • Schedules
    • System Events
    • Terminals
    • Triggers
    • Queues
  • User Interfaces
    • About
    • Dashboards
      • Dashboards
      • Examples
      • Components
        • Pages
        • Dynamic Regions
        • Element
        • Error Boundary
        • HTML
        • Custom Components
          • Building Custom JavaScript Components
        • Data Display
          • Alert
          • Badge
          • Chip
          • Data Grid
          • Date and Time
          • Icon
          • List
          • Markdown
          • Table
          • Timeline
          • Tooltip
          • Tree View
          • Typography
        • Data Visualization
          • Charts
          • Image
          • Map
        • Feedback
          • Backdrop
          • Modal
          • Progress
          • Skeleton
        • Inputs
          • Autocomplete
          • Button
          • Checkbox
          • Code Editor
          • Date Picker
          • Editor
          • Floating Action Button
          • Form
          • Radio
          • Rating
          • Select
          • Slider
          • Switch
          • Textbox
          • Time Picker
          • Transfer List
          • Upload
        • Navigation
          • Drawer
          • Link
          • Menu
          • Stepper
          • Tabs
        • Layout
          • Grid Layout
          • Grid
          • Hidden
          • Stack
        • Utilities
          • Protect Section
          • Transitions
        • Surfaces
          • AppBar
          • Card
          • Paper
          • Expansion Panel
      • Interaction
      • Marketplace
      • Role Based Access
      • Scheduled Endpoints
      • Sessions
      • Themes
        • Cascading Style Sheets
        • Styles
      • Custom Variable Scopes
      • Migrating From Universal Dashboard 2.9
    • Pages
      • Alerts
      • Bar Chart
      • Button
      • Card
      • Form
      • iFrame
      • Image
      • Line Chart
      • Liquid Chart
      • Paragraph
      • Statistic
      • Table
      • Variables
  • Desktop
    • About Desktop Mode
    • File Associations
    • Hotkeys
    • Pages
    • Protocol Handlers
  • Platform
    • Cache
    • Modules
    • Monitoring
    • Notifications
    • Published Folders
    • Templates
    • Translations
    • User Sessions
    • Variables
  • Configuration
    • About
    • API
    • Command Line Options
    • Environments
    • Feature Flags
    • Git
    • Hosting
      • Azure
      • High Availability
      • IIS
    • Login Page
    • Management API
    • Persistence
    • App Settings
    • Security
      • Best Practices
      • Access Controls
      • App Tokens
      • Client Certificate
      • OpenID Connect
      • PowerShell Protect
      • SAML2
      • WS-Federation
    • Repository
    • Running as a Service Account
    • Best Practices
  • Development
    • Debugging Scripts
    • Editor
    • Hangfire
    • Logging
    • Profiling
    • Visual Studio Code Extension
  • Changelog
  • Extension Changelog
  • Legacy Universal Dashboard Docs
Powered by GitBook

Copyright 2025 Ironman Software

On this page
  • About
  • Display Data from an API
  • Display Data from a Script
  • Properties
Edit on GitHub
Export as PDF
  1. User Interfaces
  2. Pages

Bar Chart

A bar chart that can display output from scripts and APIs.

About

Bar charts can retrieve output from scripts and APIs to display the data in a chart.

Display Data from an API

You will need to return an array of JSON objects from your API in order to use a bar chart. An example would be returning a list of hashtables serialized to JSON.

@(
    @{
        Name = "Name1"
        Value = Get-Random
    }
    @{
        Name = "Name2"
        Value = Get-Random
    }
    @{
        Name = "Name3"
        Value = Get-Random
    }
) | ConvertTo-Json 

In this example, you would configure the data source to an API and select your API endpoint. You would then specify Name as the Y axis and Value as the X axis.

The resulting chart contains the data from the API. Each time the page is loaded, the API is called.

Display Data from a Script

You will need to return PSCustomObjects, objects or hashtables from your script in order to display a chart from a script.


@(
    @{
        Name = "Name1"
        Value = Get-Random
    }
    @{
        Name = "Name2"
        Value = Get-Random
    }
    @{
        Name = "Name3"
        Value = Get-Random
    }
)

You will need to set the data source to script and select the script you want to retrieve data for.

You will need to set the Y and X axis to the properties of the object returned from the script.

The chart will appear on the page like this. Loading the page will not call the script again. It will load the result of the last time the script ran.

Properties

Property

Description

Available Since

Id

The ID of this component

2.2.0

X Axis Field

The field to use as the X Axis for data within the chart.

2.2.0

Y Axis Field

The field to use as the Y Axis for data within the chart.

2.2.0

Data Source Type

Whether to use a script or API as a data source.

2.2.0

Data Source

The script or API to use as data for the chart.

2.2.0

Color

The bar color to use for the chart.

2.2.0

Scrollbar

Whether to display a scrollbar when there are many items in the chart.

2.2.0

PreviousAlertsNextButton

Last updated 3 years ago