Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

interactive network plot #44

Closed
ebey opened this issue Jul 14, 2015 · 23 comments
Closed

interactive network plot #44

ebey opened this issue Jul 14, 2015 · 23 comments

Comments

@ebey
Copy link
Collaborator

ebey commented Jul 14, 2015

No description provided.

@skyebend
Copy link
Contributor

ndtv can now render interactive plots (even for static networks). May need a bit of tweaking to add an appropriate reactive widget to use inside a shiny app, but that is something on my todo, so let me know your specs and I can work on it.

@ebey
Copy link
Collaborator Author

ebey commented Jul 14, 2015

That sounds great, Skye. Maybe these new shiny updates will make things easier:
http://blog.rstudio.org/2015/06/16/shiny-0-12-interactive-plots-with-ggplot2/

Right now I'm hoping to be able to see the attributes of a selected node (either on click or hover). I don't think it's necessary for the user to be able to drag nodes.

@skyebend
Copy link
Contributor

here is the ndtv-d3 vignette, the static example with interaction and attributes in tooltips is at the end: http://statnet.csde.washington.edu/workshops/SUNBELT/current/ndtv/ndtv-d3_vignette.html

Do you think it is simpler for me to develop a plot widget on a toy shiny app, or directly in a branch of statnetWeb

@ebey
Copy link
Collaborator Author

ebey commented Jul 14, 2015

Nice! Probably simpler to make a widget outside of the whole app.

@skyebend
Copy link
Contributor

I don't think is is properly a widget, but I did create a basic shiny app that loads an interactive view of the network: https://statnet.csde.washington.edu/trac/browser/statnet_commons/ndtv/trunk/staticNetShinyTest

however, it only works when viewed in a browser (not directly in Rstudio)

@skyebend
Copy link
Contributor

If it seems like what you had in mind, I could work on a branch you could pull from. Since I'd worry that it might not always work, would needs a checkbox to the plot UI to enable/disable interactivity. But would this mean the ui script would need to somehow need to know to toggle from existing plotOutput to HTMLoutput? Would the node tool tip just be a simple table of all the vertex attributes and their values?

@ebey
Copy link
Collaborator Author

ebey commented Jul 24, 2015

Nice! Definitely go ahead and make a branch to incorporate this into the rest of the app. The only thing I'm wondering right now is if it's possible to hide the attribute list on double click, because it blocks the view of which nodes are highlighted.

The ui script could have buttons for "static plot" and "interactive plot" that the user can toggle (similar to the buttons for the y-axis units of the degree distribution), and corresponding conditionalPanels that hold plotOutput and HTMLoutput, respectively.

@ebey
Copy link
Collaborator Author

ebey commented Jul 24, 2015

Will the interactive plot be able to use the inputs from the color coding and sizing menus?

@skyebend
Copy link
Contributor

it takes mostly the same arguments as plot.network so (barring the inevitable unexpected gotchas) color and sizing should work the same ... although it wouldn't have a way to render the legend. But hopefully the interactivity will make it less necessary

@ebey
Copy link
Collaborator Author

ebey commented Jul 28, 2015

@skyebend Is there a specific way to style the tooltip? I tried adding a section for class "tooltip" in my CSS style sheet, but it is not getting applied.

Also, I was experimenting the vertex.css.class and vertex.label.css.class properties, but I can't figure out what type of arguments they expect.

@skyebend
Copy link
Contributor

Oh shoot, just realized that when implemented this way it is loaded into an iframe, so probably the app's css doesn't actually apply to it. Probably have either hardcode the css when the html is exported in the server.R file, or I have to learn more about the shiny environment to determine if there is a way to pass the ndtv-d3 player's scripts into the page header so that it could be directly embedded in a div instead of via iframe src.

@ebey
Copy link
Collaborator Author

ebey commented Jul 30, 2015

One more thing: I just tested deploying to shinyapps.io and the interactive plot doesn't work. The outline of the frame appears but nothing loads inside it. I don't know enough about the iframes you're using to know why this is, but this might be another argument for trying to embed the plot in a div?

I moved the commits from master to a branch called activeplot to await further updates.

@skyebend
Copy link
Contributor

Ok, I'll look into the embed, but probably means it will require waiting until I can make another ndtv release. Is there a way I can test on the shiny apps server to see what is going on? (do we have a staging location?)

@ebey
Copy link
Collaborator Author

ebey commented Jul 31, 2015

I have a basic (free) shinyapps account that I test new features on before
moving them to the statnet account. Since it is linked to my github account
it might be better to make a similar account for yourself rather than
sharing it. To publish an app to shinyapps from RStudio there will be a
circular blue button at the top of your server and ui scripts.

