时间戳

首页 > 解决方案 > MathJax 未正确显示动态添加（使用 js）矩阵

javascript - MathJax 未正确显示动态添加（使用 js）矩阵

问题描述

我是 MathJax 的新手，刚刚开始学习它。我正在尝试通过使用 js 将矩阵添加到页面来显示矩阵。但它没有被正确渲染。我放置矩阵的代码是：

function displayTransformationMatrix()
{
    var matrix = "$$\begin{bmatrix} 1 & 0 & 0 & vx \\ 0 & 1 & 0 & vy \\ 0 & 0 & 1 & vz \\ 0 & 0 & 0 & 1 \end{bmatrix}$$"
    var tranMat = document.getElementById("transformMatrix");
    tranMat.innerHTML = matrix;
    MathJax.Hub.Queue(["Typeset", MathJax.Hub, 'transformMatrix']);
}

这transformMatrix是一个div，vx, vy, vz是变量。当相同的文本直接添加到 div 时，矩阵会正确呈现，但如果以这种方式完成，它会给出：在此处输入图像描述

我在做什么错？我刚刚开始学习 MathJax，所以如果有一些愚蠢的错误，请理解。

标签： javascripthtmlmathjax

解决方案

在 javascript\中被保留为转义字符，如果你想要它在一个字符串中，你必须将它加倍并\\改为写入（请参阅登录控制台）

function displayTransformationMatrix()
{
    var matrix = "$$\\begin{bmatrix} 1 & 0 & 0 & vx \\\\ 0 & 1 & 0 & vy \\\\ 0 & 0 & 1 & vz \\\\ 0 & 0 & 0 & 1 \\end{bmatrix}$$"
    var tranMat = document.getElementById("transformMatrix");
    tranMat.innerHTML = matrix;
    MathJax.Hub.Queue(["Typeset", MathJax.Hub, 'transformMatrix']);
    console.log(matrix);
}

displayTransformationMatrix();
<script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/MathJax.js?config=TeX-AMS_SVG-full" type="text/javascript"></script>

 <span id="transformMatrix"></span>

推荐阅读