New-UDChartJS - Tick Configuration Error

Product: PowerShell Universal
Version: 4.2.18

I have a line chart and the X axis has 60 ticks. One for every minute in the hour. I’d like to control the tick labels to only show every 5th minute.

Is the callback option supported yet? Receiving an “Error Render Component (ud-chartjs)”

Most likely doing something wrong here, but I found a post from 2019 indicating the callback feature is not working.

    New-UDDynamic -Content {  
      $Data = (Invoke-SQLCMD -ServerInstance $AzSQLServer -Database $AzDatabase -AccessToken $AzSQLToken -Query "select * FROM TableName") | Sort Date
      $AddOptions = @{
        fill = $true 
        tension = 0.4
      }
      $800Callers = New-UDChartJSDataset -DataProperty Cur800Calls -Label 'Toll Free Calls' -BackgroundColor '#126f8c' -AdditionalOptions $AddOptions
      $Non800Callers = New-UDChartJSDataset -DataProperty CurNon800Calls -Label 'Other Calls' -BackgroundColor '#8da322' -AdditionalOptions $AddOptions

        $Options = @{
          Type = 'line'
          Data = $Data
          Dataset = @($Non800Callers, $800Callers)
          LabelProperty = "Time"
          Options = @{
            scales = @{
              y = @{
                beginAtZero = 'true'
              }
              x = @{
                ticks = @{
                  callback = {
                    param($val, $index)
                    if ($index % 5 -eq 0){
                      return $data.labels[$val]
                    } else {
                      return ''
                    }
                  }
                }
              }
            }
          }
        }
      New-UDChartJS @Options
    } -AutoRefresh -AutoRefreshInterval 60

The callback option won’t work. We currently don’t have a great way of defining custom JavaScript\PowerShell functions to the UDChart options. You’re getting the error because it’s likely serializing the PS ScriptBlock to JSON and causing some wacky problem.

We accept feature requests here if you’d like to make a request.

1 Like