반응형
1. 수식이 깨지는 이유
티스토리 스킨 변경 후 MathJax를 사용하여 LaTeX 수식을 웹 페이지에 표시할 때,
$$를 디스플레이 수식 구분자로, $를 인라인 수식 구분자로 사용하는 경우가 많다.
하지만 기본적으로 MathJax 3에서는 $$는 지원하지만, $는 인라인 수식 구분자로서 활성화되어 있지 않다.
이는 $가 웹 페이지에서 매우 흔하게 사용되기 때문에, 잘못된 수식 해석을 방지하기 위한 것이다.
때문에 $$ 구분자와 달리 $ 구분자를 사용하는 수식이 깨져서 보일 수 있다.
이런 이유로 인터넷에 알려진 해결 방법을 적용해도 $ 구분자를 이용하는 수식은 여전히 깨져보이는 것이다.
2. 해결 방법
아래 수식을 <head>와 </head> 사이에 넣어준다.
MathJax의 설정을 변경해 수식 구분자 처리 방식을 바꾼다. 추가로, 역슬래시 (\)를 인라인 수식 구분자로 사용할 수 있도록 한다.
<p data-ke-size="size16">
<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.0.1/es5/tex-mml-chtml.js"></script>
</p>
<script>
window.MathJax = {
tex: {
inlineMath: [['$', '$'], ['\\(', '\\)']]
},
svg: {
fontCache: 'global'
}
};
</script>
<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>
반응형
'개발' 카테고리의 다른 글
ISO26262 자동차 기능안전이란? (0) | 2024.06.12 |
---|---|
Warp: Mac에서 빠른 속도의 AI 터미널 사용해보기 (0) | 2024.02.22 |
파이썬 시뮬레이터 앱 개발 - Streamlit, Gradio, Dash (0) | 2024.01.30 |
[ERROR] WARNING: Secure coding is not enabled for restorable state! (0) | 2024.01.17 |
[ERROR] copilot: Node.js not found in PATH (1) | 2023.12.26 |