창고/Tistory에 쓰일 기능

게시글에Latex 쓰는법

Jinlib 2018. 6. 29. 10:20

게시글에 Latex를 이용하여 수학 수식 입력하기

(기본모드) Latex가 포함된 게시글 작성 -> (html모드) 글 하단에 아래 코드를 추가 -> 발행

<script> MathJax = { tex: {inlineMath: [['$', '$'], ['\\(', '\\)']]} }; </script>
<script src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-chtml.js"></script>

사용법을 $2^n$ 혹은 $$2^n$$ 식으로 입력해주면 된다.

더 알고 싶다면 아래를 참고하자.

+) 22.01.18 추가: 마크다운모드에서는 기존에 \frac{a}{b} 하던것을 \\frac{a}{b} 처럼 작성해줘야한다.

실제 출력결과를 확인보고 싶다면?

Mathjax 문법

자세한건 여기서 알아보자!

인라인모드(한줄 표현), 인클로즈모드(수식 표현)

$ $ 으로 묶어줌으로써 컴퓨터에게 mathjax를 이용한다는 것을 알려줍니다.
수식을 인라인형태로 쓸꺼냐. 아웃라인형태로 쓴꺼냐에 따라 두가지 선택지가 있습니다.

$ ... $ 형태로 사용
$$ ... $$ 형태로

$\sum_{i=0}^n i^2 = \frac{(n^2+n)(2n+1)}{6}$
$$\sum_{i=0}^n i^2 = \frac{(n^2+n)(2n+1)}{6}$$

$$
여러줄도 가능?
\sum_{i=0}^n i^2 = \frac{(n^2+n)(2n+1)}{6}
\sum_{i=0}^n i^2 = \frac{(n^2+n)(2n+1)}{6}
$$

그리스 문자 사용

다양한 그리스 문자들을 사용할 수 있습니다

\alpha, \beta, ... \omega //소문자
\Gamma, \Delta, ... \Omega //대문자

$\alpha, \beta, ... \omega$
$\Gamma, \Delta, ... \Omega$

지수(upper), 로그 표현(sub)

x^2, x_i^2 // 지수는 ^을 이용하여 표현
\log_2 x // \log를 이용, _를 이용해 subscript 표현

$x^2, x_i^2$
$\log_2 x$

중괄호 그룹 묶기

x^{{5}^6}
x_{i^2}

$x^{{5}^6}$
$x_{i^2}$

괄호

(2+3)[4+4] //소괄호, 대괄호는 그냥 쓰면됨
(2 + 3)[4 + 4] //띄워쓰기 하면 다를까?
\{22\} // 중괄호는 \과 함께 써줘야댐
(\frac{\sqrt x}{y^3}) //수식이 너무 작게 나옴
\left(\frac{\sqrt x}{y^3}\right) // \left(...\right)를 이용해 자동적으로 사이즈 조절 가능

$(2 + 3)[4+4]$
$(2 + 3)[4 + 4]$
${22}$
글씨 비교 $(\frac{\sqrt x}{y^3})$ 글씨 비교
글씨 비교 $\left(\frac{\sqrt x}{y^3}\right)$ 글씨 비교

절대값과 내림, 올림 기호

|x|
\vert x \vert // 절대값
\Vert x \Vert // 벡터크기(둘다 걍 | 써도 됨)
\rangle x \rangle // 꺽인 괄호
\lceil x \ rceil // 올림
\lfloor x \rfloor // 내림

$|x|$
$\vert x \vert$
$\Vert x \Vert$
$\rangle x \rangle$
$\lceil x \ rceil$
$\lfloor x \rfloor$

괄호를 더 크게

\Biggl(\biggl(\Bigl(\bigl((x)\bigr)\Bigr)\biggr)\Biggr)

$ \Biggl(\biggl(\Bigl(\bigl((x)\bigr)\Bigr)\biggr)\Biggr) $

합, 적분 등

\sum_1^n {n^2 + 1} // 표현1
\sum_{i=0}^\infty i^2 // 표현2
\prod \int \bigcup \bigcap \iint \iiint \idotsint // 기타 기호

$ \sum_1^n {n^2 + 1} $
$ \sum_{i=0}^\infty i^2 $
$ \prod \int \bigcup \bigcap \iint \iiint \idotsint $

