将LaTeX嵌入网页的最佳方法是什么?

Phe*_*ods 42 html latex

我不是要求将LaTeX文档转换为HTML.

我希望能够做的是在html文档中使用LaTeX数学命令,并使其在浏览器中正确显示.这可以在服务器端或客户端完成.

use*_*688 20

我更喜欢MathJax而不是选择渲染图像的解决方案(这会导致锯齿问题).

MathJax是一个用于数学的开源Javascript渲染引擎.它使用CSS和Webfonts代替图像或flash,可以渲染LaTeX或MathML.这样你就没有缩放问题,甚至兼容屏幕阅读器.


ine*_*ine 15

MediaWiki可以满足您的需求.它使用Texvc(http://en.wikipedia.org/wiki/Texvc)"验证(AMS)LaTeX数学表达式并将它们转换为HTML,MathML或PNG图形." 听起来像你在寻找什么.

查看维基百科关于他们如何处理数学方程式的文章:http://en.wikipedia.org/wiki/Help : Formula.他们还对LaTeX以及不同渲染类型(PNG/MathML/HTML)的优缺点进行了广泛的参考.

MediaWiki使用TeX标记的子集,包括来自LaTeX和AMS-LaTeX的一些扩展,用于数学公式.它会生成PNG图像或简单的HTML标记,具体取决于用户首选项和表达式的复杂性.将来,随着越来越多的浏览器变得更智能,它将能够在许多情况下生成增强的HTML甚至MathML.(有关添加MathML支持的当前工作的信息,请参阅blahtex.)

更准确地说,MediaWiki通过Texvc过滤标记,然后Texvc将命令传递给TeX进行实际渲染.因此,仅支持完整TeX语言的有限部分; 详见下文....

HTML的优点

  • 内联HTML公式始终与HTML文本的其余部分正确对齐.
  • 公式的背景,字体大小和面部匹配其余HTML内容,外观尊重CSS和浏览器设置.
  • 使用HTML的页面加载速度更快.

TeX的优点

  • TeX在语义上优于HTML.在TeX中,"x"表示"数学变量x",而在HTML中,"x"表示任何东西.信息不可避免地丢失了.这有很多好处:
    1. TeX可以转换为HTML,但反之亦然.这意味着在服务器端,我们总是可以根据文本中的复杂性和位置,用户首选项,浏览器类型等来转换公式.因此,在可能的情况下,HTML的所有好处都可以保留,以及TeX的好处.确实,目前的情况并不理想,但这并不是放弃信息/内容的好理由.这更有理由帮助改善这种状况.
    2. 对于支持它的浏览器,可以将TeX转换为MathML,从而保持其语义并允许将其呈现为向量.
  • TeX专为排版公式而设计,因此输入更容易,更自然,输出更美观.
  • 在TeX中编写时,编辑人员无需担心浏览器支持,因为服务器会将其渲染为图像.另一方面,HTML公式最终可能会被某些浏览器或旧版本的浏览器与编辑器的意图(或根本没有)一致.


And*_*ech 14

我曾经开发过一个jQuery插件,实际上就是这个:jsLaTeX

以下是如何使用它的最简单示例:

$(".latex").latex();


<div class="latex">  
    \int_{0}^{\pi}\frac{x^{4}\left(1-x\right)^{4}}{1+x^{2}}dx =\frac{22}{7}-\pi  
</div>
Run Code Online (Sandbox Code Playgroud)

以上将在您的页面上生成以下LaTeX等式:

公式http://img16.imageshack.us/img16/5462/gifwm.gif

该插件的演示页面包含更多代码示例和演示.


Mat*_*gro 12

这个问题只有一个(非常好的)答案引用了KaTeX,根据我的经验,KaTeX 是最有效的解决方案,加载速度快且易于实施。

您需要添加一个<link>标签(用于样式表)和两个<script>s 到您的<head>. 然后用作内\( \)联数学的分隔符以及.\[ \]<body>

这是一个带有实现的最小 html5 文件:

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title>Katex</title>
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/katex.min.css" integrity="sha384-zB1R0rpPzHqg7Kpt0Aljp8JPLqbXI3bhnPWROx27a9N0Ll6ZP/+DiW/UqRcLbRjq" crossorigin="anonymous">
  <script defer src="https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/katex.min.js" integrity="sha384-y23I5Q6l+B6vatafAwxRu/0oK/79VlbSz7Q9aiSZUvyWYIYsd+qj+o24G5ZU2zJz" crossorigin="anonymous"></script>
  <script defer src="https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/contrib/auto-render.min.js" integrity="sha384-kWPLUVMOks5AQFrykwIup5lo0m3iMkkHrD0uJ4H5cjeGihAutqP0yW0J6dpFiVkI" crossorigin="anonymous" onload="renderMathInElement(document.body);"></script>
</head>

<body>
  <p>Math can be inline like \(2^{2x}=4\), or displayed like:</p>
  \[2^{3x}=8\]
</body>

</html>
Run Code Online (Sandbox Code Playgroud)


god*_*byk 10

如果你想将数学作为图像嵌入,你可以看一下MathTran.

如果您希望将数学主要作为文本插入到页面中(仅在必要时使用图像),jsMath可能就是您正在寻找的内容.