Skip to content
master
Switch branches/tags
Code

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
src
Feb 23, 2019
Feb 23, 2019

TikZJax

TikZJax converts script tags (containing TikZ code) into SVGs.

See a live demo at http://tikzjax.com/

Example

In the <head> of your HTML, include

<link rel="stylesheet" type="text/css" href="http://tikzjax.com/v1/fonts.css">
<script src="http://tikzjax.com/v1/tikzjax.js"></script>

Then in the <body>, include TikZ code such as

<script type="text/tikz">
  \begin{tikzpicture}
    \draw (0,0) circle (1in);
  \end{tikzpicture}
</script>

Your TikZ will be compiled into SVGs; the <script> element will be replaced with the corresponding SVG.

How does this work?

Using https://github.com/kisonecat/web2js the Pascal source of tex is compiled to WebAssembly; the latex format is loaded (without all the hyphenation data), and

\documentclass[margin=0pt]{standalone}
\def\pgfsysdriver{pgfsys-ximera.def}
\usepackage{tikz}

is executed. Then core is dumped; the resulting core is compressed, and by reloading the dumped core in the browser, it is possible to very quickly get to a point where TikZ can be executed. By using an SVG driver for PGF along with https://github.com/kisonecat/dvi2html the DVI output is converted to an SVG.

All of this happens in the browser.

About

TikZJax is TikZ running under WebAssembly in the browser

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published