npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

@sajalregmi/node-tikzjax

v1.0.4

Published

A port of TikZJax runs on pure Node.js and WebAssembly. Specific use case to return the complete error message

Downloads

8

Readme

@sajal/node-tikzjax

A port of prinsss/node-tikzjax runs on pure Node.js and WebAssembly.

Node-TikZJax lets you render LaTeX and TikZ diagrams to SVG images without the need to install LaTeX toolchain to the environment. You can render graphs, figures, circuits, chemical diagrams, commutative diagrams, and more.

License

This project is a fork of prinsss/node-tikzjax and is licensed under the LaTeX Project Public License v1.3c.

Updated Usecase

This project updates the original prinsss/node-tikzjax to return detailed error message instead of the generic one in case of conversion failure.

Installation

npm install @sajal/node-tikzjax

Examples

See the demo folder for some example TikZ diagrams.

Live demo: https://stackblitz.com/edit/node-tikzjax

screenshot

The example TeX source code is taken from obsidian-tikzjax.

Usage

Basic usage:

import tex2svg from 'node-tikzjax';

const source = `\\begin{document}
\\begin{tikzpicture}
\\draw (0,0) circle (1in);
\\end{tikzpicture}
\\end{document}`;

const svg = await tex2svg(source);

Which generates the following SVG:

<svg xmlns="http://www.w3.org/2000/svg" width="193.253" height="193.253" viewBox="-72 -72 144.94 144.94">
  <path fill="none" stroke="#000" stroke-miterlimit="10" stroke-width=".4" d="M72.47.2c0-39.914-32.356-72.27-72.27-72.27S-72.07-39.714-72.07.2-39.714 72.47.2 72.47 72.47 40.114 72.47.2ZM.2.2"/>
</svg>

The input TeX source is rendered to DVI, then rendered to SVG.

  • Remember to load any packages you need with \usepackage{}, and include \begin{document} and \end{document}.
  • The standalone document class is used (\documentclass{standalone}).

The following packages are available in \usepackage{}:

  • chemfig
  • tikz-cd
  • circuitikz
  • pgfplots
  • array
  • amsmath
  • amstext
  • amsfonts
  • amssymb
  • tikz-3dplot

[!NOTE] Don't run multiple instances of node-tikzjax at the same time. This may cause unexpected results.

Advanced Usage

There are some options you can pass to tex2svg():

const svg = await tex2svg(source, {
  // Print log of TeX engine to console. Default: false.
  showConsole: true,
  // Additional TeX packages to load. Default: {}.
  // The following example results in `\usepackage{pgfplots}\usepackage[intlimits]{amsmath}`.
  texPackages: { pgfplots: '', amsmath: 'intlimits' },
  // Additional TikZ libraries to load. Default: ''.
  // The following example results in `\usetikzlibrary{arrows.meta,calc}`.
  tikzLibraries: 'arrows.meta,calc',
  // Additional source code to add to the preamble of input. Default: ''.
  addToPreamble: '% comment',
  // Add `<defs><style>@import url('fonts.css');</style></defs>` to SVG. Default: false.
  // This could be useful if you want to embed the SVG in a HTML file.
  embedFontCss: true,
  // URL of the font CSS file. Default: 'https://cdn.jsdelivr.net/npm/node-tikzjax@latest/css/fonts.css'.
  fontCssUrl: 'https://cdn.jsdelivr.net/npm/node-tikzjax@latest/css/fonts.css',
  // Disable SVG optimization with SVGO. Default: false.
  disableOptimize: false,
});

You can also separate the TeX rendering and DVI to SVG conversion steps:

import { load, tex, dvi2svg } from 'node-tikzjax';

// Load the WebAssembly module and necessary files.
await load();

// Read TeX source from a file.
const input = readFileSync('sample.tex', 'utf8');

// Render TeX source to DVI.
const dvi = await tex(input, {
  showConsole: true,
  texPackages: { pgfplots: '', amsmath: 'intlimits' },
  tikzLibraries: 'arrows.meta,calc',
  addToPreamble: '% comment',
});

// Output generated DVI to a file.
writeFileSync('sample.dvi', dvi);

// Render DVI to SVG.
const svg = await dvi2svg(dvi, {
  embedFontCss: true,
  fontCssUrl: 'https://cdn.jsdelivr.net/npm/node-tikzjax@latest/css/fonts.css',
  disableOptimize: false,
});

// Output generated SVG to a file.
writeFileSync('sample.svg', svg);

Acknowledgements

This project is greatly inspired by obsidian-tikzjax.

This port would not be possible without the original tikzjax project.

Prebuilt WebAssembly binaries and supporting files are downloaded from artisticat1/tikzjax#output-single-file.

A fork of artisticat1/dvi2html#ww-modifications is used to convert DVI to SVG.

The BaKoMa fonts shipped with this package are licensed under the BaKoMa Fonts Licence.

Thanks to all the authors for their great work!

License

LaTeX Project Public License v1.3c