plotly / plotly/plotly.R

Using Plotly event data with a key on a ggplotly object

Open
#2,325 1 comment 2 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
R
Stars
2.7k
Forks
641
PR merge metrics
No merged PRs in 30d

Description

I am using Plotly in an R Shiny dashboard with event data so a user can click on a visualization and the linked table will filter to show just that data observation. In the reprex below, I have a plot made in ggplot that I converted to a Plotly object using ggplotly. This works fine, but when identifying observations using pointNumber in the event data, it misidentifies the observation that was clicked on because the plot and the table have different numbers of observations.

Because of this, I'm trying to identify observations using a "key" argument, but no matter how I define the key, it does not appear as a column in the event data. When this plot is made using Plotly to begin with, eliminating ggplot entirely, it works fine and the key column does appear. However, the visualization I need to use is a phylogenetic tree that has proven impossible to visualize in Plotly, which is why I started it off in ggplot. I have searched extensively, but I can't find a way to make event data work with a key using a ggplot -> plotly object. Is there a way to make this work?

### Load data
data(mtcars)
mtcars$index <- c(1:32)
data <- mtcars


# Define UI
ui <- fluidPage(
  titlePanel("Dashboard"),
  tags$style('.container-fluid {
                             background-color: #e3f2fd;
              }'),
  fluidRow(
    
    column(6,
           h3("Scatterplot"),
           plotlyOutput("phylo_tree")),
    
    # Metadata
    column(12, h3("Metadata")),
    column(12, DT::dataTableOutput("data_table"))
    
  )
)

# Define server logic
server <- function(input, output) {
  
  
  output$phylo_tree <- renderPlotly({
    
    # Create a scatterplot using ggplot2
    scatterplot <- ggplot(mtcars, aes(x = mpg, y = hp, label = rownames(mtcars))) +
      geom_point() +
      geom_text(nudge_y = 5, nudge_x = 1, check_overlap = TRUE) +
      labs(title = "Scatterplot of mtcars Dataset",
           x = "Miles Per Gallon (mpg)",
           y = "Horsepower (hp)") +
      theme_minimal()
    
    scatterplot <- plotly::ggplotly(scatterplot, tooltip = "text", 
                                   source = "source1", key = ~index)
    
    # Collect data when a user clicks on a point
    event_register(scatterplot, event = "plotly_selected")
    
    
    scatterplot
  })
  
  
  output$data_table <- DT::renderDataTable({
    
    # Use click event data
    click_data <- event_data("plotly_click", source = "source1")
    
    observe({
      print(event_data("plotly_click", source = "source1"))
    })
    
    # Check if any points are clicked
    if (!is.null(click_data)) {
      # Filter data based on the clicked point
      data <- data[data$index %in% click_data$key,]

    }
    
    datatable(data, 
              rownames = FALSE, 
              filter = "top",
              extensions = "Buttons",  # Add download buttons
              options = list(scrollX = TRUE, dom = "Bfrtip", 
                             buttons = c("csv", "excel", "pdf"),
                             lengthMenu = list(c(10,25,50,-1),
                                               c(10,25,50,"All"))),
              selection = list(mode = "multiple", target = "row")) %>%
      formatStyle(names(data),lineHeight='80%') 
  })
  
  
}


Edit: I solved my own problem. The key needs to be specified in the aes() argument of the ggplot code. The following ggplot code should work with the above datatable code. Note that the id variable specified here should be some unique key identifier.

# Create a scatterplot using ggplot2
    scatterplot <- ggplot(mtcars, aes(x = mpg, y = hp, label = rownames(mtcars), key = id)) +
      geom_point() +
      geom_text(nudge_y = 5, nudge_x = 1, check_overlap = TRUE) +
      labs(title = "Scatterplot of mtcars Dataset",
           x = "Miles Per Gallon (mpg)",
           y = "Horsepower (hp)") +
      theme_minimal()

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Reproduce the supplied R Shiny reprex, focusing on the ggplotly call and the plotly_click event_data path. Done means a unique key defined in the ggplot aes() is present in the event data and correctly filters the table; the issue's edit reports a working approach.

Written by the indexing model from the issue text.

Assessment

Tech stack
r
Domain
data-visualization
Issue type
Bug
Difficulty
2/5
Estimated time
1-3 hours
Activity status
Stale
Clarity
Clearly specified
Newbie friendliness
25/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.