这是因为将地图和条形图设置为在表格下方的行中,因此将它们放在表格下方是有意义的。
您要嵌套列,因此地图和图表与表格位于同一行。
我不确定下面的代码是否完全正确-如果您提供可复制的示例,我很乐意检查如何应用此代码。但希望您能看到这个主意。
fluidRow(
# This column is the total width of the app
column(width = 12,fluidRow(
# This column is half the width of the app and contains the table
column(width = 6,tableOutput("County_tbl")),# This column is half the width of the app and contains everything else
column(width = 6,# This row contains the dropdown box and slider (each set to half width)
fluidRow(
column(width = 6,uiOutput("States_List")),column(width = 6,sliderInput("slider","Threshold:",100,post = " %",50))),# This row contains the outputs
fluidRow(
plotlyOutput("County_Map"),plotlyOutput("County_Chart")
)
)
)
)
)
,
HI请提供最少的可复制代码,以帮助复制该问题。
这是您如何安排用户界面意味着行和列的问题。我尝试了相同的方法,并以此为基础构建了示例代码。
[![library(shiny)
library(shinydashboard)
library(plotly)
ui <- dashboardPage(
dashboardHeader(
title = "Dashboard"),#sidebar content
dashboardSidebar(
sidebarMenu(
menuItem("Dashboard",tabName = "dashboard",icon = icon("dashboard"))
)
),dashboardBody(
tabItems(
tabItem(tabName='dashboard',tabBox(width = 12,tabPanel("US County Detail",fluidRow(
column(5,fluidRow(
tableOutput("County_tbl")
)
),column(7,fluidRow(
column(6,uiOutput("States_List")
),column(6,50)
)
),fluidRow(
column(12,plotlyOutput("County_Map")
)
),plotlyOutput("County_Chart")
)
)
)
)
)
)
)
)
)
)
server <- function(input,output,session) {
output$County_tbl<-renderTable({
head(mtcars)
})
output$States_List<-renderUI({
list_data<-unique(names(mtcars))
selectInput("cars","Select Car",choices = list_data)
})
output$County_Map<-renderPlotly({
plot_ly(
x = c("giraffes","orangutans","monkeys"),y = c(20,14,23),name = "SF Zoo",type = "bar"
)
})
output$County_Chart<-renderPlotly({
Animals <- c("giraffes","monkeys")
SF_Zoo <- c(20,23)
LA_Zoo <- c(12,18,29)
data <- data.frame(Animals,SF_Zoo,LA_Zoo)
plot_ly(data,x = ~Animals,y = ~SF_Zoo,type = 'bar',name = 'SF Zoo') %>%
add_trace(y = ~LA_Zoo,name = 'LA Zoo') %>%
layout(yaxis = list(title = 'Count'),barmode = 'group')
})
}
shinyApp(ui = ui,server = server)
本文链接:https://www.f2er.com/3159850.html