Statussen, kleuren en skins

Dashboards bouwen met shinydashboard

Png Kee Seng

Researcher

Een restaurant verfraaien

Het dashboard aanpassen is als een restaurant verfraaien
Men zegt: we eten eerst met onze ogen
Een aantrekkelijker dashboard verbetert de gebruikerservaring
Laten we focussen op het veranderen van kleuren van enkele elementen

Een verfraaid restaurant met aantrekkelijk eten.

¹ Afbeelding door Freepik

Statussen in shinydashboard

Sommige shinydashboard-objecten hebben een status-eigenschap
Deze kun je instellen met het argument status
```
<object>(status = <status>, ...)
```

Statussen in een shinydashboard

Statussen in notificationItems

Laten we twee notificaties aan de header toevoegen
- Zet buy alert als success-bericht
- Zet sell alert als danger-bericht
Standaardstatus voor notificationItem() is "success"

Success- en danger-statussen voor notificationItem.

header <- dashboardHeader(
  ...
  dropdownMenu(type = "notifications",

       notificationItem("Sell alert",

       status = "danger"

       ),

       notificationItem("Buy alert",

       status = "success"

       )

))
...

Statussen in boxes

status leeg laten geeft een ongekleurde box
Zet status op "info"
Stel de titel in
Zet solidHeader = TRUE

...
body <- dashboardBody(...,
        box("Stock name",

        title="Stock name title",

        width = 6,

        status = "info",

        solidHeader = TRUE)),

...

Box met info-status.

Box met info-status en titel.

Box met info-status, titel en effen header.

Kleur toevoegen aan shinydashboard

In sommige shinydashboard-objecten kun je color zetten
Stel dat de close-prijs sinds gisteren 2% daalde
- Render valueBox() rood om Sally te waarschuwen

We kunnen een valueBox() kleuren.

...
body <- dashboardBody(...,

    valueBox("Close (%)", 
            "-2%", 
            width = 2,

            color = "red"

            ),

    ...)
...

Meer kleuren

Beschikbare kleuren in shinydashboard:

Beschikbare kleuren in shinydashboard.

Check statussen en kleuren met ?validStatuses en ?validColors

Skins in een shinydashboard

shinydashboard heeft vooraf gedefinieerde skins
Pas ze toe via het argument skin in dashboardPage()

dashboardPage(skin = <color>)

Dit zijn de mogelijke kleuren

"blue" (standaard)
"black"
"purple"
"green"
"red"
"yellow"

Verschillende skins proberen

Zet de kleur op paars om dit te proberen
Zet de kleur op zwart om verschillen te zien

ui <- dashboardPage(skin = "purple",
                    header, sidebar, body)

ui <- dashboardPage(skin = "black",
                    header, sidebar, body)

Paarse skin.

Zwarte skin

Laten we oefenen!

Dashboards bouwen met shinydashboard