Two graphs in line-blocks

[BaljaaSS]

I am trying to display two graphs in parallel. Even when two Graphviz are put in different div. It only shows one. How can I fix this?

Here is my code.

`import dash_interactive_graphviz import dash import dash_html_components as html

app = dash.Dash(name)

initial_dot_source = """ digraph { node[style="filled"] a ->b->d a->c->d } """

initial_dot_source1 = """ digraph { node[style="filled"] a ->b->e a->c->d } """

app.layout = html.Div( [ html.Div( dash_interactive_graphviz.DashInteractiveGraphviz(id="gv", dot_source=initial_dot_source, fit_button_content=True), style=dict(display="flex", border="1px solid red", flexGrow=1, position="relative"), ), html.Div( dash_interactive_graphviz.DashInteractiveGraphviz(id="gv1", dot_source=initial_dot_source1, fit_button_style=True), style=dict(display="flex", border="1px solid blue", flexGrow=1, position="relative"), ), ], style=dict(position="absolute", height="100%", width="100%", display="flex"), )

if name == "main": app.run_server(debug=True) `

[BaljaaSS]

CSS is correct but somehow it is not shown. What could be the problem?

[florian-burri-csem]

Same issue. Did you find a workaround?

[DeKi90]

I had come across that same issue, but forgot to raise it as an issue, when I created #21. The problem is in the react code, the component's graph doesn't have a unique id so you end up with only one being rendered.