прозрачная коробка на моей карте листовки с использованием блестящей приборной панели - PullRequest
Новая
       10

прозрачная коробка на моей карте листовки с использованием блестящей приборной панели

0 голосов
/ 15 января 2020

Я работаю над блестящим приложением, которое создает карты с несколькими тепловыми кругами, используя заданные c долготы и широты для каждого круга. Я хочу создать поле фильтра с несколькими входами и поместить их на карту (а не рядом, над или под картой), а также сделать этот блок прозрачным (с низкой непрозрачностью), если пользователь его не использует. Пример этой точно такой же проблемы можно рассмотреть с помощью этого блестящего приложения: https://shiny.rstudio.com/gallery/superzip-example.html

Примите во внимание, что я использую элементы Shinydashboard, но пример - нет. До сих пор я не смог изменить объект стиля css, который он представляет, так, как мне нужно.

Это воспроизводимый код: 

### User Interface ----
ui <- dashboardPage(
 dashboardHeader(title = "Delitos"),
 dashboardSidebar(
   sidebarMenu(
     menuItem("Mapa", tabName = "mapa", icon = icon("th"))
   )
 ),
 dashboardBody(
   tabItems(

     tabItem(tabName = "mapa",
             fluidRow(
               useShinyjs(),
               tabBox(
                 id = "tabset_mapa",
                 selected = 1,
                 width = "100%",
                 tabPanel("Mapa",

                          leafletOutput("mapa1", width = "100%",
                                               height = 565), value = 1,

                          selectInput(inputId = "tentativa_mapa",
                                      label= "Tentativa", 
                                      choices = c("Todos","Sí", "No")),

                          selectInput(inputId = "tipo_delito_mapa",
                                      label= "Presunto delito", 
                                      choices = c("assault", "robbery", "murder 1st grd", "racism")),
                          selectInput(inputId = "periodo_tipo_mapa",
                                      label= "Periodo", 
                                      choices = c("Anual", "Trimestral", "Mensual")),

                          selectInput(inputId = "provincia_mapa",
                                      label= "Nivel", 
                                      choices = c("National", "By province", "By city")),

                          downloadButton('downloadPlot_mapa','Descargar mapa'),

                          downloadButton('downloadTab_mapa','Descargar tabla')),

                 tabPanel("Tabla", tableOutput("datos_mapa"), value = 2)
               )
          )
      )
    )
)
)

server <- function(input, output, session) {

 provinces_example<-read.table(text="province  latitude    longitude   commited_crimes
               'AZUAY' -2.977837402    -79.59862563    40
               'BOLIVAR'   -1.608160425    -79.21881726    80
               'CAÑAR' -2.62647275 -78.74661345    120
               'CARCHI'    0.497518667 -77.93454964    160
               'CHIMBORAZO'    -2.295557587    -78.74180743    180
               'COTOPAXI'  -0.689132059    -79.07517499    200
               'EL ORO'    -3.599779139    -80.08944846    40
               'ESMERALDAS'    0.788046309 -79.85938815    80
               'GALAPAGOS' -0.864657102    -91.18846265    120
               'GUAYAS'    -1.946949383    -79.54741946    160
               'IMBABURA'  0.325942394 -78.21791368    180
               'LOJA'  -4.337267466    -79.60400106    200
               'LOS RIOS'  -1.681021544    -79.66105689    40
               'MANABI'    -0.90954183 -80.03392081    80
               'MORONA SANTIAGO'   -3.364821478    -78.6528047 120
               'NAPO'  -0.732803451    -77.72780304    160
               'ORELLANA'  -0.949617383    -75.88180184    180
               'PASTAZA'   -1.267547808    -77.24877698    200
               'PICHINCHA' -0.004023516    -78.07462989    40
               'SANTA ELENA'   -2.234427504    -80.89511306    80
               'SANTO DOMINGO DE LOS TSACHILAS'    -0.042338801    -79.37282164    120
               'SUCUMBIOS' 0.145724565 -77.23283688    160
               'TUNGURAHUA'    -1.278333208    -78.74968472    180
               'ZAMORA CHINCHIPE'  -3.935345655    -78.74906701    200",h=T,strin=F)

 observeEvent(input$periodo_tipo_mapa, {
   if (req(input$periodo_tipo_mapa)=="Anual") {
     shinyjs::show("periodo_input_mapa")
     shinyjs::hide("periodo_input_mapa_t")
     shinyjs::hide("periodo_input_mapa_m")
   } else if (req(input$periodo_tipo_st)=="Trimestral") {
     shinyjs::hide("periodo_input_mapa")
     shinyjs::show("periodo_input_mapa_t")
     shinyjs::hide("periodo_input_mapa_m")
   } else if (req(input$periodo_tipo_st)=="Mensual") {
     shinyjs::hide("periodo_input_mapa")
     shinyjs::hide("periodo_input_mapa_t")
     shinyjs::show("periodo_input_mapa_m")
   }
 })

 observeEvent(input$tabset_mapa, {
   if (req(input$tabset_mapa)==1) {
     shinyjs::show("downloadPlot_mapa")
     shinyjs::hide("downloadTab_mapa")
   } else {
     shinyjs::show("downloadTab_mapa")
     shinyjs::hide("downloadPlot_mapa")
   }
 })

###MAPA----

canton_popup <- paste0("<strong>Provincia: </strong>", 
                        provinces_example$province,
                        "<br><strong>Número de denuncias: </strong>", 
                        formatC(provinces_example$commited_crimes, format="f", big.mark = ".",decimal.mark = ",", digits=0))

 output$mapa1 <- renderLeaflet({
   leaflet(provinces_example, options = leafletOptions(minZoom = 0, maxZoom = 14))%>%
     setView(lng = -80.0123274, lat = -2.3201641, zoom = 7)%>%
     addProviderTiles("CartoDB.Positron")%>%
     setMaxBounds(lng1 = -96, lat1 = 4,lng2 = -70, lat2 = -10)%>%
     addTiles()%>% addMarkers( lng = provinces_example$longitude,
                               lat = provinces_example$latitude, 
                                     popup = canton_popup) %>%
     addMiniMap(centerFixed = c(-0.4,-90.5), zoomLevelFixed = 6, toggleDisplay = TRUE)
 })
}
shinyApp(ui, server)

1 Ответ

0 голосов
/ 28 января 2020

Настоятельно рекомендуем вам просмотреть код приложения на соответствующей github

внутри tabPanel, которую они имеют 

div(class="outer",

  tags$head(
    # Include our custom CSS
    includeCSS("styles.css"))

Именно там они и называют. CSS, я не вижу, чтобы вы вызывали. css файл в вашем коде

...