Microsoft MVP성태의 닷넷 이야기
글쓴 사람
정성태 (techsharer at outlook.com)
홈페이지
첨부 파일
 
(연관된 글이 2개 있습니다.)

HTML에서 수학 관련 기호/수식을 표현하기 위한 방법 - MathJax.js - 두 번째 이야기

지난번 글을 쓸 때만 해도,

HTML에서 수학 관련 기호/수식을 표현하기 위한 방법 - MathJax.js
; https://www.sysnet.pe.kr/2/0/1718

MathJax가 Preview 버전 상태였는데, 어느새 정식으로 릴리스되었습니다. ^^

MathJax
; https://www.mathjax.org/

여러분의 HTML에서 이를 사용하는 방법은 2개로 나뉩니다. 가장 쉬운 방법은, 그냥 여러분의 HTML에 다음과 같은 스크립트만 명시해 주면 됩니다.

<script src='https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML'></script>

CDN을 못 믿겠다거나, 어쨌든 로컬 리소스로 모두 들고 있기를 원하는 경우라면 다음의 파일을 다운로드 받아서,

MathJax-master.zip
; https://github.com/mathjax/MathJax/archive/master.zip

다음의 리소스들을 여러분들의 웹 사이트에 포함시키면 됩니다.

/MathJax.js 파일
    /config 폴더
    /extensions 폴더
    /fonts 폴더
    /jax 폴더

그런데, 사용 방법이 살짝 바뀌었습니다. 기존에는 <span /> 태그의 mathjax-preview로도 잘 표현이 되었던 것 같은데요... 지금도 잘 되긴 하지만 문제가 있습니다. 예를 들어 다음과 같이 <span />으로 묶는 경우,
<span>\begin{pmatrix}n \\ k \end{pmatrix} = \begin{cases} \begin{pmatrix}n - 1 \\ k - 1 \end{pmatrix} + \begin{pmatrix}n - 1 \\ k \end{pmatrix} &\mbox { if } 0 < k < n \\ 1 &\mbox { if } \: k = 0 \: or \: k = n \end{cases}
</span>

이렇게 개행이 되어 3줄에 걸쳐 표현됩니다.

\begin{pmatrix}n \\ k \end{pmatrix} = \begin{cases} \begin{pmatrix}n - 1 \\ k - 1 \end{pmatrix} + \begin{pmatrix}n - 1 \\ k \end{pmatrix} &\mbox { if } 0 < k < n \\ 1 &\mbox { if } \: k = 0 \: or \: k = n \end{cases}


따라서 <script /> 태그로만 묶어주어야,

<script type="math/tex">
    \begin{pmatrix}n \\ k \end{pmatrix} = \begin{cases} \begin{pmatrix}n - 1 \\ k - 1 \end{pmatrix} + \begin{pmatrix}n - 1 \\ k \end{pmatrix} &\mbox { if } 0 < k < n \\ 1 &\mbox { if } \: k = 0 \: or \: k = n \end{cases}
</script>

이렇게 잘 보여집니다. ^^



참고로, Lex 형식뿐만 아니라 MathML 형식도 함께 지원합니다.




[이 글에 대해서 여러분들과 의견을 공유하고 싶습니다. 틀리거나 미흡한 부분 또는 의문 사항이 있으시면 언제든 댓글 남겨주십시오.]

[연관 글]






[최초 등록일: ]
[최종 수정일: 6/26/2021]

Creative Commons License
이 저작물은 크리에이티브 커먼즈 코리아 저작자표시-비영리-변경금지 2.0 대한민국 라이센스에 따라 이용하실 수 있습니다.
by SeongTae Jeong, mailto:techsharer at outlook.com

비밀번호

댓글 작성자
 



2016-08-13 06시24분
정성태
2017-07-31 12시23분
정성태
2019-07-06 11시28분
Escaping ‘$’ in MathJax
; https://blogueun.wordpress.com/2014/01/04/escaping-in-mathjax/

<span class="tex2jax_ignore">$</span>
정성태
2019-07-06 11시28분
mathjax 배포 주소가 2017년 4월 이후 바뀌었습니다.

Using a Content Delivery Network (CDN)
; http://docs.mathjax.org/en/latest/start.html


따라서 다음과 같은 식의 cdn을 써야 합니다.

https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/MathJax.js
정성태
2023-12-11 08시49분
lukas-blecher/LaTeX-OCR
 - pix2tex: Using a ViT to convert images of equations into LaTeX code.
; https://github.com/lukas-blecher/LaTeX-OCR
정성태

... 181  182  183  184  185  186  187  188  189  190  [191]  192  193  194  195  ...
NoWriterDateCnt.TitleFile(s)
208정성태10/21/200617420Windows: 1. 성태도 ^^ Vista 설치 해봤습니다.
212정성태10/20/200617101    답변글 Windows: 1.1. Vista 에서 WinFX 런타임 구동
207정성태4/13/200626132VC++: 23. VC++ RGS 파일에 사용자 정의 파라미터 추가
205정성태4/13/200623282VS.NET IDE: 37. devenv.exe를 이용한 Command Line 컴파일 [1]
204정성태5/8/200618367웹: 2. Server Unavailable - Server Application Unavailable
203정성태4/13/200617220웹: 1. IIS 설정 옵션: Verify(Check) that file exists
202정성태4/13/200616925VS.NET IDE: 36. Automatically synchronize with an Internet time server
201정성태4/13/200620137기타: 12. XMLHTTP Failure and SUS Admin
200정성태4/13/200619367.NET Framework: 58. 웹 서비스 메서드 호출 오류 유형 - text/html; charset=xxx, but expected 'text/xml'
199정성태4/13/200620744스크립트: 6. XHTML or HTML 4.01 표준 준수
194정성태4/13/200619957VC++: 22. IDL Library 절
193정성태4/13/200620382.NET Framework: 57. IComponentChangeService 인터페이스
192정성태6/1/200617688VC++: 21. Visual C++ struct와 class의 차이점
189정성태4/13/200625327VC++: 20. ActiveX CAB 파일 오류 유형 - 파일을 대상 디렉터리로 복사할 수 없음. [6]
187정성태11/24/200519813VS.NET IDE: 35. VS.NET 2005 IDE Tip - 2번째 : XML / XSL 지원 강화
186정성태11/23/200517125.NET Framework: 56. VS.NET 2005 IDE Tip
182정성태11/21/200517261.NET Framework: 55. 에러가 발생할 것만 같은 코드
181정성태11/20/200546200.NET Framework: 54. 한글이 포함된 ANSI, UTF-8, UNICODE 텍스트 파일 읽기 [3]파일 다운로드1
197정성태12/25/200521605    답변글 .NET Framework: 54.4. [관련 문제] A 태그의 href에서의 문제.
198정성태12/27/200519271    답변글 .NET Framework: 54.5. [추가]: VS.NET으로 UTF-8 홈페이지 구성하기
179정성태11/8/200516976.NET Framework: 53. .NET Remoting: 메시지 교체
178정성태11/5/200517751기타: 11. Dual Core 장만. ^^
177정성태11/2/200517576COM 개체 관련: 17. CoGetClassObjectFromURL파일 다운로드1
176정성태3/29/200622848.NET Framework: 52. covariance? [1]파일 다운로드1
175정성태10/31/200518326.NET Framework: 51. MSXML 6.0에서 디지털 서명 기능을 제거!
180정성태11/15/200518605    답변글 VS.NET IDE: 51.1. MSXML 6.0 정식 릴리스
... 181  182  183  184  185  186  187  188  189  190  [191]  192  193  194  195  ...