Asciidoctor-vscode does not display `tikz` images or graphviz images in preview

[00krishna]

trafficstars

Please provide details about:

• What you're trying to do

I am trying to write an Asciidoc file for export to both pdf and html. I want to include both tikz and graphviz images in the output files. Right now, I can use the asciidoctor command line interface and generate the document including diagrams using asciidoctor-diagram. However, in the vscode extension, I cannot see the actual diagrams, but only the diagram text. So the the extension seems to not be processing the diagrams--or I am doing something incorrectly.

Graphviz should be available under the Kroki processor, and tikz is from latex and not Kroki. I have the use kroki to generate diagrams setting checked in the configuration for the extension. Not sure if I missed anything in doing that.

• What happened I have an MWE to check image generation. The code is below. I run this code through asciidoctor cli and it works fine, but the diagrams do not appear in the preview.

= AsciiDoc Article Title
self <[email protected]>
3.0, July 29, 2022: AsciiDoc article template
:toc:
:icons: font
:source-highlighter: rouge
:stem: latexmath
:kroki-fetch-diagram:


== Tikz testing 

[tikz,"image1",svg]
----
\begin{tikzpicture}

\draw (-2,0) -- (2,0);
\filldraw [gray] (0,0) circle (2pt);
\draw (-2,-2) .. controls (0,0) .. (2,-2);
\draw (-2,2) .. controls (-1,0) and (1,0) .. (2,2);

\end{tikzpicture}
----


== Graphviz testing

[graphviz, target=diagram-classes, format=svg]   
....
digraph mygraph {
  fontname="Helvetica,Arial,sans-serif"
  node [fontname="Helvetica,Arial,sans-serif"]
  edge [fontname="Helvetica,Arial,sans-serif"]
  node [shape=box];
  "//absl/random:random"
  "//absl/random:random" -> "//absl/random:distributions"
  "//absl/random:random" -> "//absl/random:seed_sequences"
  "//absl/random:random" -> "//absl/random/internal:pool_urbg"
  "//absl/random:random" -> "//absl/random/internal:nonsecure_base"
  "//absl/random:distributions"
  "//absl/random:distributions" -> "//absl/strings:strings"
  "//absl/random:seed_sequences"
  "//absl/random:seed_sequences" -> "//absl/random/internal:seed_material"
  "//absl/random:seed_sequences" -> "//absl/random/internal:salted_seed_seq"
  "//absl/random:seed_sequences" -> "//absl/random/internal:pool_urbg"
  "//absl/random:seed_sequences" -> "//absl/random/internal:nonsecure_base"
  "//absl/random/internal:nonsecure_base"
  "//absl/random/internal:nonsecure_base" -> "//absl/random/internal:pool_urbg"
  "//absl/random/internal:nonsecure_base" -> "//absl/random/internal:salted_seed_seq"
  "//absl/random/internal:nonsecure_base" -> "//absl/random/internal:seed_material"
  "//absl/random/internal:pool_urbg"
  "//absl/random/internal:pool_urbg" -> "//absl/random/internal:seed_material"
  "//absl/random/internal:salted_seed_seq"
  "//absl/random/internal:salted_seed_seq" -> "//absl/random/internal:seed_material"
  "//absl/random/internal:seed_material"
  "//absl/random/internal:seed_material" -> "//absl/strings:strings"
  "//absl/strings:strings"
}
....

• What you expected to happen

I expected to see the images. Here is an example from the pdf. I used the following command string to process the document.

asciidoctor -r asciidoctor-mathematical -r asciidoctor-pdf -r asciidoctor-diagram -b pdf simple_math_text.adoc 

When I look at the preview in the vscode extension, I just see the pass through text of the code.

[ggrossetie]

Probably related to https://github.com/asciidoctor/asciidoctor-vscode/issues/678 could you please try to update the security settings?

[edl7878]

tikz not working, but graphviz works in asciidoc