Implemented support for tikzjax (alshedivat#1990)

Implemented alshedivat#1976. Signed-off-by: George Araújo <[email protected]>
cjang2 · Dec 13, 2023 · 1997186 · 1997186
1 parent 6130018
commit 1997186
Show file tree

Hide file tree

Showing 2 changed files with 23 additions and 0 deletions.
diff --git a/_includes/head.html b/_includes/head.html
@@ -21,6 +21,11 @@
     <link href="{{ '/assets/css/bootstrap-toc.min.css' | relative_url | bust_file_cache }}" rel="stylesheet" />
     {% endif %}
 
+    {% if page.tikzjax %}
+    <link defer rel="stylesheet" type="text/css" href="https://tikzjax.com/v1/fonts.css">
+    <script defer src="https://tikzjax.com/v1/tikzjax.js"></script>
+    {% endif %}
+
     <!-- Styles -->
     {% if site.icon.size <= 4 %}
     <link rel="shortcut icon" href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>{{ site.icon }}</text></svg>">

diff --git a/_posts/2023-12-12-tikzjax.md b/_posts/2023-12-12-tikzjax.md
@@ -0,0 +1,18 @@
+---
+layout: post
+title:  a post with TikZJax
+date: 2023-12-12 22:25:00
+description: this is what included TikZ code could look like
+tags: formatting diagrams
+categories: sample-posts
+tikzjax: true
+---
+This is an example post with TikZ code. TikZJax converts script tags (containing TikZ code) into SVGs.
+
+<script type="text/tikz">
+\begin{tikzpicture}
+    \draw[red,fill=black!60!red] (0,0) circle [radius=1.5];
+    \draw[green,fill=black!60!green] (0,0) circle [x radius=1.5cm, y radius=10mm];
+    \draw[blue,fill=black!60!blue] (0,0) circle [x radius=1cm, y radius=5mm, rotate=30];
+\end{tikzpicture}
+</script>