LaTeX#

Open this notebook in Jupyterlite | Download this notebook from GitHub (right-click to download).

import panel as pn

pn.extension('katex', 'mathjax')

The LaTeX pane enables rendering LaTeX equations as HTML using either the KaTeX or MathJax renderer.


You must load the desired renderer manually (e.g., pn.extension('katex') or pn.extension('mathjax')). If both are loaded, KaTeX is used by default.


Note that both KaTeX and MathJax support only a subset of the features available in a full LaTeX renderer. For detailed information on supported features, refer to their respective documentation.




Parameters:#


For details on additional options for customizing the component, refer to the layout and styling how-to guides.


    

  • object (str or object): A string containing LaTeX code, an object with a _repr_latex_ method, or a SymPy expression.
    • 

  • renderer (str, default=None): The renderer to use, either 'katex' or 'mathjax'. If not set, KaTeX is used unless only MathJax has been loaded.
    • 





A LaTeX pane will render any object with a _repr_latex_ method, SymPy expressions, or any string containing LaTeX. Any LaTeX content should be wrapped in $...$ or \(...\) delimiters, for example:


latex = pn.pane.LaTeX(
    r'The LaTeX pane supports two delimiters: $LaTeX$ and \(LaTeX\)', styles={'font-size': '18pt'}
)

latex







            
            
It’s important to prefix your LaTeX strings with an r to make them raw strings, otherwise Python interprets backslash sequences such as \f as escape characters:


pn.Column(
    pn.pane.LaTeX("$\frac{1}{n}$"), # Will not work
    pn.pane.LaTeX(r"$\frac{1}{n}$")
)







            
            
The LaTeX pane can be updated like other panes:


latex.object = r'$\sum_{j}{\sum_{i}{a*w_{j, i}}}$'





If both renderers have been loaded we can override the default renderer. Note that MathJax only treats $...$ as math when it wraps the entire string, so inline math within text should use the \(...\) delimiters:


pn.pane.LaTeX(r'MathJax renders inline math such as \(\sum_{i=1}^n x_i\) within a sentence', renderer='mathjax', styles={'font-size': '18pt'})







            
            
And can also be composed like any other pane:


maxwell = pn.pane.LaTeX(r"""
$\begin{aligned}
  \nabla \times \vec{\mathbf{B}} -\, \frac1c\, \frac{\partial\vec{\mathbf{E}}}{\partial t} & = \frac{4\pi}{c}\vec{\mathbf{j}} \\
  \nabla \cdot \vec{\mathbf{E}} & = 4 \pi \rho \\
  \nabla \times \vec{\mathbf{E}}\, +\, \frac1c\, \frac{\partial\vec{\mathbf{B}}}{\partial t} & = \vec{\mathbf{0}} \\
  \nabla \cdot \vec{\mathbf{B}} & = 0
\end{aligned}
$""", styles={'font-size': '24pt'})

cauchy_schwarz = pn.pane.LaTeX(object=r"""
$\left( \sum_{k=1}^n a_k b_k \right)^2 \leq \left( \sum_{k=1}^n a_k^2 \right) \left( \sum_{k=1}^n b_k^2 \right)$
""", styles={'font-size': '24pt'})

cross_product = pn.pane.LaTeX(object=r"""
$\mathbf{V}_1 \times \mathbf{V}_2 =  \begin{vmatrix}
\mathbf{i} & \mathbf{j} & \mathbf{k} \\
\frac{\partial X}{\partial u} &  \frac{\partial Y}{\partial u} & 0 \\
\frac{\partial X}{\partial v} &  \frac{\partial Y}{\partial v} & 0
\end{vmatrix}
$""", styles={'font-size': '24pt'})

pn.Column(
    pn.pane.Markdown('# The LaTeX Pane'),
    pn.FlexBox(maxwell, cross_product, cauchy_schwarz, gap='50px')
)







            
            




SymPy#


Panel’s LaTeX pane can render SymPy expressions, as shown below:


import sympy as sp
import panel as pn

pn.extension("mathjax")

x = sp.symbols('x')
expression = sp.integrate(sp.sin(x)**2, x)

latex_pane = pn.pane.LaTeX(expression, styles={'font-size': '20px'})

pn.Column(
    "# A sympy expression rendered in Panel: ", latex_pane
).servable()





Sympy in LaTeX pane




Controls#


The LaTeX pane exposes a number of options which can be changed from both Python and Javascript. Try out the effect of these parameters interactively:


pn.Row(latex.controls(jslink=True), latex)







            
            


Open this notebook in Jupyterlite | Download this notebook from GitHub (right-click to download).