분수 표현

\frac{a + 1}{b + 1} // 중괄호로 묶어주는게 핵심
{a + 1 \over b+1} // 이런식으로도 가능함

$\frac{a + 1}{b + 1} $
$ {a + 1 \over b+1 } $

여러가지 폰트들

\mathbb or \Bbb
\mathit
\pmb
\mathtt
\mathrm
\mathsf
\mathcal
\mathfrak

$\mathbb{mathbb}$ or $\Bbb{Bbb}$
$\mathit{mathit}$
$\pmb{pmb}$
$\mathtt{mathtt}$
$\mathrm{mathrm}$
$\mathsf{mathsf}$
$\mathcal{mathcal}$
$\mathfrak{mathfrak}$

루트표현

\sqrt{x^3}
\sqrt[3]{\frac xy}

$\sqrt{x^3}$
$\sqrt[3]{\frac xy}$

특별한 표현식

lim, sin, max 등의 표현식들
\sin x or sin x // 뒤에껀 이탈릭채
\lim_{x\to 0} {x^2 + x + 1}
\operatorname{foo}(x) // 정의되지 않은 이름의 함수 쓸때

$\sin x or sin x$
$\lim_{x\to 0} {x^2 + x + 1}$
$\operatorname{foo}(x)$

여러가지 기호들

\lt \gt \le \leq \leqq \leqslant \ge \geq \geqq \geqslant \neq // 비교 구문
\not\lt // not을 붙이면 그어짐
\times \div \pm \mp x\cdot y
\cup \cap \setminus \subset \subseteq \subsetneq \supset \in \notin \emptyset \varnothing
{n+1 \choose 2k} or \binom{n+1}{2k}
\to \rightarrow \leftarrow \Rightarrow \Leftarrow \mapsto
\land \lor \lnot \forall \exists \top \bot \vdash \vDash
\star \ast \oplus \circ \bullet
\approx \sim \simeq \cong \equiv \prec \lhd \therefore
\infty \aleph_0 \nabla \partial \Im \Re
a\equiv b\pmod n
a_1+a_2+\cdots+a_n
\epsilon \varepsilon \phi \varphi \ell

$\lt \gt \le \leq \leqq \leqslant \ge \geq \geqq \geqslant \neq$
$\not\lt$
$\times \div \pm \mp x \cdot y$
$\cup \cap \setminus \subset \subseteq \subsetneq \supset \in \notin \emptyset \varnothing$
${n+1 \choose 2k} or \binom{n+1}{2k}$
$\to \rightarrow \leftarrow \Rightarrow \Leftarrow \mapsto$
$\land \lor \lnot \forall \exists \top \bot \vdash \vDash$
$\star \ast \oplus \circ \bullet$
$\approx \sim \simeq \cong \equiv \prec \lhd \therefore$
$\infty \aleph_0 \nabla \partial \Im \Re$
$a\equiv b\pmod n$
$a_1+a_2+\cdots+a_n$
$\epsilon \varepsilon \phi \varphi \ell$

띄워쓰기

// Mathjax는 띄워쓰기를 해도 따로 인식하지 않음
a\,b // \, thin space
a\;b // \; wider space
a\quad b // large space

$a,b // $
$a;b$
$a\quad b$

텍스트 쓰기

\{x\in s\mid x\text{ is extra large}\} // 띄워쓰기를 자유롭게 하며 텍스트를 쓰고 싶다면?

${x\in s\mid x\text{ is extra large}}$

악센트 기호

\hat x \widehat xy \overline xyz \vec x \overrightarrow xy \overleftrightarrow xy
\frac d{dx}x\dot x =  \dot x^2 +  x\ddot x

$\hat{x} \widehat{xy} \overline{xyz} \vec{x} \overrightarrow{xy} \overleftrightarrow{xy}$
$\frac d{dx}x\dot x = \dot x^2 + x\ddot x$

특별한 문자들

// \ $ { 같은 문자들은 문법에 쓰이는 특별한 문자들이기 때문에 \를 이용하여 이스케이프 문자를 사용한다. 단 \은 \\(줄 갱신) 이 아니라 \backslash 를 사용한다.

