UniversalDashboard/UniversalDashboard.Community/poshud/pages/charts/nivo.ps1

New-ComponentPage -Title 'Nivo' -Description 'Nivo chart library' -Content {
    New-Example -Title 'Colors' -Description 'Nivo comes with numerous color palettes out of the box. You can select one of the color palettes by name using the -Colors property.' -Example {
        $Data = @(
            @{
                country = 'USA'
                burgers = (Get-Random -Minimum 10 -Maximum 100)
                fries = (Get-Random -Minimum 10 -Maximum 100)
                sandwich = (Get-Random -Minimum 10 -Maximum 100)
            }
            @{
                country = 'Germany'
                burgers = (Get-Random -Minimum 10 -Maximum 100)
                fries = (Get-Random -Minimum 10 -Maximum 100)
                sandwich = (Get-Random -Minimum 10 -Maximum 100)
            }
            @{
                country = 'Japan'
                burgers = (Get-Random -Minimum 10 -Maximum 100)
                fries = (Get-Random -Minimum 10 -Maximum 100)
                sandwich = (Get-Random -Minimum 10 -Maximum 100)
            }
        )
        New-UDNivoChart -Colors 'dark2' -Bar -Data $Data -Height 400 -Width 900 -Keys @('burgers', 'fries', 'sandwich')  -IndexBy 'country'
    }

    New-Example -Title 'Auto Refresh' -Description 'Nivo charts support auto refresh through the New-UDDyanmic cmdlet.' -Example {
        New-UDDynamic -Content {
            $Data = 1..10 | ForEach-Object { 
                $item = Get-Random -Max 1000 
                [PSCustomObject]@{
                    Name = "Test$item"
                    Value = $item
                }
            }
            New-UDNivoChart -Id 'autoRefreshingNivoBar' -Bar -Keys "Value" -IndexBy 'name' -Data $Data -Height 500 -Width 1000
        } -AutoRefresh
    }

    New-Example -Title 'Patterns' -Description 'You can also define patterns to use with your charts. You can use lines, dots or squares to provide extra emphasis to particular vectors of a series.' -Example {
        $Data = @(
            @{
                country = 'USA'
                burgers = (Get-Random -Minimum 10 -Maximum 100)
                fries = (Get-Random -Minimum 10 -Maximum 100)
                sandwich = (Get-Random -Minimum 10 -Maximum 100)
            }
            @{
                country = 'Germany'
                burgers = (Get-Random -Minimum 10 -Maximum 100)
                fries = (Get-Random -Minimum 10 -Maximum 100)
                sandwich = (Get-Random -Minimum 10 -Maximum 100)
            }
            @{
                country = 'Japan'
                burgers = (Get-Random -Minimum 10 -Maximum 100)
                fries = (Get-Random -Minimum 10 -Maximum 100)
                sandwich = (Get-Random -Minimum 10 -Maximum 100)
            }
        )
        
        $Pattern = New-UDNivoPattern -Dots -Id 'dots' -Background "inherit" -Color "#38bcb2" -Size 4 -Padding 1 -Stagger
        $Fill = New-UDNivoFill -ElementId "fries" -PatternId 'dots'
        
        New-UDNivoChart -Definitions $Pattern -Fill $Fill -Bar -Data $Data -Height 400 -Width 900 -Keys @('burgers', 'fries', 'sandwich')  -IndexBy 'country'
    }

    New-Example -Title 'Interactive Charts' -Description 'Nivo charts support OnClick event handlers. You can provide a script block to the -OnClick parameter of New-UDNivoChart to create an event handler. When a user clicks the chart, your script block will be invoked and the $EventData property will be populated with the JSON from the Nivo chart. The event data contains the data point as well as positional information.' -Example {
        $Data = @(
            @{
                country = 'USA'
                burgers = (Get-Random -Minimum 10 -Maximum 100)
                fries = (Get-Random -Minimum 10 -Maximum 100)
                sandwich = (Get-Random -Minimum 10 -Maximum 100)
            }
            @{
                country = 'Germany'
                burgers = (Get-Random -Minimum 10 -Maximum 100)
                fries = (Get-Random -Minimum 10 -Maximum 100)
                sandwich = (Get-Random -Minimum 10 -Maximum 100)
            }
            @{
                country = 'Japan'
                burgers = (Get-Random -Minimum 10 -Maximum 100)
                fries = (Get-Random -Minimum 10 -Maximum 100)
                sandwich = (Get-Random -Minimum 10 -Maximum 100)
            }
        )
        New-UDNivoChart -Bar -Data $Data -Height 400 -Width 900 -Keys @('burgers', 'fries', 'sandwich')  -IndexBy 'country' -OnClick {
            Show-UDToast -Message $EventData -Position topLeft
        }
    }

} -Cmdlet @("New-UDNivoChart") -Enterprise