НачатьНачать бесплатно

Добавление макета

Как вы уже видели в предыдущих главах, использование макета в приложении Shiny важно для организации интерфейса и удобства работы с ним.

Сейчас в приложении совсем немного элементов (один заголовок, два поля ввода, один вывод облака слов), поэтому им ещё можно управлять и без макета. Однако в следующих упражнениях приложение будет расширяться, и боковой макет окажется очень полезным. Лучше добавить макет заранее, а не откладывать: встраивать новые элементы интерфейса Shiny в готовый макет гораздо проще, чем потом переструктурировать разросшееся приложение без чёткой организации.

Как это принято в приложениях Shiny и других интерактивных инструментах, элементы ввода будут размещены в компактной боковой панели, а основной вывод (облако слов) — в более широкой главной панели.

Это упражнение является частью курса

Примеры использования: создание веб-приложений с Shiny в R

Посмотреть курс

Инструкции к упражнению

Ваша следующая задача — добавить боковой макет в текущее приложение Shiny. Новые элементы интерфейса добавлять не нужно — только структуру макета. В частности:

  • Добавьте боковой макет в пользовательский интерфейс.
  • Внутри бокового макета определите боковую панель для размещения двух элементов ввода.
  • Также внутри бокового макета определите главную панель, которая содержит вывод облака слов (строка 12).

Интерактивное практическое упражнение

Попробуйте выполнить это упражнение, дополнив этот пример кода.

ui <- fluidPage(
  h1("Word Cloud"),
  # Add a sidebar layout to the UI
  ___(
    # Define a sidebar panel around the inputs
    ___(
      numericInput("num", "Maximum number of words",
                   value = 100, min = 5),
      colourInput("col", "Background color", value = "white")
    ),
    # Define a main panel around the output
    ___(
      wordcloud2Output("cloud")
    )
  )
)

server <- function(input, output) {
  output$cloud <- renderWordcloud2({
    create_wordcloud(artofwar,
                     num_words = input$num, background = input$col)
  })
}

shinyApp(ui = ui, server = server)
Редактировать и запускать код