45

興味深いのですが、会社のロゴを ShinyDashboard のヘッダーに追加する方法はありますか? ドキュメントを見ていると、CSS の「ロゴ」を変更することが説明されています。これは、左上隅にあるものを構成しているだけで、タイトルをそのままにしておきたいと思います。

ドロップダウン メニューを使用していないので、右上の赤いボックスに会社のロゴを追加したいと考えています。

ここに画像の説明を入力

Shinydashboardでこれを行う方法を知っている人はいますか? ありがとう。

2020-10-27 更新

HTML に慣れているユーザー、またはユーザー インターフェイスの柔軟性を高めたいユーザーで、フロント エンド開発者にアクセスできるユーザーのために、HTML を使用してユーザー インターフェイス全体を構築できることを最近発見しました。それについての Shiny の記事がここにあります。これにより、必要に応じて、会社の標準に準拠できる方法でブランディングとレイアウト全体を行うことができます。お役に立てれば。

4

2 に答える 2

58

私はこれのためにちょっとしたハックに取り組んできました (そして、あなたがそれを求めていないことは知っていますが、私たちがそれをしている間、ここにクリック可能なロゴがあります):

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()
)

したがって、これは、ヘッダー内に Shiny.tag をネストします。この特定の光沢のあるオブジェクトの 2 番目のスロットはロゴ スロットです (アプリ ディレクトリの /www/ フォルダーに「logo.png」が必要です)。

編集：

確認したところ、現時点では、このハックは不要になっているはずです。title=パラメーターを介して、dashboardHeader 関数から直接 html を挿入できます (以前は、そのパラメーターはテキストのみを強制していました)。

ただし、ハードコードされている既存の光沢のある関数を変更する方法として、答えはまだ役立つかもしれないと思います。

これが今の方法です：

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

または、ロゴにもう少し魔法を追加します (私は自分のロゴを読み込みバーとしても使用しています):

# 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()
)
于 2015-09-29T21:52:31.480 に答える
42

wwwこれが私のハックです（前述のように、アプリディレクトリのサブディレクトリにロゴを入れてください）。は typeと classのタグ要素を想定している
ため、 s の代わりにそのような要素を渡すことができます:dashboardHeader()lidropdowndropdownMenu

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
)
于 2016-12-14T14:55:27.757 に答える