Node端MathJax渲染SVG时数组列线(增广矩阵)不显示问题
Node环境下MathJax渲染SVG时增广矩阵列线丢失
在Node环境中通过服务端运行MathJax,将数学表达式渲染为SVG时,增广矩阵的列线(|分隔符)无法正确显示,但直接渲染为HTML时该功能正常。
SVG中列线应出现的位置存在极细微空白,说明程序已进行相关处理,但列线未实际渲染出来。
最小复现代码
import fs from "fs"; const MathJax = await (await import("mathjax")).init({ loader: { load: ['input/tex', 'output/svg'] }, }); const mathExpression = String.raw`\left(\begin{array}{cc|c} 2 & 0 & 1\\ 0 & 1 & 1 \end{array}\right)`; const renderedSvg = MathJax.startup.adaptor.innerHTML( MathJax.tex2svg(mathExpression) ); fs.writeFileSync("test.svg", renderedSvg);
效果对比
- 正确渲染效果(TeX及MathJax HTML渲染):增广矩阵的竖线清晰分隔开前两列与第三列,矩阵整体被括号包裹,元素对齐整齐。
- SVG渲染实际效果:矩阵中竖线位置仅留空白,竖线完全缺失,其余元素显示正常。
原始SVG输出
<svg xmlns="http://www.w3.org/2000/svg" width="11.049ex" height="5.509ex" viewBox="0 -2500 4856 2417" role="img" focusable="false" aria-label="(201011)"> <defs> <path id="MJX-1-TEX-N-32" d="M513 850Q513 950 463 1025T325 1100Q208 1100 117 1008T25 800Q25 670 94 562T250 425Q325 425 375 463T425 550Q425 600 394 642T312 725Q233 725 183 642T133 500Q133 367 200 267T367 175Q483 175 575 267T667 500Q667 625 600 733T433 850H513ZM325 575Q325 642 363 692T450 742Q508 742 542 692T575 575Q575 508 537 458T450 408Q392 408 358 458T325 575Z"/> <path id="MJX-1-TEX-N-30" d="M250 850Q250 950 200 1025T62 1100Q-58 1100 -150 1008T-237 800Q-237 670 -168 562T-12 425Q62 425 112 463T162 550Q162 600 131 642T50 725Q-29 725 -79 642T-129 500Q-129 367 -62 267T75 175Q192 175 283 267T375 500Q375 625 308 733T142 850H250ZM75 575Q75 642 113 692T200 742Q258 742 292 692T325 575Q325 508 287 458T200 408Q142 408 108 458T75 575Z"/> <path id="MJX-1-TEX-N-31" d="M250 0Q250 100 200 175T62 250Q-58 250 -150 158T-237 -50Q-237 -180 -168 -288T-12 -425Q62 -425 112 -387T162 -300Q162 -250 131 -208T50 -125Q-29 -125 -79 -208T-129 -350Q-129 -483 -62 -583T75 -675Q192 -675 283 -583T375 -350Q375 -225 308 -117T142 0H250ZM75 -375Q75 -308 113 -258T200 -208Q258 -208 292 -258T325 -375Q325 -442 287 -492T200 -542Q142 -542 108 -492T75 -375Z"/> <path id="MJX-1-TEX-N-28" d="M100 500Q100 550 125 592T187 662Q250 662 300 600T350 450Q350 350 300 275T187 200Q125 200 100 242T75 350Q75 450 100 500ZM250 500Q250 550 225 592T175 662Q100 662 50 600T0 450Q0 350 50 275T175 200Q237 200 262 242T287 350Q287 450 262 500H250Z"/> <path id="MJX-1-TEX-N-29" d="M100 0Q100 50 125 92T187 162Q250 162 300 100T350 -50Q350 -150 300 -225T187 -300Q125 -300 100 -258T75 -150Q75 -50 100 0ZM250 0Q250 50 225 92T175 162Q100 162 50 100T0 -50Q0 -150 50 -225T175 -300Q237 -300 262 -258T287 -150Q287 -50 262 0H250Z"/> </defs> <g stroke="currentColor" fill="currentColor" stroke-width="0" transform="matrix(1 0 0 -1 0 0)"> <use href="#MJX-1-TEX-N-28" x="0" y="0"/> <use href="#MJX-1-TEX-N-32" x="1000" y="0"/> <use href="#MJX-1-TEX-N-30" x="2000" y="0"/> <use href="#MJX-1-TEX-N-31" x="3000" y="0"/> <use href="#MJX-1-TEX-N-32" x="4000" y="0"/> <use href="#MJX-1-TEX-N-29" x="4856" y="0"/> </g> </svg>
内容的提问来源于stack exchange,提问作者naiveai
相关产品推荐
相关产品推荐

