Portál AbcLinuxu, 24. dubna 2024 04:41

Matematické vzorce ve webových stránkách

29. 5. 2013 | David Kolibáč
Články - Matematické vzorce ve webových stránkách  

Možná se vám už stalo, že jste potřebovali vložit matematický vzorec na webovou stránku. Co si v takové situaci počít?

Když se porozhlédneme po webu, narazíme na dvě nejčastější řešení. Z prvního na nás dýchne éra psacích strojů: vzorec tvořený různými formátovacími obezličkami, občas hraničícími s ascii artem. Druhá varianta obvykle aspoň vypadá podstatně lépe, jde o obrázek vytvořený v nějaké více či méně specializované aplikaci, a to počínaje tužkou a papírem, konče typografickým systémem TeX. Tu a tam se ještě objeví technologie pro tyto účely přímo určená, leč málo rozšířená, totiž MathML. Anebo kombinace předchozích řešení — tak je to třeba na Wikipedii. Tam se vzorce zobrazují jako obrázky, ale v popisku mají svůj zápis v prostém textu pomocí nějakého značkovacího jazyka. Při bližším průzkumu zjistíme, že tyto obrázky jsou generovány CMS právě ze zdrojového kódu v nějakém značkovacím jazyce, jak je to ostatně pro wiki typické.

Mimochodem, podobný problém vyvstává i v jiných situacích — může jít o osobní poznámky nebo namátkou mě napadá tvorba elektronické knihy, protože málokterá čtečka si korektně poradí s PDF, zatímco od dokumentu pro web je už jen krok ke knize ve formátu ePub.

V následujícím textu si představíme možnosti, které nám poskytuje pandoc, implementace nejen minimalistického značkovacího jazyka Markdown. Většina z nich jsou skripty (v JavaScriptu), tudíž jsou použitelné jen tak v HTML, jestliže o konverzi pomocí pandoc nestojíte. Z rozhodnutí použít pandoc plyne, že vzorce samotné budeme psát v LaTeXu. Pokud občas narazíte na to, že neznáte příkaz pro některý matematický symbol, může vám pomoci Detexify nebo editor od CodeDogs.

Nejprve krátce k obyčejné konverzi do MathML. Dokument přeložíme s parametrem --mathml (tedy např. pandoc -sS -o spam.html --mathml spam.txt), tzn. použije se knihovna texmath (můžete vyzkoušet online). Nevýhodou MathML obecně je, že “sazba” v prohlížečích, které ho podporují, vypadá odpudivě — a především webové prohlížeče postavené kolem vykreslovacího jádra WebKit ho nepodporují vůbec. Překlad do MathML mimochodem ve výchozím stavu používá také wiki gitit založená na nástroji pandoc.

Pro úplnost zmíním LaTeXMathML (parametr --latexmathml), jež také překládá vzorce z LaTeXu do MathML, ale až na straně klienta, a to pomocí JavaScriptu. Upřímně řečeno, nevidím důvod používat tuto možnost, a to mj. z toho důvodu, že uvedený skript není udržován a neřeší např. problém WebKitu.

Další variantou je nahrazení vzorců obrázky. Pro tyto účely slouží kupř.

Konečně ale existuje také řešení, které nepoužívá bitmapové obrázky, hezky vypadá a funguje napříč moderními webovými prohlížeči (resp. vykreslovacími jádry). Jmenuje se MathJax. Co se nasazení týče, standardně se v HTML pouze uvede odkaz na skript v MathJax CDN (když používáme pandoc, stačí parametr --mathjax a odpovídající kód se vloží do hlavičky dokumentu), ale pro lokální použití si můžeme MathJax stáhnout z webu projektu. Díky Apache License 2.0 není problém s redistribucí. Zatímco předchozí řešení vesměs podporovala jen podmnožinu příkazů použitelných ve vzorcích v LaTeXu, MathJax dokonce umožňuje definovat si vlastní makra.

Další varianta je jsMath, používá ji např. web planetmath.org nebo volitelně zmíněná wiki gitit. Návod k použití je prostý, dokument přeložte s parametrem --jsmath a do vygenerovaného HTML vložte odkaz na svou instalaci jsMath (buď balíček repozitářů z vaší distribuce, nebo archiv stáhnutý z SourceForge), tj. <script src="cesta_k_jsMath/easy/load.js"></script>. Nutno podotknout, že jsMath je docela bumbrlíček, obvykle si nese vlastní (kvalitnější) písma, tudíž ho doporučuji pouze pro weby hojně využívající matematické vzorce.

Jak vypadají výsledky konverze pomocí různý pandoc, si ukážeme na vzorci, který slouží k výpočtu času potřebného k uvaření vajíčka:

$t = 0,465 \cdot M^{2/3} \cdot \ln ( 0,76 \cdot \frac { T_{Wasser} – T_{Start} } {T_{Wasser} – T_{Innen}} )$

Na následujících obrázcích je vidět výstup s použitím různých konverzí. Všímejte si např. velikosti mezer kolem operátorů a rozměrů závorek, v nichž je uzavřený zlomek. Za zmínku také stojí to, jak se zobrazí MathML v prohlížeči, který ho nepodporuje (druhý snímek).

MathML ve Firefoxu MathML v Chromiu LaTeXMathML ve Firefoxu

Google Chart API MathJax jsMath

Další články z této rubriky

VDR a DVB-T2, část 2.
VDR a DVB-T2, část 1.
Šifrovaný Proxmox VE 6: ZFS, LUKS, systemd_boot a Dropbear
MapTiler – proměňte obrázek v zoomovatelnou mapu
Syncthing

ISSN 1214-1267, (c) 1999-2007 Stickfish s.r.o.