Entwicklungsumgebung vorbereiten

Inhalt

4.3. Entwicklungsumgebung vorbereiten#

Vorbereitende Maßnahmen, bevor mit dem Bau eines Dashboards begonnen werden kann…

Bevor Daten visualisiert werden können, müssen sie zunächst gesammelt und aufbereitet werden. Dazu gehören programmgesteuerte Methoden wie Data Scraping (automatisierte Datenerfassung) und Data Cleaning (Datenbereinigung), die eine zentrale Grundlage für jede Visualisierung bilden (). In diesem Abschnitt wird dazu zuerst die Entwicklungsumgebung RStudio vorbereitet und anschließend werden die Daten importiert und bearbeitet.

4.3.1. Einrichtung der Entwicklungsumgebung#

Bevor Sie mit dem Aufbau des Dashboards beginnen können, müssen Sie die benötigten Pakete installieren und laden. Öffnen Sie RStudio und führen Sie folgenden Befehl aus, um die erforderlichen Pakete zu installieren:

install.packages(c("shiny", "shinydashboard", "leaflet",
                   "dplyr", "htmltools", "stringr", "sf",
                   "tidyr", "ggplot2", "plotly", "leaflet.extras"))

Nachdem die Installation abgeschlossen ist, laden Sie die Pakete in Ihr Skript:

library(shiny)
library(shinydashboard)
library(leaflet)
library(dplyr)
library(htmltools)
library(stringr)
library(sf)
library(tidyr)
library(ggplot2)
library(plotly)

Jedes dieser Pakete übernimmt eine spezifische Rolle:

Benutzeroberfläche (UI): shiny und shinydashboard bilden das interaktive Grundgerüst der Anwendung. htmltools hilft bei erweiterten HTML-Elementen.
Datenverarbeitung: dplyr und tidyr strukturieren und verarbeiten die Datensätze, sf lädt und verarbeitet räumliche Daten wie die Berliner Bezirksgrenzen, und stringr hilft bei der Manipulation von Zeichenketten.
Visualisierung: leaflet ermöglicht den Bau der interaktiven Landkarte, während ggplot2 und plotly für die Erstellung der Diagramme genutzt werden.

4.3.2. Daten laden und vorbereiten#

Einlesen und Aufbereitung der CSV-Datei

Die Grundlage für unser Dashboard bildet eine CSV-Datei der Nutzungsdaten aus dem bereits erwähnten Projekt Gieß den Kiez. Diese muss zunächst eingelesen und bereinigt werden. Verwenden Sie dazu folgenden Code; der Text hinter dem # zeigt Ihnen an, was die darunter folgenden Codezeilen tun:

# Bezirksgrenzen laden
bezirksgrenzen <- st_read("data/bezirksgrenzen.geojson", quiet = TRUE)

# Bewässerungsdaten laden
df_merged <- readRDS("data/df_merged_final.rds")

# Bezirksgrenzen vorbereiten
berlin_bezirke_sf <- bezirksgrenzen %>%
  rename(bezirk = Gemeinde_name) %>%     # Spalte vereinheitlichen
  mutate(bezirk = str_to_title(bezirk))  # gleiche Schreibweise wie in df_merged

Erklärung des Codes:

st_read(...) lädt die GeoJSON-Datei mit den Berliner Bezirksgrenzen als räumliches Objekt ein.
readRDS(...) lädt die RDS-Datei mit den vorbereiteten Bewässerungsdaten und gibt das gespeicherte R-Objekt zurück.
rename(...) benennt die Spalte Gemeinde_name in bezirk um, um eine einheitliche Schreibweise sicherzustellen.
mutate(bezirk = str_to_title(bezirk)) sorgt dafür, dass die Bezirksnamen in der Geodatei dieselbe Schreibweise wie in df_merged haben.

4.3.3. Dashboard bauen#

Farbpalette definieren

Eine globale Farbpalette definiert ein einheitliches Farbschema für alle Grafiken des Dashboards. Dies ermöglicht Konsistenz in der Gestaltung und erleichtert Nutzer:innen die Orientierung. Diese Palette wird in allen Grafiken der folgenden Kapitel konsistent verwendet:

# GLOBALE FARBPALETTE - Einheitliches Farbschema für alle Grafiken
GDK_PALETTE_BASE <- c(
  "#3C6E97", "#6894B5", "#95BBD4", "#C8E0EF",
  "#3E8395", "#67A7B6", "#98CBD6", "#D0EDF2",
  "#508B71", "#7AB097", "#A5D2BC", "#D6EFE5",
  "#4F626E", "#8D9FA9", "#B2C2CC", "#DCE6EB"
)

GDK_ACCENT <- "#95BBD4"

options(ggplot2.discrete.fill = function() scale_fill_manual(
  values = colorRampPalette(GDK_PALETTE_BASE)(16)
))

