Как избежать наложения ярлыков в Groupcheckbox в Shiny? - PullRequest
Новая
       12

Как избежать наложения ярлыков в Groupcheckbox в Shiny?

0 голосов
/ 07 июля 2019

Итак, я создал приложение в Shiny, которое работает, и я также загрузил его на shinyapps.io. Когда я создавал приложение, я работал дома со своим компьютером с размером экрана 24 дюйма. Теперь мой друг, который проверял мое приложение, сказал мне, что на его экране ярлыки перекрываются (чего не было на моем экране). Поэтому мой вопрос сейчас заключается в том, как сделать так, чтобы содержимое внутри определенных полей изменяло размер автоматически в зависимости от размера экрана пользователя.

Я попытался изменить размеры полей, но это не меняет содержимое внутри. Я уверен, что есть решение CSS, но я пока не смог его найти.

Итак, вот один из примеров одной из моих вкладок (я сделал все нажатия в глобальной среде. R отдельно, а затем jsut добавил их все в моем пользовательском интерфейсе. R)

Так что это одна из моих вкладок. и метки флажка перекрываются, если размер экрана слишком мал. 


# tab6 --> africa
tab6 = tabItem(
  tags$head(
    tags$style(HTML("
                    .multicol {
                    -webkit-column-count: 3; /* Chrome, Safari, Opera */
                    -moz-column-count: 3; /* Firefox */
                    column-count: 3;
                    }
                    "))

    ),
  tabName = "africa",
  box(height = 770,width = 6, plotOutput("graph6", hover = "plot_hover6", height = 650),verbatimTextOutput("info6")), # box1 closing
  box(title = "Settings",  height = 770, width = 6,
      wellPanel(
        sliderInput(inputId = "range6",
                    label = "Choose the year range:",
                    min = 2002, max = 2020, value = c(2002,2020)),
        selectInput(inputId = "dis6",
                    label = "Choose the district",
                    choices = unique(Africa$District)),
        tags$div(class = "multicol", prettyCheckboxGroup(inputId = "con6",
                                                         label = "Choose the place of birth",choices = unique(Africa$Country),selected = unique(Africa$Country)[27],outline = T, plain = T, icon = icon("check-circle")))))#box2 closing
    )# tabitem closing

Это мой пользовательский интерфейс, где я просто добавил все вкладки, которые я сделал в моей глобальной среде. 


# head of the dashboard
header = dashboardHeader(title = "Vienna")

# sidebar
sidebar = dashboardSidebar(
  sidebarMenu(
    menuItem(text = "Read Me", tabName = "readme", icon = icon("readme")),
    menuItem(text = "Migration", tabName = "migration", icon = icon("globe-americas"),menuSubItem(text = "EU before 2004", tabName = "eu1", icon = icon("bar-chart")),menuSubItem(text = "EU after 2004", tabName = "eu2", icon = icon("bar-chart")), menuSubItem(text = "Non-EU Countries", tabName = "noneu", icon = icon("bar-chart")),menuSubItem(text = "America", tabName = "america", icon = icon("bar-chart")),menuSubItem(text = "Asia", tabName = "asia", icon = icon("bar-chart")), menuSubItem(text = "Africa", tabName = "africa", icon = icon("bar-chart")),  menuSubItem(text = "Oceania", tabName = "oceania", icon = icon("bar-chart"))),# first menu item 
    menuItem(text = "Real Estate Prices", icon = icon("sign"), tabName = "realestate", menuSubItem(text = "Appartments", tabName = "app", icon = icon("building")),  menuSubItem(text = "Houses", tabName = "house", icon = icon("home")), menuSubItem(text = "Land", tabName = "land", icon = icon("layer-group"))
    )# second menu item
  ) # sidebar menu
)# dashboard sidebar

#C0C0C0
# body 
body = dashboardBody(fluidPage(
  tags$head(tags$style(HTML('
                            /* body */
                            .content-wrapper, .right-side {
                            background-color: #96A2A4;
                            }

                            '))),

  tabItems(
    # ReadMe
    tab0,
    # Denography
    tab1, tab2, tab3, tab4, tab5, tab6, tab7,
    # Property Prices
    tab8, tab9, tab10
  ) # tabITEMS   
  )# fluid page
)

# dashboardbody



# full UI compressed
ui = dashboardPage(header, sidebar, body, skin = "blue")

Итак, я пытаюсь создать поле (), которое будет изменять размер содержимого внутри (например, ярлыки CheckBox) в зависимости от размера экрана.

...