Üst bilgi ve kenar çubuğu ayarları

Bir giyim şirketinde çalıştığını varsayalım. Küresel bir futbol turnuvası yeni bitti ve şirket futbol ürünleri üretmek istiyor. Potansiyel müşterilerin dikkatini çekmek için şirketin taraftar kitlesiyle temas halinde olması gerekiyor.

Senden, aşağıdakilere dayanarak şirketin daha iyi tasarım kararları almasına yardımcı olacak bir gösterge paneli (dashboard) oluşturman isteniyor:

Her maç için bazı detaylar
Her takımın attığı toplam gol sayısı
Her takıma verilen sarı/kırmızı kartların toplamı

Bu egzersizde veriler, soccer adlı bir dplyr veri çerçevesinde tutulmuştur. tidyverse, shinydashboard ve shiny kütüphaneleri de yüklenmiştir.

Bol şans!

Bu egzersiz, kursun bir parçasıdır

Building Dashboards with shinydashboard

Kursa Göz Atın

Uygulamalı etkileşimli egzersiz

Bu egzersizi bu örnek kodu tamamlayarak deneyin.

# Set the title as "Soccer tournament"
header <- dashboardHeader(___)

Kodu Düzenle ve Çalıştır

Bu egzersiz, kursun bir parçasıdır

Building Dashboards with shinydashboard

InicianteNível de habilidade

4.7+

Kursa Ücretsiz Başla

Before you build a shinydashboard, you will first need to understand what a shinyApp is. In this chapter, you will learn what a shinyApp is, and learn what goes into a shinyApp. At the end of this chapter, you will be able to render your own shinyApp.

Exercise 1: Getting started with shiny apps Exercise 2: Parts of a shinyApp Exercise 3: An empty shinyApp Exercise 4: Types of input Exercise 5: Practicing sliderInput Exercise 6: Inserting multiple inputs Exercise 7: checkboxInput and checkboxGroupInput Exercise 8: Types of output Exercise 9: textOutput with interactions Exercise 10: Dropdown menus Exercise 11: Your first shinyApp

In the previous chapter, you learned about shiny apps. In this chapter, you will realize that a shinydashboard is really just another shiny app but with more tweakable features. The same outputs and inputs discussed in the previous chapter can be used in exactly the same manner here. You will then learn to carry out some simple wire-framing for a dashboard, during which you can decide where to position outputs and inputs in the dashboard.

Exercise 1: Bir shinydashboard'un bileşenleri Exercise 2: Bir shinydashboard UI'ının bileşenleri Exercise 3: Your first (empty) dashboard Exercise 4: Başlık ve kenar çubuğu Exercise 5: Başlık ve kenar çubuğu fonksiyonları Exercise 6: Setting a header Exercise 7: Setting a sidebar Exercise 8: Gövde Exercise 9: Wireframing with boxes Exercise 10: Wireframing Exercise 11: İlk shinydashboard'un Exercise 12: Yardımcı fonksiyonlar Exercise 13: Header and side bar settings

Geçerli egzersiz

Exercise 14: The body, and completing the UI Exercise 15: Building your first dashboard

In this chapter, you will learn to further enhance your shinydashboard by inserting interactive elements. These will include graphs, geospatial maps, and tables that dashboard users can interact with in real-time.

Exercise 1: Interactive plots with plotly Exercise 2: Creating your own plotly plots Exercise 3: Understanding plotly limitations Exercise 4: Geospatial maps with sf Exercise 5: Types of sf objects Exercise 6: sf plots with plot()Exercise 7: sf plots with ggplot Exercise 8: Geospatial maps with leaflet Exercise 9: Layers of a leaflet map Exercise 10: Creating your first leaflet map Exercise 11: Interactive elements in a shinydashboard Exercise 12: Creating some helper functions Exercise 13: Your first shinydashboard with interactive elements

Now that you are familiar with shinydashboard, we can now add design elements. We will be able to change background colors, modify box dimensions and so on. We will also discuss some basic principles of good UI/UX. Finally, we will show how statuses and CSS formatting can be utilized.

Exercise 1: Good UI/UX practices Exercise 2: Understanding UI/UX principles Exercise 3: Wireframing with UI/UX principles Exercise 4: Statuses, colors and skins Exercise 5: Setting statuses Exercise 6: Setting colors Exercise 7: Changing shinydashboard skins Exercise 8: Customization with CSS formatting Exercise 9: Good UI/UX practices and a warm-up Exercise 10: Statuses and completing the UI Exercise 11: Customize your shinydashboard with CSS Exercise 12: Wrap-up