Tonight I’m trying out the DiagrammeR R package, one of the html widgets javascript bindings for R. I happen to be trying to make a copule flowcharts for research right now, and I figure this is a good way to procrastinate while feeling like I’m learning something.

install.packages("DiagrammeR")
library(DiagrammeR)

What’s inside?

ls("package:DiagrammeR")
##   [1] "%>%"                          "add_balanced_tree"           
##   [3] "add_cycle"                    "add_edge"                    
##   [5] "add_edge_df"                  "add_edges_from_table"        
##   [7] "add_edges_w_string"           "add_full_graph"              
##   [9] "add_global_graph_attrs"       "add_n_nodes"                 
##  [11] "add_n_nodes_ws"               "add_node"                    
##  [13] "add_node_df"                  "add_nodes_from_df_cols"      
##  [15] "add_nodes_from_table"         "add_path"                    
##  [17] "add_prism"                    "add_star"                    
##  [19] "add_to_series"                "cache_edge_attrs"            
##  [21] "cache_edge_attrs_ws"          "cache_edge_count_ws"         
##  [23] "cache_node_attrs"             "cache_node_attrs_ws"         
##  [25] "cache_node_count_ws"          "clear_global_graph_attrs"    
##  [27] "clear_selection"              "colorize_edge_attrs"         
##  [29] "colorize_node_attrs"          "combine_edfs"                
##  [31] "combine_graphs"               "combine_ndfs"                
##  [33] "copy_edge_attrs"              "copy_node_attrs"             
##  [35] "create_complement_graph"      "create_edge_df"              
##  [37] "create_graph"                 "create_node_df"              
##  [39] "create_random_graph"          "create_series"               
##  [41] "create_subgraph_ws"           "delete_edge"                 
##  [43] "delete_edges_ws"              "delete_global_graph_attrs"   
##  [45] "delete_node"                  "delete_nodes_ws"             
##  [47] "DiagrammeR"                   "DiagrammeROutput"            
##  [49] "do_bfs"                       "do_dfs"                      
##  [51] "drop_edge_attrs"              "drop_node_attrs"             
##  [53] "edge_count"                   "edge_info"                   
##  [55] "edge_present"                 "edge_rel"                    
##  [57] "export_csv"                   "export_graph"                
##  [59] "from_adj_matrix"              "from_igraph"                 
##  [61] "generate_dot"                 "get_all_connected_nodes"     
##  [63] "get_articulation_points"      "get_betweenness"             
##  [65] "get_bridging"                 "get_cache"                   
##  [67] "get_closeness"                "get_cmty_edge_btwns"         
##  [69] "get_cmty_fast_greedy"         "get_cmty_l_eigenvec"         
##  [71] "get_cmty_louvain"             "get_cmty_walktrap"           
##  [73] "get_common_nbrs"              "get_constraint"              
##  [75] "get_degree_distribution"      "get_degree_histogram"        
##  [77] "get_dice_similarity"          "get_eccentricity"            
##  [79] "get_edge_attrs"               "get_edge_df"                 
##  [81] "get_edge_ids"                 "get_edges"                   
##  [83] "get_global_graph_attrs"       "get_graph_diameter"          
##  [85] "get_graph_from_series"        "get_graph_name"              
##  [87] "get_graph_time"               "get_jaccard_similarity"      
##  [89] "get_min_spanning_tree"        "get_nbrs"                    
##  [91] "get_node_attrs"               "get_node_df"                 
##  [93] "get_node_ids"                 "get_non_nbrs"                
##  [95] "get_paths"                    "get_periphery"               
##  [97] "get_predecessors"             "get_s_connected_cmpts"       
##  [99] "get_selection"                "get_similar_nbrs"            
## [101] "get_successors"               "get_w_connected_cmpts"       
## [103] "graph_count"                  "graph_info"                  
## [105] "grViz"                        "grVizOutput"                 
## [107] "image_icon"                   "import_graph"                
## [109] "invert_selection"             "is_graph_connected"          
## [111] "is_graph_directed"            "is_graph_empty"              
## [113] "join_edge_attrs"              "join_node_attrs"             
## [115] "layout_nodes_w_string"        "mermaid"                     
## [117] "mk_cond"                      "mutate_edge_attrs"           
## [119] "mutate_node_attrs"            "node_count"                  
## [121] "node_info"                    "node_present"                
## [123] "node_type"                    "nudge_node_positions_ws"     
## [125] "recode_edge_attrs"            "recode_node_attrs"           
## [127] "remove_from_series"           "rename_edge_attrs"           
## [129] "rename_node_attrs"            "renderDiagrammeR"            
## [131] "render_graph"                 "render_graph_from_series"    
## [133] "renderGrViz"                  "replace_in_spec"             
## [135] "rescale_edge_attrs"           "rescale_node_attrs"          
## [137] "rev_edge_dir"                 "rev_edge_dir_ws"             
## [139] "select_edges"                 "select_edges_by_edge_id"     
## [141] "select_edges_by_node_id"      "select_last_edge"            
## [143] "select_last_node"             "select_nodes"                
## [145] "select_nodes_by_degree"       "select_nodes_by_id"          
## [147] "select_nodes_in_neighborhood" "select_rev_edges_ws"         
## [149] "series_info"                  "set_cache"                   
## [151] "set_edge_attrs"               "set_edge_attrs_ws"           
## [153] "set_global_graph_attrs"       "set_graph_name"              
## [155] "set_graph_time"               "set_graph_undirected"        
## [157] "set_node_attrs"               "set_node_attrs_ws"           
## [159] "set_node_attr_to_display"     "set_node_position"           
## [161] "subset_series"                "to_igraph"                   
## [163] "trav_both"                    "trav_both_edge"              
## [165] "trav_in"                      "trav_in_edge"                
## [167] "trav_in_node"                 "trav_out"                    
## [169] "trav_out_edge"                "trav_out_node"               
## [171] "trigger_script"               "visnetwork"                  
## [173] "vivagraph"                    "x11_hex"

