Question

我正在尝试下载node.js Mathjax库并运行GitHub页面上提供的示例：https://github.com/mathjax/MathJax-node

我遵循的步骤：

步骤1： mkdir mydemo

第2步： cd mydemo

步骤3： npm安装mathjax-node

第4步：从GitHub网站上废弃示例javascript代码

// I place this in file ".\lib\main.js
// a simple TeX-input example
var mjAPI = require("mathjax-node");
mjAPI.config({
  MathJax: {
    // traditional MathJax configuration
  }
});
mjAPI.start();

var yourMath = 'E = mc^2';

mjAPI.typeset({
  math: yourMath,
  format: "TeX", // or "inline-TeX", "MathML"
  mml:true,      // or svg:true, or html:true
}, function (data) {
  if (!data.errors) {console.log(data.mml)}
});

第5步：：我设置“。\ index.html”以加载mathjax的Javascript演示代码。

<html>
    <head>
        <script src="./lib/main.js></script>
    </head>
    <body></body>
</html>

步骤6：：我将index.html加载到chrome网络浏览器中。什么都没发生。：-（

当然，我对javascript和node.js的了解很糟糕。但是，我做错了什么？为什么在Web浏览器窗口中看不到mathjax排版的“ e = mc ^ 2”？

更新

好的，我已经纠正了。它可以从命令行按如下方式工作：

C:\mydemo> node .\lib\main.js

<math xmlns="http://www.w3.org/1998/Math/MathML" display="block" alttext="E = mc^2">
  <mi>E</mi>
  <mo>=</mo>
  <mi>m</mi>
  <msup>
    <mi>c</mi>
    <mn>2</mn>
  </msup>
</math>

我的问题是如何获取此javascript设置，以使其可以在网站上显示为Web应用程序显示在Web浏览器中？而不是使用“ node”命令从Windows命令行运行它？

然后还有另一个问题，如果我将由节点脚本生成的mathml代码拖放到html文档中，它仍然没有使用正确的类型设置来显示“ e = mc ^ 2”。例如：

<!DOCTYPE html>
<html>
    <head>
    </head>
    <body>

    <math xmlns="http://www.w3.org/1998/Math/MathML" display="block" alttext="E = mc^2">
  <mi>E</mi>
  <mo>=</mo>
  <mi>m</mi>
  <msup>
    <mi>c</mi>
    <mn>2</mn>
  </msup>
</math>

    </body>
</html>

看到格式很丑...甚至都没有将“ 2”变成上标或其他乳胶字体排版...

Answer 1

部分答案是网络浏览器也不支持mathml ...它的polyfill功能。如果添加此丑陋的标头，则可在chrome中使用：

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html  PUBLIC "-//W3C//DTD XHTML 1.1 plus MathML 2.0//EN"
  "http://www.w3.org/Math/DTD/mathml2/xhtml-math11-f.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
  <meta charset="utf-8">
  <title>Fullest MathML support using MathJax</title>

  <!-- MATHML POLYFILL FOR WEB BROWSERS NOT SUPPORTING MATHML NATIVELY.. -->
  <script>window.MathJax = { MathML: { extensions: ["mml3.js", "content-mathml.js"]}};</script>
<script type="text/javascript" async src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.0/MathJax.js?config=MML_HTMLorMML"></script>

</head>
<body>
 <math xmlns="http://www.w3.org/1998/Math/MathML" display="block" alttext="E = mc^2">
  <mi>E</mi>
  <mo>=</mo>
  <mi>m</mi>
  <msup>
    <mi>c</mi>
    <mn>2</mn>
  </msup>
</math>

</body>

Answer 2

更容易...将其保存在mathjax中：

第1步：

mkdir demo1
cd demo1

步骤2：将mathjax javascript库的本地副本下载到demo1目录

npm i mathjax

第3步：

在demo1目录中创建index.html文件：

<!DOCTYPE html>
<html>
<head>

<script type="text/x-mathjax-config">
  MathJax.Hub.Config({
    tex2jax: {inlineMath: [["$","$"],["\\(","\\)"]]}
  });
</script>
<script type="text/javascript" src="./node_modules/mathjax/MathJax.js?config=TeX-AMS_HTML-full"></script>

</head>
<body>

<p>
When $a \ne 0$, there are two solutions to \(ax^2 + bx + c = 0\) and they are
$$x = {-b \pm \sqrt{b^2-4ac} \over 2a}.$$
</p>

</body>
</html>

使用mathjax和node.js在Web浏览器中显示乳胶数学方程

2 个答案: