quarto-dev / quarto-dev/quarto-cli

Tikz diagram does not render in HTML if PDF is also an output format unless `keep-tex` is set to `true`

Open
#11,566 4 comments 0 reactions 1 assignee View on GitHub

@cderv is already working on this.

Since Nov 29, 2024.

bug files
Dominant language
JavaScript
Stars
6k
Forks
458
Avg merge
1d 9h
Merged PRs (30d)
41

Description

Bug description

I am using the pandoc-ext/diagram extension to draw TikZ figures. My intended output formats are both HTML and PDF.

If I enable only one output format then there is no problem. But if I enable both (HTML and PDF) output formats then the TikZ figure does not render in the HTML output unless keep-tex is set to to true for the pdf format.

Steps to reproduce

Because the issue is related to files, specifically, the creation of a filename_files subdirectory in the output directory, I am including two files in the reproducible example below.

In a project directory, install the pandoc-ext/diagram extension:

quarto add pandoc-ext/diagram

Create a _quarto.yml with the following contents:

project:
  type: book
  output-dir: docs

book:
  title: "TikZ example"
  chapters:
    - index.qmd

filters:
  - diagram

format:
  html: {}
  pdf:
    #keep-tex: true
    pdf-engine: xelatex

Create a index.qmd with the following contents:

# Example

This renders TiKZ diagrams in markdown.

``` {.tikz}
%%| label: delta-graph
%%| filename: delta-graph.pdf
%%| alt: Diagram showing how the delta-graph relates to the other graphs.
\tikzset{cat object/.style=   {node distance=4em}}

\begin{tikzpicture}[]
\node [cat object] (Del)                {$D$};
\node [cat object] (L)   [below of=Del] {$X$};
\node [cat object] (I)   [right of=L]   {$I$};
\node [cat object] (F)   [left of=L]    {$F$};

\draw [->] (Del) to node [left,near end]{$\scriptstyle{d_X}$}     (L);
\draw [->] (I)   to node [below]        {$\scriptstyle{x}$}       (L);
\draw [->] (Del) to node [above left]   {$\scriptstyle{d_{F}}$} (F);

\draw [->,dashed] (Del) to node {/}(I);
\end{tikzpicture}

Render the output with the following command:

quarto render
Expected behavior

When opening index.html in a web browser it should render the TikZ image.

Actual behavior

The TikZ image is not rendered in the HTML unless keep-tex is set to true as a pdf format option.

Your environment

-OS: macOS 15.1.1

Quarto check output
Quarto 1.6.33
[✓] Checking environment information...
      Quarto cache location: /Users/asheikh/Library/Caches/quarto
[✓] Checking versions of quarto binary dependencies...
      Pandoc version 3.4.0: OK
      Dart Sass version 1.70.0: OK
      Deno version 1.46.3: OK
      Typst version 0.11.0: OK
[✓] Checking versions of quarto dependencies......OK
[✓] Checking Quarto installation......OK
      Version: 1.6.33
      Path: /Applications/quarto/bin

[✓] Checking tools....................OK
      TinyTeX: (not installed)
      Chromium: (not installed)

[✓] Checking LaTeX....................OK
      Using: Installation From Path
      Path: /Library/TeX/texbin
      Version: 2024

[✓] Checking basic markdown render....OK

[✓] Checking Python 3 installation....OK
      Version: 3.13.0
      Path: /Users/asheikh/dev/python3venv/bin/python3
      Jupyter: 5.7.2
      Kernels: python3

[✓] Checking Jupyter engine render....OK

[✓] Checking R installation...........OK
      Version: 4.4.2
      Path: /Library/Frameworks/R.framework/Resources
      LibPaths:
        - /Library/Frameworks/R.framework/Versions/4.4-x86_64/Resources/library
      knitr: 1.49
      rmarkdown: 2.29

[✓] Checking Knitr engine render......OK

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.