Author interactive math equations and diagrams online using LATEX and PSTricks

Mathematician here. The interactive stuff is cool, but besides that the page was a bit unclear on something simpler - is this something I can use to render static LaTeX expressions to decent looking (ie. better than standard latex2html) display equations dynamically in a browser?

I can go the route of latex -> png -> embed in html, but that does get tedious.

edit: looking at the source, it does appear to be the case:

"[...]if $\hat{x}(t) = \sum \limits_{k=0}^{M-1}\alpha_k \Psi_k$, where $x$ is a $p$-periodic signal[...]"

very cool. Though maybe I'm just easy to please.

For working scientists, engineers and mathematicians, that are already familiar with LaTeX, this seems to be an easy and natural path to achieve (part of) the vision of Bret Victor.

With reference to: https://mathapedia.com/books/34/sections/203/526

The code for the second example does not sound impressive to me. I do not want to draw diagrams by specifying coordinates of each and every box and label. How do I tell it to draw a label in the center of an already placed box?

Is there a way/tool where diagrams can be drawn at a higher level of abstraction where the user does not have to specify each and every thing? I have seen a few approaches, none of which sounds to be feature-complete:

yEd [1] lets the user draw graphs and store them in formats where they can be read by a program into a graph object. I found it very difficult to use yEd to draw anything but graphs.

MS-Word includes smart art. While I am not sure, but the storage format sounds to be something intelligent such that it would at least theoretically be possible to read the diagram programmatically into the corresponding data structure. Only issue is that the templates are fairly limited and I cannot figure how to draw anything else. Drawing a graph for example does not look possible.

Then there are UML tools that should have fit the purpose but often are not intuitive enough to use. They are also not intended to draw general-purpose diagrams.

And finally mindmap-based applications that do nothing else but mindmaps.

[1] http://www.yworks.com/en/products_yed_about.html

LaTeX newbie here:

Can someone explain how this works (from a user standpoint)? How does userline below map mouse pointer coordinates to the line? It seems (2,2) is what is getting substituted with the (x,y) from the mouse (after adjusting for the origin).

\begin{pspicture}(-2,-2)(2,2)

\psframe(-2,-2)(2,2)

\userline[linewidth=1.5 pt]{->}(0,0)(2,2)

\end{pspicture}

I am totally lost on the following example. The lightblue line below behaves the same way as the line in the above example. But the code below is quite different, including sin and -y.

\begin{pspicture}(-2,-2)(2,2)

\psframe(-2,-2)(2,2)

\userline[linewidth=2pt,linecolor=green]{->}(0,0)(2,2){-x}{-y}

\userline[linewidth=2pt,linecolor=red]{->}(0,0)(2,2){0}{y}

\userline[linewidth=2pt,linecolor=purple]{->}(0,0)(2,2){-x}{cos(y)}

\userline[linewidth=2pt,linecolor=lightblue]{->}(0,0)(2,2)(sin(x)}{-y}

\end{pspicture}

Thanks to whoever posted this. Just to clarify, yes, Bret Victor was an inspiration for this project. He was also quoted many times in my thesis for the first iteration of this project, mathapedia. The main point here was to built a product with an ethnographic approach to design---a product that works without the user having to change their behavior, in this case, an academician who already writes LaTeX can start to use LaTeX2HTML5 without much web dev knowledge. This is mostly a proof of concept for something that I hope to be more isomorphic to everything you can do with LaTeX and PSTricks, as well as utilizing other packages, such as TiKZ/PGF.

I wish there was a way to do this in PDF. If PDFs weren't these cumbersome static things it could really change how information is spread in the sciences. At least in my field the current mode for disseminating information is nearly 100% through downloading PDFs from journals, which inherently prohibits interactivity and dynamic visualizations.

I threw together a quick demo kinda like this a while back using Bret Victor's Tangle.js:

http://defcon21.hscott.net/wave.html

I wonder when this will ever work on e-ink readers.