Masskjutningar: ändra utdata

I den här övningen bygger du vidare på den Shiny-app du skapade tidigare, så att röda cirklar – vars storlek baseras på antalet dödsfall – visas på den interaktiva kartan. När du klickar på en cirkel visas även en sammanfattning av händelsen. Appen ska likna bilden i den här skärmbilden.

En app som visar röda cirklar för varje masskjutningsincident, med detaljer som visas när cirkeln klickas

Den här övningen är en del av kursen

Bygg webbapplikationer med Shiny i R

Visa kurs

Övningsinstruktioner

Uppdatera det reaktiva uttrycket rval_mass_shootings så att datamängden filtreras baserat på antalet dödsfall (nb_fatalities) och det datumintervall (date_range) som användaren har valt.
Uppdatera koden inuti addCircleMarkers() så att cirkelns radius kopplas till fatalities och parametern popup kopplas till summary. Observera att du kan koppla en parameter p till ett fält f med p = ~ f.

Interaktiv övning med praktiskt arbete

Testa den här övningen genom att slutföra den här exempelkoden.

ui <- bootstrapPage(
  theme = shinythemes::shinytheme('simplex'),
  leaflet::leafletOutput('map', height = '100%', width = '100%'),
  absolutePanel(top = 10, right = 10, id = 'controls',
    sliderInput('nb_fatalities', 'Minimum Fatalities', 1, 40, 10),
    dateRangeInput('date_range', 'Select Date', "2010-01-01", "2019-12-01")
  ),
  tags$style(type = "text/css", "
    html, body {width:100%;height:100%}     
    #controls{background-color:white;padding:20px;}
  ")
)

server <- function(input, output, session) {
  rval_mass_shootings <- reactive({
    # MODIFY CODE BELOW: Filter mass_shootings on nb_fatalities and 
    # selected date_range.
    mass_shootings

      
      
      
      
  })
  output$map <- leaflet::renderLeaflet({
    rval_mass_shootings() %>%
      leaflet() %>% 
      addTiles() %>%
      setView( -98.58, 39.82, zoom = 5) %>% 
      addTiles() %>% 
      addCircleMarkers(
        # CODE BELOW: Add parameters popup and radius and map them
        # to the summary and fatalities columns

        fillColor = 'red', color = 'red', weight = 1
      )
  })
}

shinyApp(ui, server)

Redigera och kör kod