Following the video on the website

grViz("
  digraph boxes_and_circles{
  
  node [shape = box]
  A; B; C; D
  
  
  }
      ")

The video is nice, but to really learn how to use the package check out the docs on the website. There are apparently two graphing engines the packages uses, grViz and mermaid. As an exercise to get familiar with the package, I’ll try using both to diagram a hierarchical model from my Bayes homework.

grViz("
digraph bayesModel {
graph [overlap = true, fontsize = 10]

  # I'll make the data a triangle
  node [shape = triangle,
        fontname = Helvetica]
  y
  
  # parameters will be boxes
  node [shape = box,
        fontname = Helvetica]
  theta; sigma2; mu; tau2; lambda; phi2; psi; 
  delta; gamma; omega2; c; d

  # distributions will be circles.
  node [shape = circle,
        fixedsize = false,
        width = 0.9] // sets as circles
  normal1 normal2 normal3 normal4 invGamma1 invGamma2

  # several 'edge' statements
  {gamma omega2}->normal1->lambda 
  {c d}->invGamma1->phi2
  {lambda phi2}->normal2->mu
  {psi delta}->invGamma2->tau2
  {mu tau2}->normal3->theta
  {theta sigma2}->normal4->y
}
")

Here’s mermaid [edit: this is a screenshot, since the auto-generated javascript was messing up the formatting of my RMarkdown rendering]:

mermaid("
graph TD
  a[gamma]-->c(normal1)
  b[omega2]-->c(normal1)
  c-->d[lambda]
  e[c]-->g(invGamma1)
  f[d]-->g(invGamma1)
  g-->h[phi2]
  d-->k(normal2)
  h-->k(normal2)
  k-->l[mu]
  m[psi]-->o(invGamma2)
  n[delta]-->o(invGamma2)
  o(invGamma2)-->p[tau2]
  l-->q(normal3)
  p-->q(normal3)
  q-->r[theta]
  r-->t(normal4)
  s[sigma2]-->t(normal4)
  t-->u>y]
")
Mermaid Diagram

Mermaid Diagram

I can’t say I found this particularly efficient–mermaid felt especially cumbersome to code, despite straightforward syntax–but it’s possible that with practice I could find it useful. Or that there are shortcuts that I’m missing. Also it was unclear whether important things like LaTeX math are supported. I do like the output though.