carta/packages/plugin-tikz
2023-11-14 18:37:19 +01:00
..
public add tikz plugin(wip) 2023-07-16 18:17:20 +02:00
src plugin-tikz: set async true to fix rendering issues 2023-08-08 10:29:43 +02:00
.gitignore add tikz plugin(wip) 2023-07-16 18:17:20 +02:00
package.json build: sync plugins major version master 2023-11-11 16:48:37 +01:00
README.md fix plugin-tikz readme 2023-08-16 20:39:07 +02:00
tsconfig.json fix: remove typescript project references 2023-11-14 18:37:19 +01:00
tsconfig.node.json add tikz plugin(wip) 2023-07-16 18:17:20 +02:00
vite.config.ts don't externalize md5 but move it to dev deps 2023-07-23 19:03:09 +02:00

Carta TikZ Plugin

This plugin adds support for PGF/TikZ illustrations thanks to TikzJax. It uses the code generated for the Obsidian-TikZ plugin. Install it using:

npm i @cartamd/plugin-tikz

Important Notes

  1. This plugin requires the import of a heavy library (~7Mb), which is dynamically imported at runtime;
  2. Generated images are not ssr compatible, as they are rendered in the browser;
  3. You need to update your sanitizer to allow the specific tag: <div type="text/tikz">.

Setup

<script lang="ts">
	import { Carta, CartaEditor } from 'carta-md';
	import { tikz } from '@cartamd/plugin-tikz';

	import '@cartamd/plugin-tikz/fonts.css';

	const carta = new Carta({
		extensions: [tikz()]
	});
</script>

<CartaEditor {carta} />

Options

Here are the options you can pass to tikz():

interface TikzExtensionOptions {
	/**
	 * Enables Tikzjax console output.
	 */
	debug?: boolean;
	/**
	 * Class for generated svg div container.
	 */
	class?: string;
	/**
	 * Whether to center the generated expression.
	 * @default true
	 */
	center?: boolean;
	/**
	 * Post processing function for html.
	 * This also runs on stored html, differently
	 * from `postProcess`, which only runs when
	 * the element is first created.
	 */
	postProcessing?: (html: string) => string;
	/**
	 * Post processing function for rendered SVGs Elem.
	 * @deprecated Use `postProcessing` instead.
	 */
	postProcess?: (elem: SVGElement) => void;
}