\$ \{ \_  \backslash \\ x^2

2차원 배열의 표현

$$
\begin{array}{c|lcr}
n & \text{Left} & \text{Center} & \text{Right} \\
\hline
1 & 0.24 & 1 & 125 \\
2 & -1 & 189 & -8 \\
3 & -20 & 2000 & 1+10i
\end{array}
$$
% outer vertical array of arrays
\begin{array}{c}
% inner horizontal array of arrays
\begin{array}{cc}
% inner array of minimum values
\begin{array}{c|cccc}
\text{min} & 0 & 1 & 2 & 3\\
\hline
0 & 0 & 0 & 0 & 0\\
1 & 0 & 1 & 1 & 1\\
2 & 0 & 1 & 2 & 2\\
3 & 0 & 1 & 2 & 3
\end{array}
&
% inner array of maximum values
\begin{array}{c|cccc}
\text{max}&0&1&2&3\\
\hline
0 & 0 & 1 & 2 & 3\\
1 & 1 & 1 & 2 & 3\\
2 & 2 & 2 & 2 & 3\\
3 & 3 & 3 & 3 & 3
\end{array}
\end{array}
\\
% inner array of delta values
\begin{array}{c|cccc}
\Delta&0&1&2&3\\
\hline
0 & 0 & 1 & 2 & 3\\
1 & 1 & 0 & 1 & 2\\
2 & 2 & 1 & 0 & 1\\
3 & 3 & 2 & 1 & 0
\end{array}
\end{array}

$$
\begin{array}{c|lcr}
n & \text{Left} & \text{Center} & \text{Right} \\
\hline
1 & 0.24 & 1 & 125 \\
2 & -1 & 189 & -8 \\
3 & -20 & 2000 & 1+10i
\end{array}
$$

행렬의 표현

$
    \begin{matrix}
    1 & x & x^2 \\
    1 & y & y^2 \\
    1 & z & z^2 \\
    \end{matrix}
$

\begin{pmatrix}1&2\\3&4\\ \end{pmatrix}

\begin{bmatrix}1&2\\3&4\\ \end{bmatrix}

\begin{Bmatrix}1&2\\3&4\\ \end{Bmatrix}

\begin{vmatrix}1&2\\3&4\\ \end{vmatrix}

\begin{Vmatrix}1&2\\3&4\\ \end{Vmatrix}

\left[\begin{array}{cc|c}
1&2&3\\
4&5&6
\end{array}\right]

\begin{pmatrix}
 1 & a_1 & a_1^2 & \cdots & a_1^n \\
 1 & a_2 & a_2^2 & \cdots & a_2^n \\
 \vdots  & \vdots& \vdots & \ddots & \vdots \\
 1 & a_m & a_m^2 & \cdots & a_m^n    
 \end{pmatrix}

 \begin{pmatrix}
a & b \\
c & d\\
\hline
1 & 0\\
0 & 1
\end{pmatrix}

$\bigl( \begin{smallmatrix} a & b \\ c & d \end{smallmatrix} \bigr)$

$\begin{matrix}1 & x & x^{2} \\ 1 & y & y^{2} \\ 1 & z & z^{2} \\ \end{matrix}$

$\begin{pmatrix}1&2 \\ 3&4 \\ \end{pmatrix}$
$\begin{bmatrix}1&2 \\ 3&4\\ \end{bmatrix}$
$\begin{Bmatrix}1&2 \\ 3&4\\ \end{Bmatrix}$
$\begin{vmatrix}1&2 \\ 3&4\\ \end{vmatrix}$
$\begin{Vmatrix}1&2 \\ 3&4\\ \end{Vmatrix}$

케이스 나누기

f(n) =
\begin{cases}
n/2,  & \text{if $n$ is even} \\
3n+1, & \text{if $n$ is odd}
\end{cases}

\left.
\begin{array}{l}
\text{if $n$ is even:}&n/2\\
\text{if $n$ is odd:}&3n+1
\end{array}
\right\}
=f(n)

$f(n) =
\begin{cases}
n/2, & \text{if $n$ is even}
3n+1, & \text{if $n$ is odd}
\end{cases}$
$\left.
\begin{array}{l}
\text{if $n$ is even:}&n/2\\
\text{if $n$ is odd:}&3n+1
\end{array}
\right\}
=f(n)$

취소선 긋기

