GoogleVis scatter plot with Shiny

shiny
1

Hi all,

I am using googleVis to put a scatter plot in to my Shiny app and I was wondering if anyone knew how to change the info displayed when you hover the mouse over a dot on the graph? Currently it just displays the x and y values but ideally I'd like it to display a different column from the data frame.

Thanks,

Dan

2

Check out Using Roles vis googleVis, it seems to address your use case:
https://cran.r-project.org/web/packages/googleVis/vignettes/Using_Roles_via_googleVis.html

image
image1664Ă—864 48.7 KB

With more detail in the Column Roles docs from Google:

1 Like
3

Thanks Mara, sorry to be stupid but because I'm doing a scatter plot I can only feed in a data frame with 2 vars.

As I'm doing it on a Shiny app I'm also using reactive to refresh the data frame (I've copied the relevant bits of code below).
I've tried a few different approaches from your link but can't get it working...

graph_data <- reactive({epl_in[, c(input$xvar, input$yvar)]})
    
output$plot <- renderGvis({
    gvisScatterChart(graph_data(),
                     options=list(legend = "none",
                                  title = paste('Scatter plot of ',input$xvar, ' by ',input$yvar),
                                  vAxis = paste("{title: '", input$yvar, "'}"),
                                  hAxis = paste("{title: '", input$xvar, "'}"),
                                  width = 800,
                                  height = 600))
})
4

Not sure I follow what the issue is.
I think you’ll increase the chances of getting good advice with a minimal reproducible example of the shiny app that produces your issue. If the shiny app doesn’t cause any issue and is surperflous to your question, just a reprex of the interactive plot would make things easier.
Could you also explain a bit more what you’re hoping to get and what you’ve tried and failed?

For interactive plots, the options I see most used are working with plotly, googleVis, dygraph (https://rstudio.github.io/dygraphs/), highcharts or ggvis.

1 Like
5

I’m not sure I follow this bit? As described in the documentation @mara linked, the way that Google Charts specify annotations such as hovertext is via additional columns in the data (here, in the data frame). So you can definitely feed a data frame with more than two variables into gvisScatterChart! However, the additional variables have to be named according to a certain pattern in order to be interpreted as anything other than additional data series.

Is the problem that you’re not sure how to include these extra columns in your data frame given that your data columns are chosen interactively in your shiny app?

6

Thanks for the help, I'm obviously not being clear enough.
Currently when I hover over a point it just displays the name of the y variable I'm feeding in as well as the x,y co-ordinates. What I would like is for it to display another column (called 'name') from the data frame when I hover over a point on the graph. I've tried this now but get an error:

graph_data <- reactive({epl_in[, c(input$xvar, input$yvar, foo.blah.tooltip <- epl_in$name)]})


output$plot <- renderGvis({
    gvisScatterChart(graph_data(),
                     options=list(legend = "none",
                                  title = paste('Scatter plot of ',input$xvar, ' by ',input$yvar),
                                  vAxis = paste("{title: '", input$yvar, "'}"),
                                  hAxis = paste("{title: '", input$xvar, "'}"),
                                  width = 800,
                                  height = 600))
})
7

I have solved it now, thanks for the help. My code probably isn't the most efficient but I'm glad its working:

graph_data <- reactive({
    names(epl_in)[1] <- 'foo.blah.tooltip'
    epl_in[, c(input$xvar, input$yvar, "foo.blah.tooltip")]
    })

output$plot <- renderGvis({
    gvisScatterChart(graph_data(),
                     options=list(legend = "none",
                                  title = paste('Scatter plot of ',input$xvar, ' by ',input$yvar),
                                  vAxis = paste("{title: '", input$yvar, "'}"),
                                  hAxis = paste("{title: '", input$xvar, "'}"),
                                  width = 800,
                                  height = 600))
})
2 Likes
8

If your question's been answered (even if by you), would you mind choosing a solution? (see FAQ below for how) It makes it a bit easier to visually navigate the site and see which questions still need help.

Thanks