R Shiny 中传单弹出窗口 link 的 updatetabsetPanel
updatetabsetPanel from a leaflet popup link in R Shiny
在这里苦苦挣扎的 R 闪亮初学者。单击主面板中地图上标签中的 link 时,我无法掌握如何在我的双标签侧边栏(人员 | 地点)中切换标签。我从其他类似的问题中了解到 updatetabsetPanel 是可行的方法。我尝试了以下方法,当 "places" 选项卡处于活动状态时更新 iframe 效果很好,但当 "people" 选项卡处于活动状态时不会将 "places" 选项卡置于最前面。我不太清楚如何在此处使用 "a href" 来触发更改选项卡的事件。
ui
ui <- fluidPage(
fluidRow(
# ADDED SHINY JS
useShinyjs(debug = TRUE),
column(3,
"DATA",
tabsetPanel(id='lefttabsetPanel',
tabPanel(title='PLACES', value = "placestab",
tags$iframe(name="myiframe2",seamless="seamless",src="http://www.example.com/places.xml",height=600, width=320)
),
tabPanel(title='PEOPLE', value = "peopletab",
tags$iframe(name="myiframe",seamless="seamless",src="http://www.example.com/people.xml",height=600, width=320))
)
),
column(9,
"MAPS",
tabsetPanel(id='my_tabsetPanel',
tabPanel('Map 1',
# ADDED LINKS TO TABS THAT WORK
a(id="peopletablink","link to peopletab",href="http://45.56.98.26:8080/exist/rest/db/madrid/xml/tds-people.xml#PERSCELESTINA", target="myiframe"),
a(id="placestablink","link to placestab",href="http://45.56.98.26:8080/exist/rest/db/madrid/xml/tds-placeography.xml#PLACEMADRID", target="myiframe2"),
leafletOutput(outputId="mymap", height = 600)
),
tabPanel('Map 2',
leafletOutput(outputId="mymap2", height = 600)
)
)
)
)
)
)
全球
server <- function(input,output, session){
data <- reactive({
x <- placeography
})
# Core wrapping function
wrap.it <- function(x, len)
{
sapply(x, function(y) paste(strwrap(y, len),
collapse = "\n"),
USE.NAMES = FALSE)
}
# NEW SHINYJS
shinyjs::onclick("peopletablink", updateTabsetPanel(session, inputId="lefttabsetPanel", selected="peopletab"))
shinyjs::onclick("placestablink", updateTabsetPanel(session, inputId="lefttabsetPanel", selected="placestab"))
# OLD APPROACH
# observeEvent(input$place_link, {
# updateTabsetPanel(session, "lefttabsetPanel", 'placetab')
# }
# )
output$mymap <- renderLeaflet({
m <- leaflet() %>%
setView(lng=-3.6898447, lat=40.4142174, zoom=3 ) %>%
#MAP--SATELLITE ESRI
addProviderTiles("Esri.WorldImagery", group="Satellite") %>%
# PLACES
addPolygons(data = tdscountries,
popup = mapply(function(x, y) {
# THE POPUP LINK I WANT TO CHANGE THE TAB--BUT DOESN'T WORK
HTML(sprintf("<div class='leaflet-popup-scrolled' style='font-size:10px;max-width:200px;max-height:150px; '><b><a href='http://www.example.com/places.xml#%s' target='myiframe2' id='placestablink'>%s</a><BR><BR>Click for more details</div>", w,htmlEscape(x), y))},
tdscountries$placeref,tdscountries$placename, SIMPLIFY = F),
popupOptions = lapply(1:nrow(tdscountries), function(x,y) {
popupOptions(direction='auto')}),weight = 0.75, group = "Countries", fillColor ="gold")
})}
我在这里输出我的 tdscountries 数据:
http://45.56.98.26/tdscountries.txt
如果这与其他问题太相似,我深表歉意——我查看了所有问题(连同 updatetabsetPanel 的官方 Shiny 文档)并试了一下,但我显然遗漏了一些东西。
更新:我已经几乎 完成了这项工作。我现在可以使用 shinyjs 在 iframe 的 xml 文档中创建 link 来切换选项卡和 link 更深的内容(如此处建议:),但相同的在我的传单弹出窗口 link 中不起作用,所以我仍在寻找解决该问题的方法。我更新了上面的信息,以防将来对任何人有帮助。
终于弄明白了,它比我想象的要简单得多,并且不需要uire shinyjs 库。答案就在这里,也适用于弹出窗口中的 links:
更新上面的代码。这有效:
ui
ui <- fluidPage(
fluidRow(
column(3,
"DATA",
tabsetPanel(id='lefttabsetPanel',
tabPanel(title='PLACES', value = "placestab",
tags$iframe(name="myiframe2",seamless="seamless",src="http://www.example.com/places.xml",height=600, width=320)
),
tabPanel(title='PEOPLE', value = "peopletab",
tags$iframe(name="myiframe",seamless="seamless",src="http://www.example.com/people.xml",height=600, width=320))
)
),
column(9,
"MAPS",
tabsetPanel(id='my_tabsetPanel',
tabPanel('Map 1',
leafletOutput(outputId="mymap", height = 600)
),
tabPanel('Map 2',
leafletOutput(outputId="mymap2", height = 600)
)
)
)
)
)
)
全球
server <- function(input,output, session){
# detect link clicked in leaflet popup and switch tabs
observeEvent(input$linkclickplaces,{
updateTabsetPanel(session, inputId="lefttabsetPanel", selected="placestab")
})
observeEvent(input$linkclickpeople,{
updateTabsetPanel(session, inputId="lefttabsetPanel", selected="peopletab")
})
data <- reactive({
x <- placeography
})
# Core wrapping function
wrap.it <- function(x, len)
{
sapply(x, function(y) paste(strwrap(y, len),
collapse = "\n"),
USE.NAMES = FALSE)
output$mymap <- renderLeaflet({
m <- leaflet() %>%
setView(lng=-3.6898447, lat=40.4142174, zoom=3 ) %>%
#MAP--SATELLITE ESRI
addProviderTiles("Esri.WorldImagery", group="Satellite") %>%
# PLACES
addPolygons(data = tdscountries,
popup = mapply(function(x, y) {
# THE LEAFLET POPUP LINK THAT CHANGES THE TAB
HTML(sprintf("<div class='leaflet-popup-scrolled' style='font-size:10px;max-width:200px;max-height:150px; '><b><a href='http://www.example.com/places.xml#%s' target='myiframe2' onclick='Shiny.onInputChange(\"linkclickplaces\", Math.random())'>%s</a><BR><BR>Click for more details</div>", w,htmlEscape(x), y))},
tdscountries$placeref,tdscountries$placename, SIMPLIFY = F),
popupOptions = lapply(1:nrow(tdscountries), function(x,y) {
popupOptions(direction='auto')}),weight = 0.75, group = "Countries", fillColor ="gold")
})}
根据您构建弹出窗口的方式link,您需要注意单引号和双引号的使用和转义。
只有一个 caveat/sticking 点——在我的例子中,传单弹出窗口中的 link 也会更新 "places" 选项卡中的 iframe,其中包含一个 link,如下所示:
<a href='http://www.example.com/places.xml#PLACEREF' target='myiframe2' onclick='Shiny.onInputChange(\"linkclickplaces\", Math.random())'>PLACE NAME</a>
我第一次单击更改选项卡的 link 时,第一次单击不会更新 iframe——第二次单击会。 (根据浏览器的不同,第一次单击会使您到达嵌入式 xml 文档的顶部或底部。)进入选项卡后,单击一次即可在其中四处移动。我正在寻找解决此问题的方法,但同时在弹出窗口中输入说明以双击 links.
在这里苦苦挣扎的 R 闪亮初学者。单击主面板中地图上标签中的 link 时,我无法掌握如何在我的双标签侧边栏(人员 | 地点)中切换标签。我从其他类似的问题中了解到 updatetabsetPanel 是可行的方法。我尝试了以下方法,当 "places" 选项卡处于活动状态时更新 iframe 效果很好,但当 "people" 选项卡处于活动状态时不会将 "places" 选项卡置于最前面。我不太清楚如何在此处使用 "a href" 来触发更改选项卡的事件。
ui
ui <- fluidPage(
fluidRow(
# ADDED SHINY JS
useShinyjs(debug = TRUE),
column(3,
"DATA",
tabsetPanel(id='lefttabsetPanel',
tabPanel(title='PLACES', value = "placestab",
tags$iframe(name="myiframe2",seamless="seamless",src="http://www.example.com/places.xml",height=600, width=320)
),
tabPanel(title='PEOPLE', value = "peopletab",
tags$iframe(name="myiframe",seamless="seamless",src="http://www.example.com/people.xml",height=600, width=320))
)
),
column(9,
"MAPS",
tabsetPanel(id='my_tabsetPanel',
tabPanel('Map 1',
# ADDED LINKS TO TABS THAT WORK
a(id="peopletablink","link to peopletab",href="http://45.56.98.26:8080/exist/rest/db/madrid/xml/tds-people.xml#PERSCELESTINA", target="myiframe"),
a(id="placestablink","link to placestab",href="http://45.56.98.26:8080/exist/rest/db/madrid/xml/tds-placeography.xml#PLACEMADRID", target="myiframe2"),
leafletOutput(outputId="mymap", height = 600)
),
tabPanel('Map 2',
leafletOutput(outputId="mymap2", height = 600)
)
)
)
)
)
)
全球
server <- function(input,output, session){
data <- reactive({
x <- placeography
})
# Core wrapping function
wrap.it <- function(x, len)
{
sapply(x, function(y) paste(strwrap(y, len),
collapse = "\n"),
USE.NAMES = FALSE)
}
# NEW SHINYJS
shinyjs::onclick("peopletablink", updateTabsetPanel(session, inputId="lefttabsetPanel", selected="peopletab"))
shinyjs::onclick("placestablink", updateTabsetPanel(session, inputId="lefttabsetPanel", selected="placestab"))
# OLD APPROACH
# observeEvent(input$place_link, {
# updateTabsetPanel(session, "lefttabsetPanel", 'placetab')
# }
# )
output$mymap <- renderLeaflet({
m <- leaflet() %>%
setView(lng=-3.6898447, lat=40.4142174, zoom=3 ) %>%
#MAP--SATELLITE ESRI
addProviderTiles("Esri.WorldImagery", group="Satellite") %>%
# PLACES
addPolygons(data = tdscountries,
popup = mapply(function(x, y) {
# THE POPUP LINK I WANT TO CHANGE THE TAB--BUT DOESN'T WORK
HTML(sprintf("<div class='leaflet-popup-scrolled' style='font-size:10px;max-width:200px;max-height:150px; '><b><a href='http://www.example.com/places.xml#%s' target='myiframe2' id='placestablink'>%s</a><BR><BR>Click for more details</div>", w,htmlEscape(x), y))},
tdscountries$placeref,tdscountries$placename, SIMPLIFY = F),
popupOptions = lapply(1:nrow(tdscountries), function(x,y) {
popupOptions(direction='auto')}),weight = 0.75, group = "Countries", fillColor ="gold")
})}
我在这里输出我的 tdscountries 数据:
http://45.56.98.26/tdscountries.txt
如果这与其他问题太相似,我深表歉意——我查看了所有问题(连同 updatetabsetPanel 的官方 Shiny 文档)并试了一下,但我显然遗漏了一些东西。
更新:我已经几乎 完成了这项工作。我现在可以使用 shinyjs 在 iframe 的 xml 文档中创建 link 来切换选项卡和 link 更深的内容(如此处建议:
终于弄明白了,它比我想象的要简单得多,并且不需要uire shinyjs 库。答案就在这里,也适用于弹出窗口中的 links:
更新上面的代码。这有效:
ui
ui <- fluidPage(
fluidRow(
column(3,
"DATA",
tabsetPanel(id='lefttabsetPanel',
tabPanel(title='PLACES', value = "placestab",
tags$iframe(name="myiframe2",seamless="seamless",src="http://www.example.com/places.xml",height=600, width=320)
),
tabPanel(title='PEOPLE', value = "peopletab",
tags$iframe(name="myiframe",seamless="seamless",src="http://www.example.com/people.xml",height=600, width=320))
)
),
column(9,
"MAPS",
tabsetPanel(id='my_tabsetPanel',
tabPanel('Map 1',
leafletOutput(outputId="mymap", height = 600)
),
tabPanel('Map 2',
leafletOutput(outputId="mymap2", height = 600)
)
)
)
)
)
)
全球
server <- function(input,output, session){
# detect link clicked in leaflet popup and switch tabs
observeEvent(input$linkclickplaces,{
updateTabsetPanel(session, inputId="lefttabsetPanel", selected="placestab")
})
observeEvent(input$linkclickpeople,{
updateTabsetPanel(session, inputId="lefttabsetPanel", selected="peopletab")
})
data <- reactive({
x <- placeography
})
# Core wrapping function
wrap.it <- function(x, len)
{
sapply(x, function(y) paste(strwrap(y, len),
collapse = "\n"),
USE.NAMES = FALSE)
output$mymap <- renderLeaflet({
m <- leaflet() %>%
setView(lng=-3.6898447, lat=40.4142174, zoom=3 ) %>%
#MAP--SATELLITE ESRI
addProviderTiles("Esri.WorldImagery", group="Satellite") %>%
# PLACES
addPolygons(data = tdscountries,
popup = mapply(function(x, y) {
# THE LEAFLET POPUP LINK THAT CHANGES THE TAB
HTML(sprintf("<div class='leaflet-popup-scrolled' style='font-size:10px;max-width:200px;max-height:150px; '><b><a href='http://www.example.com/places.xml#%s' target='myiframe2' onclick='Shiny.onInputChange(\"linkclickplaces\", Math.random())'>%s</a><BR><BR>Click for more details</div>", w,htmlEscape(x), y))},
tdscountries$placeref,tdscountries$placename, SIMPLIFY = F),
popupOptions = lapply(1:nrow(tdscountries), function(x,y) {
popupOptions(direction='auto')}),weight = 0.75, group = "Countries", fillColor ="gold")
})}
根据您构建弹出窗口的方式link,您需要注意单引号和双引号的使用和转义。
只有一个 caveat/sticking 点——在我的例子中,传单弹出窗口中的 link 也会更新 "places" 选项卡中的 iframe,其中包含一个 link,如下所示:
<a href='http://www.example.com/places.xml#PLACEREF' target='myiframe2' onclick='Shiny.onInputChange(\"linkclickplaces\", Math.random())'>PLACE NAME</a>
我第一次单击更改选项卡的 link 时,第一次单击不会更新 iframe——第二次单击会。 (根据浏览器的不同,第一次单击会使您到达嵌入式 xml 文档的顶部或底部。)进入选项卡后,单击一次即可在其中四处移动。我正在寻找解决此问题的方法,但同时在弹出窗口中输入说明以双击 links.