\require{cancel}\begin{array}{rl}
\verb|y+\cancel{x}| & y+\cancel{x}\\
\verb|\cancel{y+x}| & \cancel{y+x}\\
\verb|y+\bcancel{x}| & y+\bcancel{x}\\
\verb|y+\xcancel{x}| & y+\xcancel{x}\\
\verb|y+\cancelto{0}{x}| & y+\cancelto{0}{x}\\
\verb+\frac{1\cancel9}{\cancel95} = \frac15+& \frac{1\cancel9}{\cancel95} = \frac15 \\
\end{array}

\require{enclose}\begin{array}{rl}
\verb|\enclose{horizontalstrike}{x+y}| & \enclose{horizontalstrike}{x+y}\\
\verb|\enclose{verticalstrike}{\frac xy}| & \enclose{verticalstrike}{\frac xy}\\
\verb|\enclose{updiagonalstrike}{x+y}| & \enclose{updiagonalstrike}{x+y}\\
\verb|\enclose{downdiagonalstrike}{x+y}| & \enclose{downdiagonalstrike}{x+y}\\
\verb|\enclose{horizontalstrike,updiagonalstrike}{x+y}| & \enclose{horizontalstrike,updiagonalstrike}{x+y}\\
\end{array}

$\require{cancel}\begin{array}{rl}
\verb|y+\cancel{x}| & y+\cancel{x}\\
\verb|\cancel{y+x}| & \cancel{y+x}\\ \verb|y+\bcancel{x}| & y+\bcancel{x}\\ \verb|y+\xcancel{x}| & y+\xcancel{x}\\ \verb|y+\cancelto{0}{x}| & y+\cancelto{0}{x}\\ \verb+\frac{1\cancel9}{\cancel95} = \frac15+& \frac{1\cancel9}{\cancel95} = \frac15 \\ \end{array}$
$\require{enclose}\begin{array}{rl} \verb| \enclose{horizontalstrike}{x+y}| & \enclose{horizontalstrike}{x+y} \\ \verb| \enclose{verticalstrike}{\frac xy}| & \enclose{verticalstrike}{\frac xy} \\ \verb| \enclose{updiagonalstrike}{x+y}| & \enclose{updiagonalstrike}{x+y}\\ \verb| \enclose{downdiagonalstrike}{x+y}| & \enclose{downdiagonalstrike}{x+y}\\ \verb| \enclose{horizontalstrike,updiagonalstrike}{x+y}| & \enclose{horizontalstrike,updiagonalstrike}{x+y}\\ \end{array}$

글씨에 색 입히기

\begin{array}{|rrrrrrrr|}
\hline
\verb+#000+ & \color{#000}{text} & \verb+#005+ & \color{#005}{text} & \verb+#00A+ & \color{#00A}{text} & \verb+#00F+ & \color{#00F}{text}  \\
\verb+#500+ & \color{#500}{text} & \verb+#505+ & \color{#505}{text} & \verb+#50A+ & \color{#50A}{text} & \verb+#50F+ & \color{#50F}{text}  \\
\verb+#A00+ & \color{#A00}{text} & \verb+#A05+ & \color{#A05}{text} & \verb+#A0A+ & \color{#A0A}{text} & \verb+#A0F+ & \color{#A0F}{text}  \\
\verb+#F00+ & \color{#F00}{text} & \verb+#F05+ & \color{#F05}{text} & \verb+#F0A+ & \color{#F0A}{text} & \verb+#F0F+ & \color{#F0F}{text}  \\
\hline
\verb+#080+ & \color{#080}{text} & \verb+#085+ & \color{#085}{text} & \verb+#08A+ & \color{#08A}{text} & \verb+#08F+ & \color{#08F}{text}  \\
\verb+#580+ & \color{#580}{text} & \verb+#585+ & \color{#585}{text} & \verb+#58A+ & \color{#58A}{text} & \verb+#58F+ & \color{#58F}{text}  \\
\verb+#A80+ & \color{#A80}{text} & \verb+#A85+ & \color{#A85}{text} & \verb+#A8A+ & \color{#A8A}{text} & \verb+#A8F+ & \color{#A8F}{text}  \\
\verb+#F80+ & \color{#F80}{text} & \verb+#F85+ & \color{#F85}{text} & \verb+#F8A+ & \color{#F8A}{text} & \verb+#F8F+ & \color{#F8F}{text}  \\
\hline
\verb+#0F0+ & \color{#0F0}{text} & \verb+#0F5+ & \color{#0F5}{text} & \verb+#0FA+ & \color{#0FA}{text} & \verb+#0FF+ & \color{#0FF}{text}  \\
\verb+#5F0+ & \color{#5F0}{text} & \verb+#5F5+ & \color{#5F5}{text} & \verb+#5FA+ & \color{#5FA}{text} & \verb+#5FF+ & \color{#5FF}{text}  \\
\verb+#AF0+ & \color{#AF0}{text} & \verb+#AF5+ & \color{#AF5}{text} & \verb+#AFA+ & \color{#AFA}{text} & \verb+#AFF+ & \color{#AFF}{text}  \\
\verb+#FF0+ & \color{#FF0}{text} & \verb+#FF5+ & \color{#FF5}{text} & \verb+#FFA+ & \color{#FFA}{text} & \verb+#FFF+ & \color{#FFF}{text}  \\
\hline
\end{array}

