class & classDef not working for mermaid graph?

[happyshows]

d <- "graph LR

A[Hard edge] -->|Link text| B(Round edge)
B --> C{Decision}
C -->|One| D[Result one]
C -->|Two| E[Result two]

classDef test fill:#A2EB86,stroke:#777,stroke-width:4px;
class B test;
"

mermaid(d)

[pommedeterresautee]

I was about to post the same bug. I am under Windows. Color are not displayed anymore.

I notice that this example doesn't work anymore (use class def)

# Load in the 'mtcars' dataset
data(mtcars)
connections <- sapply(
 1:ncol(mtcars)
  ,function(i){
     paste0(
        i
      ,"(",colnames(mtcars)[i],")---"
      ,i,"-stats("
      ,paste0(
        names(summary(mtcars[,i]))
        ,": "
        ,unname(summary(mtcars[,i]))
        ,collapse="<br/>"
      )
      ,")"
   )
 }
)

DiagrammeR(
   paste0(
     "graph TD;", "\n",
     paste(connections, collapse = "\n"),"\n",
     "classDef column fill:#0001CC, stroke:#0D3FF3, stroke-width:1px;" ,"\n",
     "class ", paste0(1:length(connections), collapse = ","), " column;"
   )
 )

But this example works (color are used but no class / classDef):

DiagrammeR("graph LR;A(Rounded)-->B[Squared];B-->C{A Decision};
 C-->D[Square One];C-->E[Square Two];
 style A fill:#E5E25F;  style B fill:#87AB51; style C fill:#3C8937;
 style D fill:#23772C;  style E fill:#B6E6E6;"
)

Kind regards,
Michaël

[timelyportfolio]

@happyshows and @pommedeterresautee I think mermaid will now be much easier to work with after pulls
mermaid-js/mermaid#134
mermaid-js/mermaid#135
mermaid-js/mermaid#136

I just need to do some testing.

[rich-iannone]

@pommedeterresautee @jennybc Michaël, I noticed you have some issue displaying colors and this same issue came up recently. Could you run the code in the gist at https://gist.github.com/rich-iannone/3db4fa95f27ba28fabe4 and let me know if colors display or not? Trying to diagnose the cause of this.

[timelyportfolio]

@rich-iannone I think this issue is with mermaid not grViz

[rich-iannone]

Yeah, true, and I'm probably grasping at straws, but I thought there might be some underlying reason.

[timelyportfolio]

pretty sure with big and rapid changes in mermaid that this needs to be eliminated first. hope to have fix soon.

[timelyportfolio]

actually appears to be css priority preference; can't imagine that bare mermaid is working either. Prob will have to file issue over there.

[timelyportfolio]

looks like this was partially addressed in mermaid-js/mermaid#128

[timelyportfolio]

explains why the more specific id works, but the general class name does not

[pommedeterresautee]

Installed last version from Github and it works now on my Ubuntu machine (was not working before updating, like on Windows laptop). Will try later on Windows.

[abdulkerimgok]

colors work with the github version on windows but now the arrow heads disappeared, which works with the cran version (with no color)...

another thing with the CSS styling in mermaid...I am trying the make the font larger with font-size: argument but even when you do make the font larger the problem is that the node size stays the same and the text inside nodes becomes not readable and I couldn't find a solution to make nodes larger as well..

I don't know if this is the right place for this kinds of requests but I wish I could play more with styling options in mermaid such as diagram title, node size (as mentioned above), and font size of the text between nodes along the connection lines, and possibility of adding a legend, etc..

thanks for the great package..looking forward to new features..

abdulkerim

[rich-iannone]

@abdulkerimgok there has been a request to reference a CSS stylesheet and I think it's a good feature to have (Graphviz allows this with an XML stylesheet). So, this will be worked on.

[alforj]

@rich-iannone just checking in to see if the first part of @abdulkerimgok comment above on Mar 23 regarding the arrow heads missing in windows is being wrapped up under this issue or not. Seeing the same behavior, arrow heads appear in Mavericks but not in Windows 7 (using both DiagrammeR v0.6 and github dev version).

Thanks, love the package and looking forward to implementing some of your latest grViz features into my (very nascent) 'muir' package.

[alforj]

Quick update on the "missing arrow heads" in Windows. The arrow heads are not showing in the RStudio viewer (v0.98.1103) but if I save the htmlwidget to an HTML file, the arrows appear, at least in Chrome and Firefox.