Show Gauges next to each other

#1

Hi

I am still new to Powershell Universal, but I have a small site setup.
I have grabbed some counters from a few servers and this show correctly using the component UniversalDashboard.UDGaugeChart.
In my dashboard the Gauges always show underneath each other, is there a way so they show in a line?

I am running the following after getting my counters

Foreach ($CPU in $CPUresult) {
$CPU.logical = $CPU.logical -as [int]
New-UDHeading -Text $Hostname -Size 3
New-UDGaugeChart -Id “GoogleGauge” -Height 100 -Width 240 -Data {
New-UDGaugeData -Label “CPU” -Value ($CPU.logical)
}

Many thanks
Darren

#2

Yes! I’d recommend setting up 3 columns and putting each gauge in its own column on the same row

#3

Hi

Yes I tried that but it fails, or rather does not do anything… but I have it within the foreach, so not sure if this breaks it…

Thanks

#4

Can you share the code you used to make the columns?

#5

Hi

My Dashboard is made up of the following which may be the issue, as I really am still novice in this…

The following works and gives three boxes along the top and then one box below where the gaugues work but are all underneath each other

New-UDGrid -Container -Content {
New-UDGrid -Item -ExtraSmallSize 3 -Content {
New-UDPaper -Content {
New-UDElement -Tag ‘pre’ -Content {
#<…code…>
}
} -Elevation 2
}

New-UDGrid -Container -Content {
New-UDGrid -Item -ExtraSmallSize 4 -Content {
New-UDPaper -Content {
New-UDElement -Tag ‘pre’ -Content {
#<…code…>
}
} -Elevation 2
}

New-UDGrid -Container -Content {
New-UDGrid -Item -ExtraSmallSize 3 -Content {
New-UDPaper -Content {
New-UDElement -Tag ‘pre’ -Content {
#<…code…>
}
} -Elevation 2
}

New-UDGrid -Container -Content {
New-UDGrid -Item -ExtraSmallSize 12 -Content {
New-UDPaper -Content {
New-UDElement -Tag ‘pre’ -Content {

#This is where I want the Gauges
#This is the Code

Foreach ($VCPU in $VCPUresult) {
$VCPU.logical = $VCPU.logical -as [int]
New-UDHeading -Text $HyperVCPU.Hostname -Size 3
New-UDGaugeChart -Id “GoogleGauge” -Height 100 -Width 240 -Data {
New-UDGaugeData -Label “CPU” -Value ($HyperVCPU.logical)
}

}
} -Elevation 2
}

}

So I tried the following under the foreach code

New-UDGrid -Item -ExtraSmallSize 12 -Content {
New-UDPaper -Content {
New-UDElement -Tag ‘pre’ -Content {

#This is where I want the Gauges
#This is the Code

Foreach ($CPU in $CPUresult) {
New-UDRow -Columns {
New-UDColumn -SmallSize 12 -Content {
$CPU.logical = $CPU.logical -as [int]
New-UDHeading -Text $CPU.Hostname -Size 3
New-UDGaugeChart -Id “GoogleGauge” -Height 100 -Width 240 -Data {
New-UDGaugeData -Label “CPU” -Value ($CPU.logical)
}
}
}
}
} -Elevation 2
}

But this has no effect

Thanks

#6

Totally forgot I cooked up this badboy component, I am happy to do a brief demo of how to get it side-by-side. Although just having a quick butchers at the code you done, I think you should have a read on the differences between CONTENT script blocks and ENDPOINT script blocks.
I mean the demo on the marketplace Universal Dashboard Marketplace - UniversalDashboard.UDGaugeChart does give you a demonstration of using this. As you can see I put it in a ENDPOINT so it updates every 5 seconds
I did a blog here on the differences Content vs Endpoint | Powershell Blog
Is it essential you pass the data via a foreach block?

I am going to upgrade to powershell universal and will make sure I make this my first page to create ok :smiley:

#7

Hi

Thanks for the comments, I did think about an endpoint but the thing that stopped me, and this was my wrong understanding, but I read that an endpoint runs under the credential that you run the services as, and I want to be able to run different script blocks using different credentials, saved as a secret variable, and didnt think an endpoint would work this way, now I have tested and understand this better.

I dont need to run a foreach but as I used an invoke-command to go and get the stats for several servers though one invoke command, running at the same time I thought would be quicker and then using a foreach to give each gauge a variable. I did realise that this at the minute would not auto refresh.
I have just done my page without the foreach and also using the endpoint and I can see this is a better way to do it as the page loads quicker and also refreshes.

Thanks I now have a better understanding and also think that now using New-UDGrid with New-UDElement, I have already have them side by side.

Thanks a lot for pointing me in the right direction !!!

1 Like