MathJax的基本使用

一、引言

MathJax引擎是一个开源的JavaScript库,它允许Web开发者在网页中嵌入高质量的数学公式。通过利用Web的最新技术,MathJax引擎可以解析LaTeX、MathML和AsciiMath等数学标记语言,并将其渲染为可视化的数学公式,这些公式可以在各种浏览器和操作系统上流畅地显示。

使用MathJax引擎,网页作者可以轻松地编写包含数学内容的文档,而无需担心用户的浏览器或操作系统是否能够正确显示这些数学公式。因为MathJax引擎会自动处理这些兼容性问题,确保用户能够以清晰、准确的方式查看数学内容。

MathJax引擎的特点包括:

  1. 跨平台兼容性:它支持多种浏览器和操作系统,确保数学公式能够在各种设备上正确显示。
  2. 高质量的排版:MathJax引擎使用先进的排版算法,确保数学公式能够以清晰、准确的方式呈现。
  3. 易于使用:通过简单的标记语言,如LaTeX,用户可以轻松地编写数学公式,并将其嵌入到网页中。
  4. 高度可定制性:MathJax引擎提供了丰富的配置选项,允许用户根据自己的需求进行定制,以满足特定的排版和显示要求。

总的来说,MathJax引擎是一个功能强大、易于使用的工具,它为Web上的数学内容显示提供了高质量的解决方案。无论是科学论文、教育资料还是技术文档,都可以利用MathJax引擎来呈现复杂的数学公式,提升网页的可读性和专业性。

 二、使用

1、安装依赖

pnpm i mathjax

2、配置

