Giter Site home page Giter Site logo

interactive network plot about statnetweb HOT 23 CLOSED

ebey avatar ebey commented on August 28, 2024
interactive network plot

from statnetweb.

Comments (23)

skyebend avatar skyebend commented on August 28, 2024

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.

from statnetweb.

ebey avatar ebey commented on August 28, 2024

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.

from statnetweb.

skyebend avatar skyebend commented on August 28, 2024

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

from statnetweb.

ebey avatar ebey commented on August 28, 2024

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

from statnetweb.

skyebend avatar skyebend commented on August 28, 2024

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)

from statnetweb.

skyebend avatar skyebend commented on August 28, 2024

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?

from statnetweb.

ebey avatar ebey commented on August 28, 2024

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.

from statnetweb.

ebey avatar ebey commented on August 28, 2024

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

from statnetweb.

skyebend avatar skyebend commented on August 28, 2024

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

from statnetweb.

ebey avatar ebey commented on August 28, 2024

@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.

from statnetweb.

skyebend avatar skyebend commented on August 28, 2024

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.

from statnetweb.

ebey avatar ebey commented on August 28, 2024

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.

from statnetweb.

skyebend avatar skyebend commented on August 28, 2024

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?)

from statnetweb.

ebey avatar ebey commented on August 28, 2024

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!

from statnetweb.

ebey avatar ebey commented on August 28, 2024

@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.

from statnetweb.

skyebend avatar skyebend commented on August 28, 2024

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.

from statnetweb.

skyebend avatar skyebend commented on August 28, 2024

html widgets ndtv now deployed on CRAN

from statnetweb.

ebey avatar ebey commented on August 28, 2024

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!

from statnetweb.

skyebend avatar skyebend commented on August 28, 2024

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

from statnetweb.

skyebend avatar skyebend commented on August 28, 2024

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.

from statnetweb.

skyebend avatar skyebend commented on August 28, 2024

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

from statnetweb.

ebey avatar ebey commented on August 28, 2024

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

from statnetweb.

martinamorris avatar martinamorris commented on August 28, 2024
  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

from statnetweb.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.