如何在 MathView 中自动缩放 TeX 方程?

How to automatically scale TeX equation in MathView?

我需要在 Android 应用程序中显示一些数学方程式。我使用 'MathView' (https://github.com/kexanie/MathView) 和 'MathJax' 作为转换 TeX 代码的引擎,效果很好。唯一的问题是,如果容器的宽度小于方程的宽度,我希望方程按比例缩小。有人知道如何实现吗?

数学视图:

 <io.github.kexanie.library.MathView
    android:id="@+id/formula"
    android:layout_width="100dp"
    android:layout_height="wrap_content"
    android:background="#cccccc"
    auto:engine="MathJax" />

MathView的配置:

formula.config(
            "MathJax.Hub.Config({\n" +
                    "    extensions: [\"tex2jax.js\", \"handle-floats.js\"],\n" +
                    "    jax: [\"input/TeX\", \"output/HTML-CSS\"],\n" +
                    "    tex2jax: {\n" +
                    "      inlineMath: [ ['$','$'], [\"\\(\",\"\\)\"] ],\n" +
                    "      displayMath: [ ['$$','$$'], [\"\\[\",\"\\]\"] ],\n" +
                    "      processEscapes: true\n" +
                    "    },\n" +
                    "    \"HTML-CSS\": {\n" +
                    "      linebreaks: {\n" +
                    "       automatic: false,\n" +
                    "       width: \"container\"\n" +
                    "      },\n" +
                    "    }\n" +
                    "  });"
    );

    formula.setText("<font color=\"#000000\">$$\int_0^\infty e^{-x^2} dx=\frac{\sqrt{\pi}}{2}$$</font>");

谢谢!

有一个专门针对 TEXT 语言的 Stack Exchange 站点。您可能会在那里找到更好的帮助。 https://tex.stackexchange.com/

为了能够做到这一点,您必须排版数学,测量结果并将其与容器的智慧进行比较,在容器上设置扇形缩放,然后重新渲染数学以获得新尺寸。

这是一个例子。

<html>
<head>
<title>MathJax with Dynamic CSS</title>
<script
  src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.0/MathJax.js?config=TeX-AMS_HTML">
</script>
<style>
.box {
  margin: 1em auto 0 auto;
  border: 2px solid black;
  padding: 0 20px;
  width: 20em;
}
</style>
</head>
<body>

<div class="box">
<div id="rescale" style="display:inline-block">
\[\sum_{n=1}^{10} {1\over n} = {1\over 1} + {1\over 2} + {1\over 3}
  + {1\over 4} + {1\over 5} + {1\over 6} + {1\over 7} + {1\over 8}
  + {1\over 9} + {1\over 10}\]
</div>
</div>

<script>
MathJax.Hub.Queue(function () {
  var math = document.getElementById("rescale");
  var w = math.offsetWidth, W = math.parentNode.offsetWidth-40;
  if (w > W) {
    math.style.fontSize = (95*W/w)+"%";
    MathJax.Hub.getAllJax(math)[0].Rerender();
  }
});
</script>

</body>
</html>

这不是您想做的很多事情,但它确实有效。使用 SVG 和 CommonHTML 输出,您无需重新渲染,只需更改字体大小即可。