我正在尝试修改此 repo显示等值线图并使用 sliderInput 更新 map 。一切正常,直到我尝试为 slider 输入设置动画,但没有任何反应。我收到此控制台错误:input_binding_slider.js:199 Uncaught TypeError: Cannot read property 'options' of undefined.
这是我正在使用的代码:
library(dplyr) ; library(rgdal) ; library(leaflet)
gdp = read.csv("mexico2.csv", header= T) %>%
as.data.frame()
mexico <- readOGR("mexico.shp", layer = "mexico", encoding = "UTF-8")
ui <- shinyUI(fluidPage(
fluidRow(
column(7, offset = 1,
br(),
div(h4(textOutput("title"), align = "center"), style = "color:black"),
div(h5(textOutput("period"), align = "center"), style = "color:black"),
br())),
fluidRow(
column(7, offset = 1,
leafletOutput("map", height="530"),
br(),
actionButton("reset_button", "Reset view")),
column(3,
uiOutput("category", align = "left")))
))
server <- (function(input, output, session) {
output$category <- renderUI({
sliderInput("category", "Year:",
min=1994, max = 1999,
value = 1994, sep = "", animate=TRUE)
})
selected <- reactive({
subset(gdp,
category==input$category)
})
output$title <- renderText({
req(input$category)
paste0(input$category, " GDP by State")
})
output$period <- renderText({
req(input$category)
paste("...")
})
lat <- 23
lng <- -102
zoom <- 5
output$map <- renderLeaflet({
leaflet() %>%
addProviderTiles("CartoDB.Positron") %>%
setView(lat = lat, lng = lng, zoom = zoom)
})
observe({
mexico@data <- left_join(mexico@data, selected())
qpal <- colorQuantile("YlGn", mexico$value, n = 5, na.color = "#bdbdbd")
popup <- paste0("<strong>ID: </strong>",
mexico$id,
"<br><strong>Estado: </strong>",
mexico$name,
"<br><strong>Valor: </strong>",
mexico$value)
leafletProxy("map", data = mexico) %>%
addProviderTiles("CartoDB.Positron") %>%
clearShapes() %>%
clearControls() %>%
addPolygons(data = mexico, fillColor = ~qpal(value), fillOpacity = 0.7,
color = "white", weight = 2, popup = popup) %>%
addLegend(pal = qpal, values = ~value, opacity = 0.7,
position = 'bottomright',
title = paste0(input$category, "<br>"))
})
observe({
input$reset_button
leafletProxy("map") %>% setView(lat = lat, lng = lng, zoom = zoom)
})
})
shinyApp(ui, server)
这是 shinyapp 的链接
我们将不胜感激任何帮助。 谢谢!
最佳答案
这只是一个命名错误。您将 htmlOutput
和 命名为“类别”。在内部,这把事情搞砸了。
只需改变例如输出到
uiOutput("categoryOutput", align = "left")
和
output$categoryOutput <- renderUI({ ... })
你应该可以开始了。
编辑:完整代码
library(dplyr) ; library(rgdal) ; library(leaflet)
gdp = read.csv("mexico2.csv", header= T) %>%
as.data.frame()
mexico <- readOGR("mexico.shp", layer = "mexico", encoding = "UTF-8")
ui <- shinyUI(fluidPage(
fluidRow(
column(7, offset = 1,
br(),
div(h4(textOutput("title"), align = "center"), style = "color:black"),
div(h5(textOutput("period"), align = "center"), style = "color:black"),
br())),
fluidRow(
column(7, offset = 1,
leafletOutput("map", height="530"),
br(),
actionButton("reset_button", "Reset view")),
column(3,
uiOutput("categoryOut", align = "left")))
))
server <- (function(input, output, session) {
output$categoryOut <- renderUI({
sliderInput("category", "Year:",
min=1994, max = 1999,
value = 1994, sep = "", animate=TRUE)
})
selected <- reactive({
subset(gdp,
category==input$category)
})
output$title <- renderText({
req(input$category)
paste0(input$category, " GDP by State")
})
output$period <- renderText({
req(input$category)
paste("...")
})
lat <- 23
lng <- -102
zoom <- 5
output$map <- renderLeaflet({
leaflet() %>%
addProviderTiles("CartoDB.Positron") %>%
setView(lat = lat, lng = lng, zoom = zoom)
})
observe({
mexico@data <- left_join(mexico@data, selected())
qpal <- colorQuantile("YlGn", mexico$value, n = 5, na.color = "#bdbdbd")
popup <- paste0("<strong>ID: </strong>",
mexico$id,
"<br><strong>Estado: </strong>",
mexico$name,
"<br><strong>Valor: </strong>",
mexico$value)
leafletProxy("map", data = mexico) %>%
addProviderTiles("CartoDB.Positron") %>%
clearShapes() %>%
clearControls() %>%
addPolygons(data = mexico, fillColor = ~qpal(value), fillOpacity = 0.7,
color = "white", weight = 2, popup = popup) %>%
addLegend(pal = qpal, values = ~value, opacity = 0.7,
position = 'bottomright',
title = paste0(input$category, "<br>"))
})
observe({
input$reset_button
leafletProxy("map") %>% setView(lat = lat, lng = lng, zoom = zoom)
})
})
shinyApp(ui, server)
关于r - 带有 Leaflet 和 Shiny 的交互式等值线图,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36107371/