knitr::opts_chunk$set( collapse = TRUE, comment = "#>", warning = FALSE ) library(htmltools) library(sigmajs)
sigmajs
lets you add buttons to trigger events, in static documents.
Events that can be triggered via a button (corresponding function name minus sg_
):
force_start
force_stop
noverlap
drag_nodes
relative_size
add_nodes
add_edges
add_nodes_edges
drop_nodes
drop_edges
animate
export_svg
export_img
progress
read_exec
You will examples of the above scattered throughout the documentation.
A button to export the graph as SVG, not that you can export to an image (png, jpeg, gif or tiff).
nodes <- sg_make_nodes() edges <- sg_make_edges(nodes) sigmajs() %>% sg_nodes(nodes, id, size, color) %>% sg_edges(edges, id, source, target) %>% sg_layout() %>% sg_export_svg() %>% sg_button( "export_svg", # event to trigger class = "btn btn-default", tag = tags$a, tags$i(class = "fa fa-download") )
You can also trigger mutliple events with the button by passing a vector of events to event
. Below we add a button that will start the forceAtlas2 layout and stop it after 3 seconds.
sigmajs() %>% sg_nodes(nodes, id, size, color) %>% sg_edges(edges, id, source, target) %>% sg_force_start() %>% sg_force_stop(3000) %>% sg_button( c("force_start", "force_stop"), class = "btn btn-success", tag = tags$a, tags$i(class = "fa fa-play"), "layout" # only use icon if document imports fontawesome )
Since version 1.1.2
you can add multiple buttons, and a single button can trigger multiple events.
# initial nodes nodes <- sg_make_nodes() # additional nodes nodes2 <- sg_make_nodes() nodes2$id <- as.character(seq(11, 20)) # add delay nodes2$delay <- runif(nrow(nodes2), 500, 1000) nodes2$text <- seq.Date(Sys.Date(), Sys.Date() + 9, "days") sigmajs() %>% sg_nodes(nodes, id, label, size, color) %>% sg_add_nodes(nodes2, delay, id, label, size, color) %>% sg_progress(nodes2, delay, text, tag = tags$h3) %>% sg_force() %>% sg_button(c("add_nodes", "progress"), "add", tag = tags$a, position = "bottom") %>% sg_button("force_start", "force", tag = tags$a, position = "bottom")
Add the following code to your website.
For more information on customizing the embed code, read Embedding Snippets.