在网页中显示数学公式

本网站是一个理科网站,往往会涉及数学公式的输入和显示,而这在Web上一直是一个难题。所以参考了好几篇网上的文章,现将自己的学习成果整理一下。主要参考网址:章杨的blog的Web数学公式的输入和显示。

一.计算机表现数学公式的几种方法

1.面向桌面的TeX系统

TeX是Knuth教授开发的一种优秀的桌面电子排版系统。它提供了一套功能强大并且十分灵活的排版语言,有多达900多条指令,并且具有宏功能,用户可以不断地定义自己适用的新命令来扩展TeX系统的功能。

TeX系统有许多优点,如开源、易移植、排版质量高、输出结果与设备无关等。同时,它也是公认的最好的数学公式排版系统,它在数学和工程领域得到了广泛的使用,相关领域的学术论文基本都由TeX系统或其兼容系统(如LaTeX系统)排版生成。

在TeX系统中,各种数学符号和公式由不同的数学记号来表示,如\sin表示sin、\sqrt表示根号等。数学记号和数字的组合一般放在

和\]里面。下表中列出了几个数学公式及其TeX指令:数学公式TeX指令

\frac{3+x}{5}\]

f(x)=x2-1f(x)=x^2-1\]

\sqrt[3]{x^4-3x+1}\]

一般来说,TeX指令和它所表示的数学公式本身非常接近,或者是该数学符号的英文缩写。因此TeX指令比较直观、易学,也很方便输入,中小学数学涉及的数学符号更是如此。

但在中小学,公式的输入几乎不会用Tex,用的都是Word自带的公式编辑器,我这些年通常使用域代码,因为高中物理通常在输入分数、根号时才会涉及公式的输入,而这种简单的情况用公式编辑器有点大材小用,也比较难输,我通常只有在比较复杂的情况下(比如或矩阵)才使用公式编辑器。

2.面向互联网的数学标记语言MathML

TeX系统虽然能完美地显示数学公式,但是无法在互联网上使用。目前我采用的方法是将Word中的公式进行截图,在网页中用图像的方式显示公式,用这种方法比较费时,而且修改也不方便。而HTML超文本标记语言由于自身的缺陷,也很难显示数学公式。

针对这些问题,国际互联网协会(World Wide Web Consortium,W3C)于1997年成立了W3C数学工作组,制定一种基于XML语言标准的数学标记语言(Mathematical Markup Language,MathML)。该组织于1998年发布了MathML 1.0版本,当前最新版本是3.0,发布于2010年10月21日。 MathML语言主要从表现(Presentation)和内容(Content)两个维度来定义各种数学符号和公式。表现标记是从数学表达式的显示形式来描述数学公式,如标记表示上标符号,表示下标符号等;而内容标记是从数学表达式本身的内在含义进行描述数学公式,如标记表示相加。二者可以从各自的角度表示同一个数学公式,以

 为例,表现标记和内容标记分别如下:表现标记内容标记

注意:在Firefox上显示不正常,原因未知

MathML数学标记语言是一个国际标准,Mozilla/Firefox/Netscape(7.1+)浏览器已默认支持MathML语言,但Internet Explorer暂不支持MathML标准,需要安装MathPlayer插件来解析含有MathML标记的网页。

3.ASCIIMathML转换方法

简单地说,TeX指令和MathML标记语言是两种互补性很强的语言。采用TeX指令描述的数学公式简单、直观,但浏览器不能直接识别和显示;MathML数学标记语言虽然是为互联网而设计的,但它的标记语言又相对复杂,不便于输入。因此,有研究者结合两者的优点,开发了TeX指令与MathML自动转换的Java 程序,ASCIIMathML就是其中的佼佼者。

ASCIIMathML转换程序由美国加州查普曼(Chapman)大学Peter Jipsen开发,其设计思想是在网页上插入一段JS代码,将网页中的TeX指令(TeX/LaTeX-style)自动转换成MathML表现标记语言,再返回给支持MathML标准的网络浏览器识别和显示。

由于微软Internet Explorer浏览器不支持MathML标准,若要正确地显示数学公式,IE客户端还需要安装MathPlayer插件,这增加了用户的不便。因此,皮尔斯学院David Lippman在ASCIIMathML转换方法基础上,开发了ASCIIMath Image Fallback转换程序,该转换程序自动判断客户端浏览器是否支持MathML,若支持,则返回MathML表现标记;若不支持,则返回该公式的GIF图像(远程调用互联网上的cgi程序生成图像)。另外,作者也提供了ASCIIMathTeXImg转换,直接由TeX指令生成GIF图像,而无论用户使用的浏览器是否支持MathML。

在ASCIIMathML网站的最新消息是推荐一个新的转换程序MathJax,它是一个开源的JavaScript显示引擎,能够在所有当代浏览器上显示漂亮的数学公式,同时支持Tex和MathML表示。

4.其他方法

上面的方法需要用户在本地保留js文件,而有些网站将处理程序放置在服务器上,你只需在页面上传递公式的Tex表达,就会返回公式的图像,其实就是上述ASCIIMathTeXImg的服务器版本。我知道的是网站http://private.codecogs.com的服务,例如你想在网页上显示a2+b2 的平方根,你只需在网页所在位置输入以下html代码:

想使用起来更简单,可用点js代码,具体过程可参考在博客里轻松使用LaTeX数学公式,不再赘述。

二、在Web系统中显示和输入数学公式

