Cannot integrate process animation into flexdashboard and combine with process_map

[frkbr]

This is similar to this issue: #5

I cannot integrate a process animation into a flexdashboard and combine it with a process map. When knitting the following code, I get this error message under the Process map tab:

"TypeError: Cannot call a class as a function"

In the Animation tab the slider is shown moving, but the animation is not visible:

---
title: "Title"
output:
  flexdashboard::flex_dashboard
---

```{r setup, include=FALSE}
library(tidyverse)
library(bupaR)
library(flexdashboard)
library(processanimateR)
```

**Process map**
===============
```{r}
patients %>% process_map()
```

**Animation**
===========
```{r}
patients %>% animate_process()
```

When I reverse the order of the two tabs, the animation is shown and the same error message appears under the Process map tab.

When just using either the process_map or the animation alone, everything works.

I'm using the latest package versions from CRAN and the Chrome browser.

[fmannhardt]

I will have a look at this next week. This sounds like a problem with the Viz.js library that renders the graph.

[frkbr]

Just a follow-up, since I'm working on some flexdashboards, that would benefit from integrated process animation: do you have any insights so far? Or should I open an issue in a repo that deals with the Viz.js library?

[fmannhardt]

A quick status update. I have not forgotten about this. Simply not much time to spare. This is more tricky than I thought as there is also a problem when having a animation not visible on the first tab.

Not sure what is the cause for the error when using process_map, but there is also a problem when only having the animation in a tab that is not visible by default. Actually, this is related to this bumbu/svg-pan-zoom#279 in the svgPanZoom library that I am using.

[fmannhardt]

I fixed the issues with the visibility and found the cause for the second one.

DiagrammeR, the library used to render the process map in processmapR is using an older version of the viz.js library that creates the SVG of the process map via GraphViz. Unfortunately, the new API is incompatible with the old one and the global name clashes when both are loaded. I already asked the author to upgrade here rich-iannone/DiagrammeR#314 but far far no reply.

You can work around this issue by simply using processanimateR with animation mode off for all rendering of process maps.

[fmannhardt]

Could you please check with the current development version. The issue should be fixed now. I renamed some of the global functions added by processanimateR to avoid clashes. So, the old version of viz.js and the new one should live happily together.

I still see an issue when adding a Leaflet map to the Flexdashboard but this has to be fixed another time.

[frkbr]

Thanks for fixing! This seems to work now with the development version.

[fmannhardt]

Thanks for re-testing. I will release a new version on CRAN.

[kifirifis]

I did it with ggirafe package.