Does anybody know if DiagrammeR currently supports left- and right-justification of node labels when using GraphViz?
Here is a quick example, where I would like to left-justify the text within both of the nodes:
library(DiagrammeR)
grViz("
digraph test {
graph [fontsize = 10]
node [shape = box]
A [label = 'Foo\nBar']
B [label = 'Bar\nFoo']
A -> B
}
")
I was able to find one resource here for the native GraphViz that uses /l for left-justification, but when I try that within the grViz function I receive an error. For example:
library(DiagrammeR)
grViz("
digraph test {
graph [fontsize = 10]
node [shape = box]
A [label = 'Foo\lBar']
B [label = 'Bar\lFoo']
A -> B
}
")
I appreciate any help in advance!
You need a double backslash to escape the first slash. Here are left and right justified labels:
grViz("
digraph test {
graph [fontsize = 10]
node [shape = box]
A [label = 'Foo\\lBar\\l']
B [label = 'Bar\\rFoo\\r']
A -> B
}
")
Related
Is there anyway to create defined fixed edges directional graphs using dot notation? the following dot notation (fig 2) generates an automated edges that are curved. It doesnt have notations which will generate directions with straight edges (fig 1). Been on hours trying to find anything close, any hints will be great. thank you.
# fig 1
box A --- box B
|. \
|. \
box C. \
box D
# fig 2
digraph G {
node [shape=record];
rankdir="BT"
a -> b [color = red][arrowhead = diamond][taillabel = "tail"]
b -> c [shape = box]
c -> a
}
Not sure what a fixed edge is, but if you don't want splines for edges, look at the splines attribute (https://graphviz.org/docs/attrs/splines/).
Here is you graph with splines=false. You can also try splines=polyline.
You might also connect the edges to specific ports on one or both of the nodes (https://graphviz.org/docs/attr-types/portPos/).
# fig 2
digraph G {
node [shape=record];
// see https://graphviz.org/docs/attrs/splines/
// also look at ports https://graphviz.org/docs/attr-types/portPos/
splines=false // or try splines=polyline
rankdir="BT"
a -> b [color = red][arrowhead = diamond][taillabel = "tail"]
b -> c [shape = box]
c -> a
}
Giving:
How do you produce the following plot using the R function mermaid from the package DiagrammeR?
EDIT:
Let's just say we drop the labels "Input" and "Output" along with the red circles. The following is a minimal code for a start in R.
DiagrammeR::mermaid("
graph LR
a --> x
b --> y
c --> y
d --> z
classDef firstSet fill:#F8CECC
class a,b,c,d firstSet
")
whose output looks like this:
mermaid-mapping
Specific questions:
How does one make the edges straight and not folded?
How does one include the red circles?
Try this code below.
It's not perfect (today is the 3rd day that I started learning Mermaid.js) but it has similar elements like your example:
library(DiagrammeR)
grViz("
digraph {
graph[rankdir = LR, fontsize = 30]
edge [color = 'blue', penwidth = 3.5]
node[color = 'white', fontsize = 25]
subgraph cluster_1 {
label = 'Input'
color = 'red'
node [shape = circle]
a; b; c; d}
subgraph cluster_2 {
label = 'Output'
color = 'red'
node [shape = circle]
x; y; z}
a -> x
b -> y
c -> y
d -> z
}
")
The final outcome looks like this. I may revisit this answer later once I am more proficient.
I like to add a feedback arrow to a Graphviz graph, where the ordinary "flow" remains horizontal, but the feedback should be round, like the manually added blue arrow below.
Here is what I tried so far. I use the DiagrammR package for the R language but a suggestion for plain or python Graphviz or would of course also be helpful.
library("DiagrammeR")
grViz("digraph feedback {
graph [rankdir = 'LR']
node [shape = box]
Population
node [shape = circle]
Source Sink
node [shape = none]
Source -> Growth -> Population -> Death -> Sink
Population -> Growth [constraint = false]
Death -> Population [constraint = false]
}")
You can try using the headport and tailport options and indicate "north" for both of these (for Population and Growth).
The headport is the cardinal direction for where the arrowhead meets the node.
The tailport is the cardinal direction for where the tail is emitted from the node.
library("DiagrammeR")
grViz("digraph feedback {
graph [rankdir = 'LR']
node [shape = box]
Population
node [shape = circle]
Source Sink
node [shape = none]
Source -> Growth -> Population -> Death -> Sink
Population -> Growth [tailport = 'n', headport = 'n', constraint = false]
}")
Output
I can change the fontsize argument below to be either graph [fontsize = 1] or graph [fontsize = 10] or graph [fontsize = 100] and the output in my R Studio viewer is identical. It appears the font defaults to a reasonable size that fills the node it occupies. How do I change the font size?
library(DiagrammeR)
grViz("
digraph test {
graph [fontsize = 10]
node [shape = box]
A [label = 'FooBar']
B [label = 'BarFoo']
A -> B
}
")
You change the font size of the node labels within the node declaration.
You can change it using node: node [shape = box, fontsize=5] or in a specific node label with: A [label = 'FooBar', fontsize=5]
I would like to be able to create flowcharts with DiagrammeR in R so that I can export SVG through the devtools::install_github('rich-iannone/DiagrammeRsvg') package.
My flowcharts must include hyperlinks in some of the nodes, unfortunately I can't find an acceptable way to create node labels with functioning <a> tags. Here are the different methods I've tried:
Mermaid
Using DiagrammeR(diagram = "", type = "mermaid") it's possible to use HTML tags in the node labels:
library("DiagrammeR")
DiagrammeR("graph TB;
A{Is your data public?} -- yes -->C;
A -- no -->B[<center><b>Oxshef: dataviz</b> only supports researchers <br> in the creation of interactive data visualisations that public</center>];
C{<center>Please make it public?</center>};
D[<center>Supported!</center>];
E[<center>Unsupported!</center>];
F[Refer to our tutorial];
C -- yes -->D;
C -- no -->E;
C -- I don't know -->F")
But to use the <a> tag we need to use an = which the parser vomits over:
DiagrammeR("graph TB;
A{Is your data public?} -- yes -->C;
A -- no -->B[<center><b>Oxshef: dataviz</b> only supports researchers <br> in the creation of interactive data visualisations that public</center>];
C{<center>Please make it public?</center>};
D[<center>Supported!</center>];
E[<center>Unsupported!</center>];
F[Refer to our <a href='http://google.com'>tutorial</a>];
C -- yes -->D;
C -- no -->E;
C -- I don't know -->F")
grViz
Here's the same flowchart as above but with all html stripped out and converted to grViz:
grViz("
digraph boxes_and_circles {
# a 'graph' statement
graph [overlap = true, fontsize = 10]
# several 'node' statements
node [shape = box,
fontname = Helvetica]
A [label = 'Is your data public?']; B [label = 'Please make it public'];
C [label = 'Tech Question']; D [label = 'Supported' ];
E [label = 'Unsupported!']; F [label = 'Refer to our tutorial']
# several 'edge' statements
A->B A->C C->D [label = 'yes'] C->E [label = 'no'] C->F [label = 'Unknown']
}
")
This doesn't support HTML tags:
grViz("
digraph boxes_and_circles {
# a 'graph' statement
graph [overlap = true, fontsize = 10]
# several 'node' statements
node [shape = box,
fontname = Helvetica]
A [label = 'Is your data public?']; B [label = '<b>Please</b> make it public'];
C [label = 'Tech Question']; D [label = 'Supported' ];
E [label = 'Unsupported!']; F [label = 'Refer to our tutorial']
# several 'edge' statements
A->B A->C C->D [label = 'yes'] C->E [label = 'no'] C->F [label = 'Unknown']
}
")
create_graph
DiagrammeR also lets us create graph as follows:
ndf_no_tags <- create_node_df(n = 6,
label = c("Is your data public?",
"Please make it public",
"Tech Question",
"Supported",
"Unsupported",
"Refer to our tutorial"))
# Create an edge data frame (edf)
edf <- create_edge_df(from = c(1, 1, 3, 3, 3),
to = c(2, 3, 4, 5, 6))
ndf_no_tags %>%
create_graph(edges_df = edf) %>%
render_graph()
But it escapes HTML tags:
ndf_with_tags <- create_node_df(n = 6,
label = c("Is your data public?",
"<b>Please</b> make it public",
"Tech Question",
"Supported",
"Unsupported",
"Refer to our tutorial"))
ndf_with_tags %>%
create_graph(edges_df = edf) %>%
render_graph()
I figured it out for the mermaid function:
mermaid('
graph LR
A-->B
A-->C
C-->E
B-->D
C-->D
D-->F
E-->F
click B "http://www.github.com" "This is a link"
')
the click B <link> option requires double quotes, and thankfully R accepts single quotes for the entire mermaid code block.