从上面的内容可以知道,ASCIIMathML不是个好选择,在Firefox显示正常的公式在IE中只能显示源ASCII字符,使用http://private.codecogs.com无需在客户机下载js文件应该最快,但有点受制于人,万一这个网站服务不正常,那么我的网站上的所有公式图片都会显示不出来。

考虑到国内IE用户占绝大多数,因此决定采用ASCIIMath Image Fallback转换程序的方法,但采用的是更漂亮的MathJax。你只需在网页和之间添加js的地址即可:

由上面代码可知我们是通过CDN(distributed network service)安装这个js的,这也是推荐的方法,CDN可以自动从你的主机附近最快、最近的服务器上下载js文件,而且会自动升级。当然你也可以将MathJax下载到本地服务器上。然后在网页任意位置书写TeX指令描述的数学公式,注意:如果要让公式单独占一行,需用

和\]将公式包起来,即以block显示,若想用inline,则用\ (和\)将公式包起来,而公式的具体表达可参见中文维基:数学公式,写得非常详细。

但是手工书写Tex公式还是非常难的,我使用的是大名鼎鼎的MathType,如下图进行设置,就可以复制MathType的公式并粘贴为Tex格式。

MathType转换设置,使得公式粘贴后自动变为Tex格式

html数学公式标记,在网页中显示数学公式相关推荐

  1. 在网页中显示数学公式

    网上在网页中显示数学公式的办法有很多,在实验了很多方法后我还是选择两种最简单粗暴的方法. 1.截图 2.ASCIIMathML       比起MathML,ASCIIMathML简单了很多,不需要再 ...

  2. HTML中显示数学公式

    需求: 在网页中显示这样一个数学公式 用到的插件:https://www.mathjax.org/ <!DOCTYPE html><html><head><t ...

  3. html显示docx,网页中显示PDF的HTML代码.docx

    网页中显示PDF的HTML代码 您可能想打开文档至某一特别页面或目标,或显示书签.要与 链接一起放入一个动作命令,可紧接在 PDF 文件名后面键入数字符号 (#) 和该命令.以下表格显示可能的动作命令 ...

  4. 将VS2005中的.CS文件在网页中显示的方法

    今天在做AccessMembershipProvider的DEMO时,想把支持Access数据库提供程序的源码在网页中显示出来,可是复制源码后在网页中显示的是不换行的,后来我在尝试了很多办法后,终于有 ...

  5. html网页中显示乱码的问题解决

    在网页中显示中文乱码. 情景: 在html页面写了个javacript的代码,里面有alert("中文"),但弹窗出来的对话框显示的是中文乱码. 解决: 在head头加 <m ...

  6. 非常好的在网页中显示pdf的方法

    今天有一需求,要在网页中显示pdf,于是立马开始搜索解决方案,无意中发现一个非常好的解决方法,详见http://blogs.adobe.com/pdfdevjunkie/web_designers_g ...

  7. 网页中显示xml,直接显示xml格式的文件

    第一种方法 使用<pre></pre>包围代码(在浏览器中测试不行啊,但是在富编辑器中又可以,怪): 使用<xmp></xmp>包围代码(官方不推荐,但 ...

  8. 在html中显示word,如何在浏览器网页中显示word文件内容

    把word文件读到byte[]中,再Response.OutputStream.Write(bytes)到客户端去 Page_Load事件中写: //FileStream   fs   =   new ...

  9. 在网页中显示CHM (c# csharp .net asp.net winform)

    CHM即"已编译的帮助文件",主要由.hhc(目录文件)..hhk(索引文件)以及相应的帮助主题文件(.html,.htm)这些内容编译而成. 方法对比 在网页中显示CHM内容,大 ...

  10. 基于JavaWeb JavaScript的根据时间段的不同,在网页中显示不同的问候语

    题目: 根据时间段的不同,在网页中显示不同的问候语,若小时数在12点以前,则输出"早上好!"的问候语,颜色为蓝色:若在12点至18点,则输出"下午好!"颜色为红 ...

最新文章

  1. 碾压Bert?“屠榜”的XLnet对NLP任务意味着什么
  2. archlinux包管理器--pacman常用命令
  3. 在Qt工程文件中根据不同版本号使用不同源码
  4. 【STM32】OLED简介
  5. java的websocket_java 实现websocket的两种方式实例详解
  6. mysql的电话面试题_以往百度电话面试题
  7. 守护线程 java 1615478655
  8. JAVA如何分段_OpenCV Java文本分段
  9. 学习pythonweb开发_Python学习--20 Web开发
  10. 步骤1:mybatis工程的创建
  11. Android 使用POI导出Excel表格
  12. 草图大师su安装程序无法进行的解决办法。
  13. 用分区大师无损增加C盘空间
  14. 如何用数学课件制作工具绘制函数图像
  15. Scheduling
  16. 【计算机组成原理】寻址方式
  17. 五子连珠游戏使用手册
  18. precision、recall、f1score的计算
  19. 回顾篇:淘宝API web开发一 授权登录
  20. 如何做外贸网站的SEO优化

热门文章

  1. 安装SAS University Edition
  2. 安卓游戏源码-android游戏源码开发-android游戏开发
  3. HTML认识数字游戏,小班数学游戏教案《认识数字》
  4. AMPL—快速了解,秒懂它。
  5. 数学建模软件lingo的基本使用方法
  6. Lingo 实现线性规划求解模型
  7. 拼多多摄像头是否安全的检测
  8. DSP28335学习记录(一)
  9. IP地址归属地那些事
  10. USB转TTL接线方法