Choix entre KaTeX et MathJax
Choisir le moteur de rendu :Comment fonctionne le rendu des formules LaTeX ?
JSXGraph peut utiliser deux moteurs pour afficher des formules mathématiques :
- KaTeX : très rapide, léger et bien typographié.
- MathJax : plus puissant, mais plus lent, idéal pour les expressions complexes.
De manière générale insérer avant les éléments CSS juste après <head> et avant <style> les liens et scripts suivants :
<script src="https://cdn.jsdelivr.net/npm/jsxgraph@1.6.1/distrib/jsxgraphcore.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/jsxgraph@1.6.1/distrib/jsxgraph.css" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.12/codemirror.min.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/katex.min.css">
<script src="https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/katex.min.js"></script>
<script src="https://polyfill.io/v3/polyfill.min.js?features=es6"></script>
<script src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js"></script>
Par défaut, JSXGraph affiche les textes en SVG. Pour utiliser KaTeX ou MathJax, on doit activer l’affichage HTML avec :
JXG.Options.text.display = 'html';
Configuration globale (appliquée à tous les textes) :
Avant la fermeture de la balise <head> par </head>, insérer un script <script> ici </script> contenant :
Pour KaTeX :
JXG.Options.text.useKatex = true;
JXG.Options.text.useMathJax = false;
Pour MathJax :
JXG.Options.text.useKatex = false;
JXG.Options.text.useMathJax = true;
Configuration locale (sur un seul objet text
) :
- KaTeX :
useKatex: true
- MathJax : utiliser une fonction
render
comme ci-dessous :
render: function(el, text) {
el.innerHTML = text;
MathJax.typesetPromise([el]);
}
Les deux moteurs ne peuvent pas être actifs en même temps sur un même objet. Mais, le moteur peut être changé dynamiquement à l’aide du menu de haut de page.