Ajout d'un Logo d'entreprise à L'en-tête ShinyDashboard

Donc, juste par curiosité, est-il possible d'ajouter un logo d'entreprise à la tête d'un ShinyDashboard? Comme je suis en train de regarder les documentation, il décrit le changement du "logo" dans le CSS, Il s'agit juste de configurer ce qui va dans le coin supérieur gauche bien que pour autant que je peux dire et je voudrais garder mon titre là.

Je n'utilise pas les menus déroulants et j'aimerais donc ajouter le logo de mon entreprise en haut à droite de la boîte rouge être.

enter image description here

quelqu'un a-t-il une idée de la façon dont cela peut être fait avec Shinydashboard? Grâce.

20
demandé sur decal 2015-07-15 23:36:52

2 réponses

j'ai travaillé un peu un hack pour cela, (et je sais que vous ne le demandez pas, mais voici un logo cliquable pendant que nous y sommes):

library(shiny)
library(shinydashboard)

dbHeader <- dashboardHeader()
dbHeader$children[[2]]$children <-  tags$a(href='http://mycompanyishere.com',
                                           tags$img(src='logo.png',height='60',width='200'))

dashboardPage(
       dbHeader,
       dashboardSidebar(),
       dashboardBody()
)

donc ceci niche un brillant.balise à l'intérieur de l'en-tête. La deuxième fente dans cet objet brillant particulier est la fente de logo (vous aurez besoin d'un 'logo.png' dans votre /www/ dossier dans le répertoire app)

EDIT:

je viens de vérifier, et à partir de maintenant, ce hack n'est plus nécessaire, vous pouvez insérer le code html directement de la fonction dashboardHeader via title= paramètre, (Avant, que le paramètre de l'application de texte seulement)

je pense que la réponse pourrait encore être utile comme une méthode pour modifier les brillantes fonctions où les choses codé en dur dans le si.

Voici la méthode:

dashboardPage(
    dashboardHeader(title = tags$a(href='http://mycompanyishere.com',
                                    tags$img(src='logo.png')))

ou, en ajoutant un peu plus de magie pour le logo (j'utilise aussi mon logo comme une barre de chargement):

# Takes a location 'href', an image location 'src', a loading gif 'loadingsrc'
# height, width and alt text, and produces a loading logo that activates while
# Shiny is busy
loadingLogo <- function(href, src, loadingsrc, height = NULL, width = NULL, alt = NULL) {
  tagList(
    tags$head(
      tags$script(
        "setInterval(function(){
                     if ($('html').attr('class')=='shiny-busy') {
                     $('div.busy').show();
                     $('div.notbusy').hide();
                     } else {
                     $('div.busy').hide();
                     $('div.notbusy').show();
           }
         },100)")
  ),
  tags$a(href=href,
         div(class = "busy",  
             img(src=loadingsrc,height = height, width = width, alt = alt)),
         div(class = 'notbusy',
             img(src = src, height = height, width = width, alt = alt))
   )
  )
}

dashboardBody(
  dashboardHeader(title = loadingLogo('http://mycompanyishere.com',
                                      'logo.png',
                                      'loader.gif'),
  dashboardSidebar(),
  dashboardBody()
)
28
répondu Shape 2016-05-31 23:36:57

Voici mon hack (mettez votre logo, comme cela a été mentionné précédemment, dans un www sous-répertoire de votre répertoire app).

Parce que dashboardHeader() attend un élément d'étiquette de type li et la classe dropdown, nous pouvons transmettre ces éléments au lieu de dropdownMenu s:

library(shiny)
library(shinydashboard)

dbHeader <- dashboardHeader(title = "My Dashboard",
                            tags$li(a(href = 'http://shinyapps.company.com',
                                      icon("power-off"),
                                      title = "Back to Apps Home"),
                                    class = "dropdown"),
                            tags$li(a(href = 'http://www.company.com',
                                      img(src = 'company_logo.png',
                                          title = "Company Home", height = "30px"),
                                      style = "padding-top:10px; padding-bottom:10px;"),
                                    class = "dropdown"))

server <- function(input, output) {}

shinyApp(
    ui = dashboardPage(
        dbHeader,
        dashboardSidebar(),
        dashboardBody()
    ),
    server = server
)
18
répondu Matt Flor 2016-12-14 14:55:27