
Author interactive math equations and diagrams online using LATEX and PSTricks - ekurutepe
http://latex2html5.com/
======
thearn4
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.

~~~
troymc
It uses MathJax to do the equation rendering, see:

[http://www.mathjax.org/](http://www.mathjax.org/)

The diagrams are rendered to SVG (vector graphics, supported by all modern web
browsers).

------
alok-g
With reference to:
[https://mathapedia.com/books/34/sections/203/526](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](http://www.yworks.com/en/products_yed_about.html)

~~~
pyramation
I agree about drawing diagrams by specifying coordinates (it is tedious). The
point here is to make existing LaTeX publishable online. It would be great if
there was a web tool to generate the diagram PSTricks code

------
aroberge
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.

~~~
chm
I don't understand why he doesn't release the source for his applications.

~~~
ivan_ah
Source code here:
[https://github.com/pyramation/LaTeX2HTML5](https://github.com/pyramation/LaTeX2HTML5)

and here:
[https://github.com/Mathapedia/LaTeX2HTML5](https://github.com/Mathapedia/LaTeX2HTML5)

~~~
mcphage
I think the parent is talking about Bret Victor.

------
alok-g
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}

~~~
Someone
I am fairly sure that's not the source that produces the interaction. Apart
from the incorrect expression, the mismatched brackets in (sin(x)} indicate
that.

~~~
alok-g
Yes, I noted the mismatch too. So what is producing the interaction then (and
how does it know what changes with the interaction). It must have something to
do with "user" in "userline", that is, "userline" is some primitive that
includes interactions. How exactly, I cannot find.

------
pyramation
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.

------
acadien
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.

~~~
xanmas
I'm trying to push my research group to release our papers as iPython
notebooks and it looks like my next paper will be. Our text will be rendered
as normal markdown and our figures will be live figures with all the code that
we used to generate them. This way, if anyone wants to check our work, extend
it, or just better understand it, they're more than free to do so. It should
be a nice step forward in the ultimate goal of reproducible science.

~~~
acadien
None of the journals I work with will accept any format other than .tex or
.doc for submission, its pretty ridiculous. We totally rely on the journals to
distribute information but they have no incentive to optimize the process for
reproducability or ease of use. Don't get me started on publication fees and
access fees.

~~~
xanmas
We're getting around this by putting a paragraph at the end of the conclusion
with a link that says something to the effect of "Click here for a live
version of the paper with all the code and data used in this project." It's a
little more cumbersome than having the paper actually be the notebook but it
helps.

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

[http://defcon21.hscott.net/wave.html](http://defcon21.hscott.net/wave.html)

~~~
ivan_ah
cool demo, though I think your "phase offset" is in radians, might want to
throw a little π/180 in there ;)

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

~~~
ekurutepe
EPUB format is HTML based. I don't think if would be very hard to get this
working on e-readers as long as there is an input method and you don't mind
the slow refresh rate of e-ink.