다이어그램 그리기

\begin{CD}
A @>a>> B\\
@V b V V= @VV c V\\
C @>>d> D
\end{CD}

\begin{CD}
A @>>> B @>{\text{very long label}}>> C \\
@. @AAA @| \\
D @= E @<<< F
\end{CD}

\begin{CD}
  \text{RCOHR'SO$_3$Na} @>{\text{Hydrolysis, $\Delta,$ Dil. HCl}}>> \text{(RCOR')+NaCl+SO$_2$+ H$_2$O} 
\end{CD}

$\begin{CD}
A @>a>> B\\
@V b V V= @VV c V\\
C @>>d> D
\end{CD}$
$\begin{CD}
A @>>> B @>{\text{very long label}}>> C \\
@. @AAA @| \\
D @= E @<<< F
\end{CD}$
$\begin{CD}
\text{RCOHR'SO$_3$Na} @>{\text{Hydrolysis, $\Delta,$ Dil. HCl}}>> \text{(RCOR')+NaCl+SO$_2$+ H$_2$O}
\end{CD}$

응용

\begin{align}
\sqrt{37} & = \sqrt{\frac{73^2-1}{12^2}} \\
 & = \sqrt{\frac{73^2}{12^2}\cdot\frac{73^2-1}{73^2}} \\ 
 & = \sqrt{\frac{73^2}{12^2}}\sqrt{\frac{73^2-1}{73^2}} \\
 & = \frac{73}{12}\sqrt{1 - \frac{1}{73^2}} \\ 
 & \approx \frac{73}{12}\left(1 - \frac{1}{2\cdot73^2}\right)
\end{align}

$\begin{align}
\sqrt{37} & = \sqrt{\frac{73^2-1}{12^2}} \
& = \sqrt{\frac{73^2}{12^2}\cdot\frac{73^2-1}{73^2}} \
& = \sqrt{\frac{73^2}{12^2}}\sqrt{\frac{73^2-1}{73^2}} \
& = \frac{73}{12}\sqrt{1 - \frac{1}{73^2}} \
& \approx \frac{73}{12}\left(1 - \frac{1}{2\cdot73^2}\right)
\end{align}$

x = a_0 + \cfrac{1^2}{a_1
          + \cfrac{2^2}{a_2
          + \cfrac{3^2}{a_3 + \cfrac{4^4}{a_4 + \cdots}}}}

$x = a_0 + \cfrac{1^2}{a_1
+ \cfrac{2^2}{a_2
+ \cfrac{3^2}{a_3 + \cfrac{4^4}{a_4 + \cdots}}}}$

\sum_{n=1}^\infty \frac{1}{n^2} \to
  \textstyle \sum_{n=1}^\infty \frac{1}{n^2} \to
  \displaystyle \sum_{n=1}^\infty \frac{1}{n^2}

$\sum_{n=1}^\infty \frac{1}{n^2} \to
\textstyle \sum_{n=1}^\infty \frac{1}{n^2} \to
\displaystyle \sum_{n=1}^\infty \frac{1}{n^2}$

Radiative Transfer Equation와 같은 복잡한 수식도 사용가능하다.

