問題描述
我只想在圖層控件中單擊圖層并且縮放級別大于某個數字時才顯示圖層，例如8. 原因之一是必須執行一些昂貴的計算才能獲得層坐標.我想使用圖層控件而不是額外的輸入按鈕(出于光學原因).
I want to show a layer only when its clicked in the LayersControl and the zoom level is greater than a certain number, e.g. 8. One of the reasons is, that some expensive computations must be performed to get the layer coordinates. I want to use the layerscontrol and not an extra input button (for optical reasons).
如果在圖層控件中單擊圖層按鈕，有沒有辦法檢索該值?
Is there a way to retrieve the value, if the layer button is clicked in the layerscontrol?
這是一個簡單的例子(不工作):
Here is a simple example (not working):
library(leaflet)
library(shiny)
ui <- fluidPage(
leafletOutput("map", width = "100%", height = "700")
)
server <- function(input, output){
output$map <- renderLeaflet({
leaflet() %>% addTiles() %>% setView(10.4, 50.3, 7) %>%
addLayersControl(overlayGroups = c("marker"),
options = layersControlOptions(collapsed = FALSE))
})
observe({
# if (input$marker == TRUE){ # how to get value if layercontrol is clicked?
if (input$map_zoom > 8) {
leafletProxy("map") %>% addMarkers(lng = 10.5, lat = 50, group = "marker")
}
# }
})
}
shinyApp(ui = ui, server = server)
推薦答案
這是第一個運行的版本.也許 smdy 想出了 sthg "cleaner" :).
Here is a first running version. Maybe smdy comes up with sthg "cleaner" :).
這里做個小解釋:
挑戰 1:input$marker 不作為閃亮的輸入存在.打開您的應用程序(在瀏覽器中)，右鍵單擊您感興趣的標記輸入，然后在瀏覽器中選擇檢查元素"或等效標簽.您將看到該輸入的代碼.那為什么你不能訪問它.要查看您從閃亮中知道的輸入類型的差異，請創建一個 textinput 或 sthg 并同時創建檢查元素".您會看到閃亮的輸入有一個 id，....標記輸入沒有
Challenge 1: input$marker does not exist as shiny input.
Open your app (in a browser), make a right click on the marker input you are interested in and select "Inspect Element" or the equivilant label in your browser. You will see the code of that input.
So why cant you access it. To see the difference to the kind of input you know from shiny, create a textinput or sthg and make "inspect element" as well. You see that the shiny-inputs have an id,....the marker input does not
挑戰 2:訪問沒有 id 的輸入:(從這里開始，您應該知道如何將消息從 JS 發送到 R 并返回:您將在此處找到一篇非常好的文章:https://ryouready.wordpress.com/2013/11/20/sending-data-from-client-到服務器并返回使用閃亮/)如何訪問輸入:嗯，這基本上只是通過谷歌找到正確的片段.最后是:document.getElementsByTagName("input").(注意:從這里開始我假設你只有一個輸入)并且知道這有點棘手.嘗試訪問這個輸入.通過 console.log() 您可以打印到 javascript 控制臺(并通過F12"-> 控制臺 (JS) 在正在運行的應用程序中打開它.)您可以將此輸入打印為 HtMLCollection，但不能訪問它，這可能會非常混亂.
Challenge 2: Access input that does not have an id:
(From here on you should know how to send messages from JS to R and back: A very good article you will find here: https://ryouready.wordpress.com/2013/11/20/sending-data-from-client-to-server-and-back-using-shiny/)
How to access the input: Well, thats basically just finding the right snippet via google. In the end this: document.getElementsByTagName("input").
(Attention: From here on I assume you only have one input)
And know it gets a bit tricky. Try to access
this input. Via console.log() you can print to javascript console (and open it in the running app via "F12" --> Console (JS).)
You can print this input as HtMLCollection but can not access it, which can be very confusing.
挑戰 3:訪問?? HTMLCollection
您無法訪問它的原因(簡而言之)是在構建DOM"之前調用了JS代碼.如果在<body></body>"之后調用腳本，它會完全正常工作.但這對于普通的香草光澤并不是那么容易.您可以嘗試 window.onload() 或 document.ready().到目前為止，對我來說最可靠的是使用: session$onFlushed() 并觸發將該函數中的 JSCode 從 R 發送到JS".(然后通過 Shiny.onInputChange("marker", inputs[0].checked); 將值作為輸入發送回 R) --> 這將產生所需的input$marker".然而，這個函數只觸發一次，這是完全正確的行為.但是當你點擊按鈕時你不會有更新.
The reason (in short) why you can not access it is that the JS code is called before the "DOM" is build. It would work totally fine if the script is called after "<body></body>". But thats not that easy with plain vanilla shiny. You can try window.onload() or document.ready().
What is the most reliable for me so far is to use: session$onFlushed() and trigger to send the JSCode within that function from R to "JS".
(And then send the value as an input back to R via Shiny.onInputChange("marker", inputs[0].checked); ) --> This will produce the desired "input$marker".
However, this function only fires once, which is totally right behaviour. But you wont have updates when you click the button.
挑戰 4:更新 input$marker那么漂亮的版本是有一個函數 .onclicked()/一個輸入監聽器.也許有人可以找到解決方案.我嘗試了一個閃亮的解決方法，我告訴閃亮通過 autoInvalidate() 不斷獲取輸入的值.
Challenge 4: Update input$marker
Well the pretty version would be to have a function .onclicked()/ a listener for the input. Maybe somebody could find a solution. I tried a workaround in shiny, that i tell shiny to constantly get value of the input via autoInvalidate().
挑戰 5:好吧，沒那么難，因為它只是有光澤，但為了完整性.鑒于問題中提供的代碼，標記將在加載一次時保留.一旦不滿足縮放標準，不確定是要保留還是刪除它.無論如何，如果你想讓它消失，%>% clearMarkers() 是你的朋友.
Challenge 5:
Well, not that difficult, because it is shiny only, but for sake of completeness. Given the provided code in the question, the marker will stay when loaded once. Not sure if you want it to stay or to be removed once your zooming criteria is not met.
Anyway, if you want it to disappear, %>% clearMarkers() is your friend.
library(leaflet)
library(shiny)
getInputwithJS <- '
Shiny.addCustomMessageHandler("findInput",
function(message) {
var inputs = document.getElementsByTagName("input");
Shiny.onInputChange("marker", inputs[0].checked);
}
);
'
ui <- fluidPage(
leafletOutput("map", width = "100%", height = "700"),
tags$head(tags$script(HTML(getInputwithJS)))
)
server <- function(input, output, session){
global <- reactiveValues(DOMRdy = FALSE)
output$map <- renderLeaflet({
leaflet() %>% addTiles() %>% setView(10.4, 50.3, 7) %>%
addLayersControl(overlayGroups = c("marker"),
options = layersControlOptions(collapsed = FALSE))
})
autoInvalidate <- reactiveTimer(1)
observe({
autoInvalidate()
if(global$DOMRdy){
session$sendCustomMessage(type = "findInput", message = "")
}
})
session$onFlushed(function() {
global$DOMRdy <- TRUE
})
observe({
if (!is.null(input$marker)){
if (input$marker == TRUE){ # how to get value if layercontrol is clicked?
if (input$map_zoom > 8) {
leafletProxy("map") %>% addMarkers(lng = 10.5, lat = 50, group = "marker")
}else{
leafletProxy("map") %>% clearMarkers()
}
}
}
})
}
shinyApp(ui = ui, server = server)
這篇關于僅當縮放級別>時，才在閃亮的傳單地圖中顯示圖層8 層控制?的文章就介紹到這了，希望我們推薦的答案對大家有所幫助，也希望大家多多支持html5模板網！