Programming/Front-end

MathJax: 웹에서 Latex 수식을 쓰자

동건 2016. 9. 3. 23:48

mathjax-example


웹화면에서 수식을 Latex 코드로 입력할 수 있는 javascript 패키지, MathJax를 간단하게 소개한다.

MathJax는 자체 CDN을 제공하므로 이를 이용하는 것이 편리할 것이다. 가장 기본적인 세팅으로 다음과 같이 javascript 코드를 추가한다.

<script async src="//cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-MML-AM_CHTML">

위 비동기 javascript 코드는 어느 위치에나 넣어도 잘 작동하는 것으로 예상된다. <head> 부분에 넣으면 당연히 잘 될 것이고, 내가 <body> 가장 끝 부분에 넣어서 사용하고 있는데 잘 작동하기 때문이다.

그러고 나서는 본분에 MathJax가 알려주는 식별자를 통해 수식을 넣을 수 있다. 이미 Latex를 통해 수식을 많이 써왔다면 MathJax 사용에 큰 어려움은 없을 것이다. 기본 세팅에서 식별자는 두 가지가 있다. (실제로 식별자를 넣어버리면 안보이니까 백슬래시 대신 그냥 슬래시로 표현했다)

  • inline 모드: 백슬래시+소괄호 /( ... /)
  • display 모드: 백슬래시+대괄호 /[ ... /]

inline 모드는 내용 안에 일반 글자와 같이 입력되는 것이고, (요렇게 /(x=1/)\(\rightarrow x=1\)) display 모드는 독자적인 공간에 입력되는 것이다. /[x=1/]은 이렇게 된다. \[x=1\]

MathJax documentation에서 위에서 설명한 전반적인 사항을 소개하고, 더 자세한 사항은 MathJax Latex support 페이지에서 확인할 수 있다. 위에서 설명한 수준 이상의 Latex를 사용하기 위해서는 꼭 읽어보는 것을 권한다. 나 자신에게도 권한다...

반응형