MathJax = {tex: {packages: ['base'],        // extensions to useinlineMath: [              // start/end delimiter pairs for in-line math['\\(', '\\)']],displayMath: [             // start/end delimiter pairs for display math['$$', '$$'],['\\[', '\\]']],processEscapes: true,      // use \$ to produce a literal dollar signprocessEnvironments: true, // process \begin{xxx}...\end{xxx} outside math modeprocessRefs: true,         // process \ref{...} outside of math modedigits: /^(?:[0-9]+(?:\{,\}[0-9]{3})*(?:\.[0-9]*)?|\.[0-9]+)/,// pattern for recognizing numberstags: 'none',              // or 'ams' or 'all'tagSide: 'right',          // side for \tag macrostagIndent: '0.8em',        // amount to indent tagsuseLabelIds: true,         // use label name rather than tag for idsmaxMacros: 10000,          // maximum number of macro substitutions per expressionmaxBuffer: 5 * 1024,       // maximum size for the internal TeX string (5K)baseURL:                   // URL for use with links to tags (when there is a <base> tag in effect)(document.getElementsByTagName('base').length === 0) ?'' : String(document.location).replace(/#.*$/, '')),formatError:               // function called when TeX syntax errors occur(jax, err) => jax.formatError(err)},options: {skipHtmlTags: [            //  HTML tags that won't be searched for math'script', 'noscript', 'style', 'textarea', 'pre','code', 'annotation', 'annotation-xml'],includeHtmlTags: {         //  HTML tags that can appear within mathbr: '\n', wbr: '', '#comment': ''},ignoreHtmlClass: 'tex2jax_ignore',    //  class that marks tags not to searchprocessHtmlClass: 'tex2jax_process',  //  class that marks tags that should be searchedcompileError: function (doc, math, err) {doc.compileError(math, err)},typesetError: function (doc, math, err) {doc.typesetError(math, err)},renderActions: {...}},startup: {elements: null,          // The elements to typeset (default is document body)typeset: true,           // Perform initial typeset?ready: Startup.defaultReady.bind(Startup),          // Called when components are loadedpageReady: Startup.defaultPageReady.bind(Startup),  // Called when MathJax and page are readydocument: document,      // The document (or fragment or string) to work ininvalidOption: 'warn',   // Are invalid options fatal or produce an error?optionError: OPTIONS.optionError,  // Function used to report invalid optionsinput: [],               // The names of the input jax to use from among those loadedoutput: null,            // The name for the output jax to use from among those loadedhandler: null,           // The name of the handler to register from among those loadedadaptor: null            // The name for the DOM adaptor to use from among those loaded},svg: {scale: 1,                      // global scaling factor for all expressionsminScale: .5,                  // smallest scaling factor to usemtextInheritFont: false,       // true to make mtext elements use surrounding fontmerrorInheritFont: true,       // true to make merror text use surrounding fontmathmlSpacing: false,          // true for MathML spacing rules, false for TeX rulesskipAttributes: {},            // RFDa and other attributes NOT to copy to the outputexFactor: .5,                  // default size of ex in em unitsdisplayAlign: 'center',        // default for indentalign when set to 'auto'displayIndent: '0',            // default for indentshift when set to 'auto'fontCache: 'local',            // or 'global' or 'none'localID: null,                 // ID to use for local font cache (for single equation processing)internalSpeechTitles: true,    // insert <title> tags with speech contenttitleID: 0                     // initial id number to use for aria-labeledby titles}
};

tex配置:https://docs.mathjax.org/en/latest/options/input/tex.html#the-configuration-block

startup配置: https://docs.mathjax.org/en/latest/options/startup/startup.html#startup-options

options配置:https://docs.mathjax.org/en/latest/options/document.html#the-configuration-block

svg配置: https://docs.mathjax.org/en/latest/options/output/svg.html#the-configuration-block

 🌰:

$$x = {-b \pm \sqrt{b^2-4ac} \over 2a}.$$$x = {-b \pm \sqrt{b^2-4ac} \over 2a}.$
$$P_{价格} =\frac {1/a}{1/a+1/b+1/c}*P_A+\frac{1/b}{1/a+1/b+1/c}*P_B+\frac{1/c}{1/a+1/b+1/c}*P_C$$

 3、基本的LaTeX公式输入

四则运算

加减:a+b-c

a+b-c

乘法: a\times b

a\times b (注意\times和b之间要有空格)

分数: \frac{a}{b}

\frac{a}{b}

使用例: \frac{(a+b)\times c}{(d+e)\times f}

\frac{(a+b)\times c}{(d+e)\times f} 

一个小技巧:对含分式的式子两边加括号 (\frac{a}{b}), \left( \frac{a}{b} \right)

(\frac{a}{b}), \left( \frac{a}{b} \right)
(使用右边的方法效果会更好,可把小括号换成中括号)

比较运算

小于、大于、小于等于、大于等于: <,>,≤,≥

<, >, \leq, \geq (\leq,\geq的记忆:Less,Greater)

等于,不等于: =,≠

=, \not= (实际上,\not 就是那一杠,可运用于其它符号)

恒等于(同余): ≡

\equiv 

幂运算与下标

x^a,但是注意 x^{ab}和 x^ab 的区别:

x^a, x^{ab}, x^ab (多个字符时,要用花括号代替,不过单个字符时有无花括号是等价的)

下标: a_n,但是注意 a_{nm} 和 a_nm的区别:

a_n, a_{nm}, a_nm (花括号原理同上)

根号与多次方根: \sqrt a, \sqrt[n]a, \sqrt[nm]{ab}

\sqrt a, \sqrt[n]a, \sqrt[nm]{ab}

使用例:a_i^2, a^2_i

a_i^2, a^2_i 

集合间的运算

一对花括号(表示集合): \left\{ x_1,x_2 \right\}

\left\{
x_1,x_2
\right\} (不能直接打花括号,必须要有\left\,\right\)
(可以写成一行,这样仅为了方便查看)

属于、包含与真包含: ∈,∉,⊂,⊆,⊃,⊇

\in, \notin, \subset, \subseteq, \supset,\supseteq

交,并,补: \cap, \cup, C_UA, \complement_UA

\cap, \cup, C_UA, \complement_UA

省略号: \cdot, \cdots

\cdot, \cdots (一个点与三个点)

描述法: ∣

\mid

使用例:\left\{ x_1,x_2,\cdots,x_n \right\}, A\cap C_{A\cup B}B=A

\left\{ x_1,x_2,\cdots,x_n \right\},
A\cap C_{A\cup B}B=A

常用特殊函数

三角函数:  \sin x, \cos x, \tan x, \cot x

\sin x, \cos x, \tan x, \cot x (注意中间的空格)

反三角函数:  \arcsin, \arccos, \arctan ,\textrm{arccsc}, \textrm{arcsec},\textrm{arccot},\sin^{-1}\,cos^{-1},\tan^{-1},\sinh^{-1},\cosh^{-1},\tanh^{-1}

\arcsin x, \arccos x, \arctan x (事实上许多特殊函数都可以在前面加'\')

双曲函数:\sinh x, \cosh x, \tanh x, \coth x

\sinh x, \cosh x, \tanh x, \coth x

对数: \log_ax, \ln x, \lg x

\log_ax, \ln x, \lg x

用希腊字母表示的函数见下方“常用希腊字母”。

常用特殊符号

求和: \sum, \sum_{i=1}^n, \sum_{i=1}^na_i, \sum_{i=1}^{na_i}

\sum, \sum_{i=1}^n, \sum_{i=1}^na_i, \sum_{i=1}^{na_i}

无穷: ∞,+∞,−∞

\infty, +\infty, -\infty

箭头: →,←,↑,↓

\rightarrow, \leftarrow, \uparrow, \downarrow

极限: \lim, \lim_{x\rightarrow 0}, \lim_{x\rightarrow \infty}

\lim, \lim_{x\rightarrow 0}, \lim_{x\rightarrow \infty}

定积分与不定积分:\int, \int_a^b, \int_{ab}^{cd}

\int, \int_a^b, \int_{ab}^{cd}

二重积分: \iint, \iint_D

\iint, \iint_D

三重积分:\iiint, \iiint_D

\iiint, \iiint_D (以此类推,超过四重的积分不可用)

定积分使用例:\int_a^b \left( -\frac{1}{x^2} \right) dx = \frac{1}{x}|_a^b = \frac{1}{b} - \frac{1}{a}

\int_a^b \left( -\frac{1}{x^2} \right) dx = \frac{1}{x}|_a^b = \frac{1}{b} - \frac{1}{a}

偏导: ∂

\partial

梯度(Gradient): ∇

\nabla

常用希腊字母

阿尔法,贝塔,伽马:\alpha, \beta, \gamma

\alpha, \beta, \gamma

Gamma函数: Γ

\Gamma

变化量: Δ

\Delta

epsilon:\epsilon

\epsilon (但是总感觉平时好像用的是\xi?)

Zeta函数:\zeta

\zeta

机械效率: \eta

\eta

常数lambda: \lambda

\lambda

数学期望,摩擦系数mu:\mu

\mu

圆周率pi: \pi

\pi

极径: \rho

\rho

标准差、方差sigma:\sigma

\sigma

力矩,逆序数: \tau

\tau

欧拉函数phi: \phi, \Phi

\phi, \Phi

卡方分布: \chi

\chi (卡方分布的英文名是Chi-Square Distribution)

电阻,欧米茄:\omega, \Omega

\omega, \Omega

多行公式

换行: a \\ b, c \\ d

a \\ b, c \\ d ('\\'是换行)

对齐:

\begin{aligned} [(n+1)!+k]\operatorname{mod}k &=(n+1)!\operatorname{mod}k+k\operatorname{mod}k \\ &=0+0 \\ &=0 \end{aligned}

\begin{aligned}
[(n+1)!+k]\operatorname{mod}k &=(n+1)!\operatorname{mod}k+k\operatorname{mod}k
\\ &=0+0
\\ &=0
\end{aligned}
('&'是对齐)

方程组: \begin{cases} x_1+x_2=2 \\ x_1-x_2=0 \end{cases}

\begin{cases}
x_1+x_2=2
\\ x_1-x_2=0
\end{cases}

空格: a \ b

a \ b ('\ '表示一空格)

矩阵与行列式:\left( \begin{matrix} a &b \\c &d \end{matrix} \right) , \left| \begin{matrix} a &b \\c &d \end{matrix} \right|

\left(
\begin{matrix}
a &b
\\c &d
\end{matrix}
\right)
,
\left|
\begin{matrix}
a &b
\\c &d
\end{matrix}
\right|
(\left,\right后的符号可替换)

 

 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/807384.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

NPU float(“inf“) mask_fill 出现NAN

使用NPU时&#xff0c;采用mask_fill函数&#xff0c;会出错&#xff1a; tensors.masked_fill(mask.unsqueeze(-1), float(inf)) 无法直接使用表达式,会报错 NAN&#xff1a; 取一个较大的值替换即可&#xff1b; tensors.masked_fill(mask.unsqueeze(-1), float(1e10))

LeetCode算法——双指针篇

宫侑的发球最终进化为三刀流&#xff0c;那么我的题解也未必要循规蹈矩! 1、验证回文串 题目描述&#xff1a; 解法&#xff1a; 这题官方给的关于双指针的题解都用到了多个库函数&#xff0c;如 tolower(大写字母转小写)、isalnum(判断一个字符是否是 字母 或者 十进制数字 )…

LeetCode——622设计循环队列

. - 力扣&#xff08;LeetCode&#xff09;. - 备战技术面试&#xff1f;力扣提供海量技术面试资源&#xff0c;帮助你高效提升编程技能,轻松拿下世界 IT 名企 Dream Offer。https://leetcode.cn/problems/design-circular-queue/ 1.题目 设计你的循环队列实现。 循环队列是一…

CSS-文字环绕浮动、行内块分页、三角强化妙用、伪元素选择器

文字环绕浮动 <!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8"><meta name"viewport" content"widthdevice-width, initial-scale1.0"><title>文字环绕浮动效果</title><s…

Vue+el-table 修改表格 单元格横线边框颜色及表格空数据时边框颜色

需求 目前 找到对应的css样式进行修改 修改后 css样式 >>>.el-table th.el-table__cell.is-leaf {border-bottom: 1px solid #444B5F !important;}>>>.el-table td.el-table__cell,.el-table th.el-table__cell.is-leaf {border-bottom: 1px solid #444B5F …

Oracle ORA-28547:connection to server failed,probable Oracle Net admin error

使用Navicat连接oracle数据库时报ORA-28547错误 因为Navicat自带的oci.dll并不支持oracle11g&#xff0c;需要去官网下载支持的版本。 1.去oracle下载对应的oci.dll文件 下载地址&#xff1a;Oracle Instant Client Downloads 可以用 11.2.0.4 2. 复制刚下载下来的instant…

【智能算法】小龙虾优化算法(COA)原理及实现

目录 1.背景2.算法原理2.1算法思想2.2算法过程 3.结果展示4.参考文献 1.背景 2023年&#xff0c;Jia等人受到自然界小龙虾社会行为启发&#xff0c;提出了小龙虾优化算法&#xff08;Crayfsh Optimization Algorithm, COA&#xff09;。 2.算法原理 2.1算法思想 COA基于小龙…

计算机网络-TCP连接建立阶段错误应对机制

错误现象 丢包 网络问题&#xff1a;网络不稳定可能导致丢包&#xff0c;例如信号弱或干扰强。带宽限制可能导致路由器或交换机丢弃包&#xff0c;尤其是在高流量时段。网络拥塞时&#xff0c;多个数据流竞争有限的资源&#xff0c;也可能导致丢包。缓冲区溢出&#xff1a;TC…

网络安全之代码签名证书申请

代码签名&#xff0c;作为一种数字安全机制&#xff0c;对于软件开发、分发及用户使用环节具有至关重要的意义。以下从六大方面阐述代码签名必不可少的重要性&#xff1a; 确保代码来源可信&#xff1a; 代码签名如同软件的“身份证”&#xff0c;通过数字证书对开发者身份进…

微信被拉黑删除的提示差异和检测方法

拉黑 被拉黑的提示是“消息已发出&#xff0c;但被对方拒收了”。 拉黑方能发消息且被拉黑方能接到&#xff0c;被拉黑的人无法发送成功&#xff0c;并灰色字提示。 删除 仅删除的时候&#xff0c;才能发送消息时不是提示拒收&#xff0c;可“发送朋友验证”添加&#xff0…

头歌-机器学习 第11次实验 softmax回归

第1关&#xff1a;softmax回归原理 任务描述 本关任务&#xff1a;使用Python实现softmax函数。 相关知识 为了完成本关任务&#xff0c;你需要掌握&#xff1a;1.softmax回归原理&#xff0c;2.softmax函数。 softmax回归原理 与逻辑回归一样&#xff0c;softmax回归同样…

【星戈瑞】DBCO-NH2在生物成像技术中的应用

DBCO-NH2作为一种生物标记分子&#xff0c;在生物成像技术中发挥诸多应用作用。其点击化学反应特性使得它能够在生物体内进行特异的标记&#xff0c;从而为生物医学研究提供工具。 在生物成像技术中&#xff0c;DBCO-NH2常被用于标记生物分子&#xff0c;如蛋白质、核酸等。通…

Android 9.0 framework层实现app默认全屏显示

1.前言 在9.0的系统rom产品定制化开发中,在对于第三方app全屏显示的功能需求开发中,需要默认app全屏显示,针对这一个要求,就需要在系统启动app 的过程中,在绘制app阶段就设置全屏属性,接下来就实现这个功能 效果图如下: 2.framework层实现app默认全屏显示的核心类 fram…

【科研】搜索文献的网站

文章目录 paperswithcode【最新论文&#xff0c;代码】huggingface【大语言模型&#xff0c;最新论文】dblp【关键词搜索】arxiv【最新文章】semanticscholar【相关引用查询】connectedpapers【相关引用查询】github【工程&#xff0c;代码&#xff0c;论文开源代码】 paperswi…

mmdetection模型使用mmdeploy部署在windows上的c++部署流程【详细全面版】

0. 前置说明: 该文档适用于:已经使用mmdetection训练好了模型,并且完成了模型转换。要进行模型部署了。 1. 概述 MMDeploy 定义的模型部署流程,如下图所示: 模型转换【待撰写,敬请期待…】 主要功能是:把输入的模型格式,转换为目标设备的推理引擎所要求的模型格式…

andorid 矢量图fillColor设置无效

问题&#xff1a;andorid 矢量图fillColor设置无效 解决&#xff1a;去掉如下 android:tint一行

Ansys Zemax | 如何将光栅数据从Lumerical导入至OpticStudio(下)

附件下载 联系工作人员获取附件 本文介绍了一种使用Ansys Zemax OpticStudio和Lumerical RCWA在整个光学系统中精确仿真1D/2D光栅的静态工作流程。将首先简要介绍方法。然后解释有关如何建立系统的详细信息。 本篇内容将分为上下两部分&#xff0c;上部将首先简要介绍方法工作…

antdesign 1.7.8 vue2 table实现列合并

无分页&#xff0c;需要根据mac列进行列合并&#xff0c;最终效果如下所示&#xff1a; 核心实现如下&#xff1a; // 核心代码 const getRowspan (dataScroce, filed) > {let spanArr [];let position 0;dataScroce.forEach((item, index) > {if (index 0) {spanAr…

金三银四面试题(十九):MySQL中的锁

在MySQL中&#xff0c;锁是非常重要的&#xff0c;特别是在多用户并发访问数据库的环境中&#xff0c;因此也是面试中常问的话题。 请说说数据库的锁&#xff1f; 关于MySQL 的锁机制&#xff0c;可能会问很多问题&#xff0c;不过这也得看面试官在这方面的知识储备。 MySQL …

深入了解Redis——持久化

一&#xff0c;Redis持久化 Redis持久化即将内存中的数据持久化到磁盘中&#xff0c;在下一次重启后还能进行使用&#xff0c;Redis持久化分为RDB和AOF两种&#xff0c;我们接下来分别介绍RDB和AOF的内部原理和区别 RDB Redis运行时会将当前的内存快照存入至磁盘中&#xff…