I am hoping this is not a duplicate, but I was googling around so much that I can't remember where I started.
But I have a latex document that has some tikz and pgf images in it. I usually use latexmk to compile the file to pdf. Now, I wanted to see if I could compile this file to HTML, so that I can display the tikz images and such on the web. But I was not sure how to do this or what worked.
I tried to use make4ht, but that was only partially rendering my tikz images. Some of the macros that I had setup where not being rendered properly in the final output. The code I used was:
make4ht -d html -f html5+latexmk_build+mjcli myfile.tex "mathjax" I also tried pandoc, and converting from latex --> markdown, and then from markdown --> HTML. This also did not render the tikz blocks correctly. I did add the --mathjax flags, but I don't think that mathjax supports tikz right now.
pandoc -s myfile.tex -o test.md pandoc -s --katex test.md -o test.html Can anyone suggest the best approach that they have found for converting tex documents with tikz diagrams into HTML webpages.
UPDATED
As per comments by @michel.ht I tried a different driver. That helped but I am still getting formatting issues with the output. I am posting a specific example of a simple neural network. Perhaps I need to change the way that the code is written to better fit the Tikz driver?
\usepackage{tikz} \usetikzlibrary{shapes.multipart, positioning, decorations.markings, arrows.meta, calc, fit} \begin{tikzpicture}[shorten >=1pt,->,draw=black!50, node distance=\layersep] \tikzstyle{every pin edge}=[<-,shorten <=1pt] \tikzstyle{neuron}=[circle,fill=black!25,minimum size=25pt,inner sep=0pt] \tikzstyle{input neuron}=[neuron, fill=red!50]; \tikzstyle{output neuron}=[neuron, fill=orange!50]; \tikzstyle{hidden neuron}=[neuron, fill=green!50]; % Draw the input layer nodes \foreach \name / \y in {1,...,3} % This is the same as writing \foreach \name / \y in {1/1,2/2,3/3,4/4} \node[input neuron] (I-\name) at (0,-\y) {$x_{\y}$}; % Draw the output layer node \node[output neuron,pin={[pin edge={->}]right:$\hat{y}$}, right of=I-2] (O) {$\sigma$}; % Connect every node in the hidden layer with the output layer \foreach \source in {1,...,3} \path (I-\source) edge node[above]{$w_{\source}$} (O) ; \end{tikzpicture} Here is the corresponding picture. The text in the nodes is missing like $x_1$, etc.
There are some other issues with some tikz macros, but I can work on those in a subsequent post.
make4ht, it is important to use the the alternative TikZ driver, because the one that is used by default supports only basic text formatting in text nodes. If you use custom commands in math, then you can try the "mathml,mathjax" option. If that doesn't work well, then you can define your commands in the .cfg file, see this section in the documentation.dvisvgmoption and it looks much better, but not quite there. But some details are still missing. Let me update the OP with a specific example. It might be that I need to just rewrite the tikz code to better map to the Tikz driver? But I really do appreciate your input here.