Qt 之Webengine 渲染数学公式（Latex）

本文主要是介绍Qt 之Webengine 渲染数学公式（Latex），希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档

文章目录

前言
一、MathJax简介
二、使用步骤
- 1.引入MathJax
- 2.识别公式

前言

项目中需要渲染数学公式，然后了解到了latex,了解到了Mathjax

一、MathJax简介

MathJax是一款运行在浏览器中的开源的数学符号渲染引擎，使用MathJax可以方便的在浏览器中显示数学公式，不需要使用图片。目前，MathJax可以解析Latex、MathML和ASCIIMathML的标记语言。(Wiki)

二、使用步骤

1.引入MathJax

<script src="https://polyfill.io/v3/polyfill.min.js?features=es6"></script> 
<script id="MathJax-script" async  src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js">  </script>

2.识别公式

我们可以通过MathJax.Hub.Config()中tex2jax去实现公式识别

官方例子，如下

<script type="text/x-mathjax-config">
MathJax.Hub.Config({tex2jax: {inlineMath: [ ['$','$'], ["\\(","\\)"] ],displayMath: [ ['$$','$$'], ["\\[","\\]"] ]}
});
</script>
<script type="text/javascript" src="path-to-MathJax/MathJax.js"></script>

其中inlineMath识别的单行内的数学公式,我们可以通过$ … $或( … )去识别这种数学公式

项目应用代码:

<script src="https://polyfill.io/v3/polyfill.min.js?features=es6"></script> 
<script id="MathJax-script" async  src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js">  </script>   
<script>    MathJax = {      tex: {        inlineMath: [['$','$'], ],processEscapes: true,processEnvironments: true,},chtml: {displayAlign: "left"},options: {enableMenu: false},}
</script>