Generate Multiple Graphs Side-by-Side

[yakatz]

No matter how many graphs you create, they are always stacked on top of each other. With a regular image include in Pandoc, you can make the images side-by-side:

<div id="fig:CFG1">
![Graph 1](g1.png){#fig:graph1 width=45%}
![Graph 2](g2.png){#fig:graph2 width=45%}

Two graphs
</div>

The Tex output looks like this:

\begin{pandoccrossrefsubfigures}

\subfloat[Graph 1]{\includegraphics[width=0.45\linewidth,height=\textheight,keepaspectratio]{g1.png}\label{fig:graph1}}
\subfloat[Graph 2]{\includegraphics[width=0.45\linewidth,height=\textheight,keepaspectratio]{g2.png}\label{fig:graph2}}

\caption[{Two graphs}]{Two graphs}

\label{fig:CFG1}

\end{pandoccrossrefsubfigures}

With Mermaid:

<div id="fig:CFG_classic">
``{.mermaid filename="cfg-if-then-else" caption="if/then/else" #fig:cfgsample_ite loc=generated}
flowchart TD
  if(( )) --> then(( )) --> fi(( ))
  if --> else(( )) --> fi
``

``{.mermaid filename="cfg-while" caption="while" #fig:cfgsample_w loc=generated}
flowchart TD
  while(( )) --> do(( )) --> while
  while --> done(( ))
``

Two graphs
</div>

I modified mermaid-filter's filter.js to add a width attribute:

    return pandoc.Para(
        [
            pandoc.Image(
                [id, imageClasses, [["width", "45%"]]],
                [pandoc.Str(options.caption)],
                [newPath, fig]
            )
    ]);

That produces this Tex output which still shows the images on top of each other.

\begin{pandoccrossrefsubfigures}

\subfloat[if/then/else]{\includegraphics[width=0.45\linewidth,height=\textheight,keepaspectratio]{generated/cfg-if-then-else.png}\label{fig:cfgsample_ite}}

\subfloat[while]{\includegraphics[width=0.45\linewidth,height=\textheight,keepaspectratio]{generated/cfg-while.png}\label{fig:cfgsample_w}}

\caption[{Two graphs}]{Two graphs}

\label{fig:CFG_classic}

\end{pandoccrossrefsubfigures}

The only major difference I see between them is the blank lines.

Is there any way to make this work?