r leaflet crosstalk select single marker without shiny

Viewed 839

is it possible to create an interactive html document without using shiny, in which I can select one single marker on a map (leaflet htmlwidget), so the corresponding observation is highlighted/selected in another htmlwidget?

What I have so far in a flexdashboard:

  • a leaflet map and
  • a d3scatter plot
  • using the same SharedData utilizing crosstalk

Now the leaflet map already offers me a selection tool with wich I can draw a rectangle to select multiple points - these get highlighted in the scatterplot. The same works vise versa.

How can I choose only one marker/data point and get the same result? Alternatively I would like to use a table instead of a scatterplot. In the end I'd like to be able to getting any information I want in that box. (Could one idea be to use the leaflet popup - and edit the popup position that way that it appears next to the map instead of on top?)

I would like to avoid shiny and do it all html/javascript based so everyone I send the html to can see the dashboard without the necessity of having R.

Thank you!

MWE:

---
title: "Leaflet crosstalk"
output: 
  flexdashboard::flex_dashboard:
    orientation: columns
    vertical_layout: fill
---

```{r setup, include=FALSE}
library(flexdashboard)
library(leaflet)
library(crosstalk)
```

Column {data-width=650}
-----------------------------------------------------------------------
### Map crosstalk

```{r leaflet crosstalk, echo=FALSE, message=FALSE, warning=FALSE}
#initialize crosstalking shared Data
shared.stations <- SharedData$new(quakes)

# initialize leaflet and add Tiles to see a map
leaflet(shared.stations) %>%
  addTiles() %>%
  addMarkers()

```

Column {data-width=350}
-----------------------------------------------------------------------
### scatter crosstalk

```{r}
library(d3scatter)
d3scatter(shared.stations, width = "100%", height = 400, ~depth, ~lat)
```
0 Answers
Related