\\left( {\\partial L(r,\\hat{\\Omega},t)} \\over { \\partial t} \\right)\_{Diff} = \\left( {\\partial L(r,\\hat{\\Omega},t)} \\over { \\partial t}\\right)\_{Ext} + \\left( {\\partial L(r,\\hat{\\Omega},t)} \\over { \\partial t}\\right)\_{Scat} + \\left( {\\partial L(r,\\hat{\\Omega},t)} \\over { \\partial t}\\right)\_{Source}$

$\left( {\partial L(r,\hat{\Omega},t)} \over { \partial t} \right)_{Diff} = \left( {\partial L(r,\hat{\Omega},t)} \over { \partial t}\right)_{Ext} + \left( {\partial L(r,\hat{\Omega},t)} \over { \partial t}\right)_{Scat} + \left( {\partial L(r,\hat{\Omega},t)} \over { \partial t}\right)_{Source}$

+) 손글씨를 Mathjax 문법으로 바꿔주는 사이트

http://detexify.kirelabs.org/classify.html

에서 라텍스 입력 or 원하는 수식을 클릭해서 수정해서 쓸 수 있다.

출처:https://ghdic.github.io/math/default/mathjax-%EB%AC%B8%EB%B2%95/

'창고 > Tistory에 쓰일 기능' 카테고리의 다른 글

글에서 더보기/접기 내용 변경 (0)	2014.03.18

현재글게시글에Latex 쓰는법

Jinlib

MLOps Engineer

공군 정보보호병 면접, Load Balencer, mlops, 머신러닝 프로젝트, MLOps 네카라당토, 이클립스 run as 없음, MLOps 책 추천, ec2, 이클립스 run as, Error invoking remote method 'docker-start-container': Error: (HTTP code 500) server error - Ports are not available: listen tcp 0.0.0.0:50095: bind: An attempt was made to access a socket in a way forbidden by its access permissions., 더보기 이름 변경, docker 실행 안됌, 머신러닝 서비스 배포, devops, MLOps 채용, 엠엘옵스, AWS, sqld 공부, MLOps 강의 추천, python challenge,

Today :
Yesterday :

일	월	화	수	목	금	토
					1	2
3	4	5	6	7	8	9
10	11	12	13	14	15	16
17	18	19	20	21	22	23
24	25	26	27	28	29	30

Jinlib

게시글에Latex 쓰는법

게시글에 Latex를 이용하여 수학 수식 입력하기

Mathjax 문법

인라인모드(한줄 표현), 인클로즈모드(수식 표현)

그리스 문자 사용

지수(upper), 로그 표현(sub)

중괄호 그룹 묶기

괄호

절대값과 내림, 올림 기호

괄호를 더 크게

합, 적분 등

분수 표현

여러가지 폰트들

루트표현

특별한 표현식

여러가지 기호들

띄워쓰기

텍스트 쓰기

악센트 기호

특별한 문자들

2차원 배열의 표현

행렬의 표현

케이스 나누기

취소선 긋기

글씨에 색 입히기

다이어그램 그리기

응용

+) 손글씨를 Mathjax 문법으로 바꿔주는 사이트

'창고 > Tistory에 쓰일 기능' 카테고리의 다른 글

'창고/Tistory에 쓰일 기능'의 다른글

티스토리툴바

게시글에Latex 쓰는법

게시글에 Latex를 이용하여 수학 수식 입력하기

Mathjax 문법

인라인모드(한줄 표현), 인클로즈모드(수식 표현)

그리스 문자 사용

지수(upper), 로그 표현(sub)

중괄호 그룹 묶기

괄호

절대값과 내림, 올림 기호

괄호를 더 크게

합, 적분 등

분수 표현

여러가지 폰트들

루트표현

특별한 표현식

여러가지 기호들

띄워쓰기

텍스트 쓰기

악센트 기호

특별한 문자들

2차원 배열의 표현

행렬의 표현

케이스 나누기

취소선 긋기

글씨에 색 입히기

다이어그램 그리기

응용

+) 손글씨를 Mathjax 문법으로 바꿔주는 사이트

'창고 > Tistory에 쓰일 기능' 카테고리의 다른 글

'창고/Tistory에 쓰일 기능'의 다른글

관련글

티스토리툴바

게시글에Latex 쓰는법