Thanks!

@ebey
Copy link
Collaborator Author

ebey commented Aug 31, 2015

@skyebend Shiny recently added some interactive features that can be used with R base graphics, see here for examples http://shiny.rstudio.com/gallery/plot-interaction-advanced.html
If you want to check it out, I've been playing around with these in the "ebactiveplot" branch to see if I can replicate the functionality of your ndtv widget. It might be useful to see how shiny handles these things, or they might make the interesting parts to you too invisible, in which case I would be unnecessarily duplicating work that you're already doing. Feel free to tell me if it's the latter.

@skyebend
Copy link
Contributor

I think it would be a lot of work to replicate the ndtv-d3 interactivity, but still may be really useful if users just want to be able to identify vertices and don't want to mess with loading ndtv.

BTW, I've got the htmlWidget wrapper working on ndtv trunk

library(ndtv)
data(short.stergm.sim)
render.d3movie(short.stergm.sim,output.mode='htmlWidget')

It works much better than the iFrame for displaying in knitr, and it works in the Rstudio plot window, and I made a shiny demo that at least works locally (need to migrate my trunk to github before I can test deployment). However, I still need to work out some issues with resizing, as changing browser window shape make it get messed up.

@skyebend
Copy link
Contributor

html widgets ndtv now deployed on CRAN

@ebey
Copy link
Collaborator Author

ebey commented Nov 4, 2015

Apologies for the late response on this, but it looks great! I'm working on starting an app for stergm right now so this will be very valuable.

Some issues I'm having:

Passing in a static network disables the movie controllers, but is it possible to hide them? (The playControls argument had no effect)
The vertex.tooltip argument was not recognized.

Am I using it in these arguments in the right way?

render.d3movie(flobusiness, output.mode='htmlWidget', 
               d3.options=list(playControls = FALSE, slider = FALSE), 
               plot.par = list(vertex.tooltip = "testlabel"))

Also, I can get the plot to load in the RStudio viewer, but not in a shiny app. I've tried output$ndtvplot <- render.d3movie(...) and output$ndtvplot <- renderPlot( render.d3movie(...)). Is there something else I'm missing?

Thanks!

@skyebend
Copy link
Contributor

skyebend commented Nov 4, 2015

the vertex.tooltip argument is passed in as a regular argument to (i.e, not via plot par)

here is my example/test code for the htmlwidget+shiny app

https://statnet.csde.washington.edu/trac/browser/statnet_commons/ndtv/trunk/htmlWidgetShinyTest

This is for the 'interactive' version. I'm updating the code for the static one, will add that in a sec

@skyebend
Copy link
Contributor

skyebend commented Nov 4, 2015

I've updated the static example,

https://statnet.csde.washington.edu/trac/browser/statnet_commons/ndtv/trunk/staticNetShinyTest

but I see the bug you reported. movie controls and slider hidden when it renders in the Rstudio plot device or rmarkdown, but they are not hiding when shown in shiny app. And even worse, when the shiny app re-renders, it doesn't delete the old graph and play controllers, just appends a new one below it.

Also, I'm worried that render requires calling a hidden ndtv method via :::, which could cause problems when final app is deployed to CRAN.

@skyebend
Copy link
Contributor

skyebend commented Nov 6, 2015

OK, i've updated the ndtv trunk version with several fixes:

  • fixed a json encoding problem with htmlwidgets that was breaking the d3 settings, this was causing the movie controllers to fail to hide
  • fixed re-render issues so that it correctly deletes the old render before loading a new one
  • found an issues where changes to shiny's bootstrap css where making the tooltip opacity 0, so it was invisible when deployed as a shiny app. The current work-around is to overwride the css in the api ui construction with tags$style(HTML(".tooltip {opacity: 1}")),

I've updated the example shiny apps in the links above. I think CRAN would let me deploy a new ndtv version in a few days, but I'd like to make sure everything is working for statnetWeb first

@ebey
Copy link
Collaborator Author

ebey commented Nov 7, 2015

Sounds great. I use the svn so infrequently that I've forgotten how to
install a package from the trunk...any tips?

@martinamorris
Copy link
Member

martinamorris commented Nov 7, 2015

  1. you can use Rstudio, set up a project from an SVN repo (just like from
    a GitHub repo) and update/commit working copies. if you want to go this
    route, lmk and i'll send you the urls you need
  2. or, you can just install this one package from the repo, instructions
    here:

https://statnet.org/trac/wiki/StatnetRepository

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

3 participants