Latex in Vectornator?

It’s possible do it?

Hi @Narcih could you explain better what you mean. Thank you advance.

LaTeX is a document system with very high-quality output, mostly used for scientific papers. I’d think this is probably outside the scope of Vectornator.

Just use LaTeXiT app and copy png to vectornator …

As others mentioned, could you maybe elaborate a bit on what you mean @Narcih?
Other wise I would also think that that export png and use in Latex is the way to go.

But it would be nice to do everything in one Programm, because you can then for example change errors faster

I other software there are plugins to draw latex equations, this is necessary to make scientific images, i.e., in libreoffice there is a plugin called TexMath. Is there some similar in Vectornator?

1 Like

I would love to see this feature! Specifically, I’d love the ability to render LaTeX equations as SVGs for use in Vectornator/Curve drawings.

I use Curve (almost exclusively on my iPad rather than laptop) for scientific drawings for research papers. Right now my workaround is to create the LaTeX equation I want as an SVG online (e.g. thanks to LaTeX to SVG), save this to my iPad, then drag and drop this into Curve using split view. This can be a bit of a slow process, and is especially annoying if I make a typo or something and have to create a new SVG and import it. Would be nice to edit the source LaTeX within Curve.

It would be interesting to see some kind of extensibility support in Curve. Matrix Widgets are an example of how this is implemented which work reasonably well.

Warning: The rest of this post is fairly technical, mainly aimed at Linearity.

If done as browser widgets (perhaps a background service worker ), one way could be to expose a basic API where the extension can pass a schema of properties & UI fields to be shown when creating or editing a type of custom object.

import { customObjects } from "linearity/curve/v1"; 
import { elements, icons } from "linearity/ui/v1"; 
import { someKindOfRenderer } "@donaldknuth/latex"

console.log(Object.keys(elements)); // ["COLOR_PICKER", "GRADIENT_PICKER", "SPINBOX", "TEXT", "MULTILINE"]

customObjects.create({
  id: "org.donaldknuth.tex.latex"
  name: "LaTeX",
  icon: icons.textPencil,
  props: [{
    key: "texSource",
    name: "LaTeX Source",
    type: elements.MULTILINE
  }],
  onCreate: async (props, curveObject) => {
    let svg = await someKindOfRenderer.renderToSVGString(props.texSource, curveObject.fill);
    props.hash = md5([props.source, curveObject.fill]);
    return {
      svg: svg
    };
  },
  onEdit: async (props, curveObject) => {
    // Don't re-render if nothing important has changed
    if (props.hash === md5([props.source, curveObject.fill])) return;

    props.hash = md5([props.source, curveObject.fill]);

    return {
      svg: await someKindOfRenderer.renderToSVGString(props.texSource, curveObject.fill);
    }
  },
})

Obviously this is a relatively simple example, but that’s the crux of how an API could potentially be structured. Off the top of my head, a few practical examples I can think of:

  • LaTeX support
  • Markdown rendering
  • Pulling in statistics (e.g sales from a CRM)
  • Keeping screenshots in documentation up-to-date
  • Integration of external icon libraries
  • Custom on-demand font loading (e.g Adobe/Google Fonts)
  • Custom image effects (e.g nontrivial borders, picture frames) - this could be very useful for non-designers who need visual effects

The development of most of these functions would not be particularly beneficial for Linearity, as they are too specialised and would require significant dev work for relatively little benefit. The benefit of exposing an API like this is that it gives the community freedom to create little utilities or programs. I can envisage a “Linearity Marketplace” where officially curated extensions could be downloaded easily (subject to app store rules of course).

Feel free to reach out if you have any questions or would like me to move this to a new thread.