Erklärung des Codes:

GDK_PALETTE_BASE speichert einen Vektor mit Hexadezimal-Farbcodes. Für dieses Dashboard ist hier eine Farbpalette mit 16 Farben definiert. An dieser Stelle lassen sich problemlos eigene Farben eintragen, um eine ganz individuelle Palette zu erstellen. Alternativ können in R auch Pakete wie RColorBrewer oder viridis genutzt werden, die bereits vorgefertigte Farbpaletten zur Verfügung stellen.
GDK_ACCENT definiert eine zusätzliche Akzentfarbe für Hervorhebungen.
options(ggplot2.discrete.fill = ...) setzt die Farbpalette als globale Voreinstellung für ggplot2. colorRampPalette() interpoliert zwischen den definierten Farben und erzeugt bei Bedarf Zwischentöne.

Grundstruktur einer Shiny-Anwendung

Eine typische Shiny-Anwendung besteht aus zwei Hauptkomponenten:

User Interface (UI): Definiert das Layout und die Gestaltung der Anwendung, einschließlich aller Eingabe- und Ausgabeelemente.
Server: Beinhaltet die serverseitige Logik, verarbeitet Eingaben und generiert entsprechende Ausgaben.

Diese beiden Komponenten führen Sie schließlich durch den Befehl shinyApp(ui = ui, server = server) zusammen, um die Anwendung zu starten.

Das shinydashboard-Paket erweitert Shiny um Funktionen zur Erstellung von Dashboards. Ein Dashboard besteht typischerweise aus drei Hauptbereichen: Shiny Dashboard Structure

Header: Der obere Bereich des Dashboards, der den Titel und optionale Steuerungselemente enthält.
Sidebar: Eine seitliche Navigationsleiste, die Links oder Schaltflächen zur Navigation innerhalb des Dashboards bereitstellt.
Body: Der Hauptbereich, in dem die Inhalte wie Diagramme, Tabellen und Texte angezeigt werden.

Die Grundstruktur eines Dashboards erstellen Sie mit der Funktion dashboardPage(), die die oben genannten Komponenten kombiniert (bitte führen Sie den folgenden Codeabschnitt nicht in der Konsole aus, sondern ersetzen Sie damit vollständig die in Kapitel 1 automatisch generierte Rshiny Schablone im Rshiny Skript):

ui <- dashboardPage(
  # 1. HEADER: Titelbereich des Dashboards
  dashboardHeader(title = "Gieß den Kiez Dashboard"),

  # 2. SIDEBAR: Seitliche Navigationsleiste mit Menüeinträgen
  dashboardSidebar(
    sidebarMenu(
      menuItem("Startseite", tabName = "start", icon = icon("home")),
      menuItem("Karte", tabName = "map", icon = icon("map")),
      menuItem("Zeitverlauf", tabName = "stats", icon = icon("bar-chart")),
      menuItem("Baumstatistik", tabName = "engagement", icon = icon("bar-chart")),
      menuItem("Bewässerungsanalyse", tabName = "analysis", icon = icon("chart-area"))
    )
  ),

  # 3. BODY: Inhaltsbereich
  dashboardBody(
    tabItems(
      tabItem(
        tabName = "start"
        # Hier folgt später der UI-Code für die Startseite (Texte, Bilder, etc.)
      ),
      tabItem(
        tabName = "map"
        # Hier folgen später die UI-Komponenten für die Karte
      ),
      tabItem(
        tabName = "stats"
        # Hier folgen später die UI-Komponenten für den Zeitverlauf
      ),
      tabItem(
        tabName = "engagement"
        # Hier folgen später die UI-Komponenten für die Baumstatistik
      ),
      tabItem(
        tabName = "analysis"
        # Hier folgen später die UI-Komponenten für die Bewässerungsanalyse
      )
    )
  )
)

# 4. SERVER: Backend-Logik, die Daten verarbeitet und an die UI generiert
server <- function(input, output) {
  # Hier folgt später der R-Code zur Datenverarbeitung (z.B. renderPlot, renderLeaflet),
  # der die Grafiken und Inhalte für die jeweiligen Tabs im Body erzeugt.
}

# 5. Zusammenführung: Startet die Shiny-Anwendung
shinyApp(ui = ui, server = server)

Die sidebarMenu-Funktion definiert die Navigationselemente, während tabItems die entsprechenden Inhalte für jeden Tab bereitstellt.

Interaktive Elemente und Reaktivität

Ein wesentliches Merkmal von Shiny ist seine Reaktivität, die es ermöglicht, dass sich Ausgaben automatisch aktualisieren, wenn sich Eingaben ändern. Dies wird durch reaktive Funktionen und Objekte erreicht.

Literatur