วันอาทิตย์ที่ 18 ธันวาคม พ.ศ. 2559

การเขียนสมการโดยใช้ \( \LaTeX \) ใน blog เบื้องต้น

สวัสดีครับทุกคน บทความนี้จะอธิบายการเขียนสมการ \( \LaTeX \) ลงใน blog (และ website ทั่วๆไป) ด้วย MathJax อย่างคร่าวๆ (ไม่เกี่ยวกับฟิสิกส์นะครับ) สำหรับคนที่ต้องการศึกษา MathJax เพิ่มเติม สามารถดูได้ตามลิ้งค์ที่ให้ไว้นะครับ [1] [2]

แต่ก่อนอื่นผู้อ่านต้องมีความรู้เกี่ยวกับ \( \LaTeX \) มาบ้างแล้ว สำหรับผู้เริ่มต้นท่านสามารถศึกษา \( \LaTeX \) ได้จากอ้างอิง [3] ซึ่งจะมีไฟล์ pdf เป็นภาษาไทยและภาษาอังกฤษให้ดาวน์โหลด

วิธีที่ง่ายที่สุดที่จะเรียก MathJax ให้ทำงานบน website คือเพิ่ม script ด้านล่างนี้ในส่วน header ของโค้ด html ที่ใช้งานอยู่โดยตรง

 <script type="text/x-mathjax-config">
     MathJax.Hub.Config({TeX: {equationNumbers: {autoNumber: "AMS"}}});
     MathJax.Hub.Config({tex2jax: {inlineMath: [['$','$'],
       ['\\(','\\)']],processEscapes: true}});
 </script>
 <script type="text/javascript" async
     src="https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS_CHTML">
 </script>

เท่านี้ก็สามารถเขียนสมการ \( \LaTeX \) ได้แล้ว!

ต่อไปเรามาดูตัวอย่างโค้ด html ง่ายๆ กันนะครับ

 <html>
 <head>
 <script type="text/x-mathjax-config">
     MathJax.Hub.Config({TeX: {equationNumbers: {autoNumber: "AMS"}}});
     MathJax.Hub.Config({tex2jax: {inlineMath: [['$','$'],
       ['\\(','\\)']],processEscapes: true}});
 </script>
 <script type="text/javascript" async
     src="https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS_CHTML">
 </script>
 </head>
 <body>
     กำหนดให้ \[A + B = C\]
 </body>
 </html>

ซึ่งจะแสดงในหน้าเวปออกมาเป็น

กำหนดให้ \[A + B = C\]

ถ้าแสดงสมการถูกต้อง ก็เป็นอันใช้ได้

โดยทั่วไป รูปแแบบสมการที่แสดงในหน้าเวปจะมี 2 แบบคือ inline และ display

  • inline function จะแสดงสมการแทรกในแต่ละบรรทัด โดยสมการจะอยู่ในเครื่องหมาย \(...\) เช่น
    \(E = mc^{2}\) จะแสดง \(E = mc^{2}\)

  • ส่วน display function จะแสดงสมการในบรรทัดใหม่ จะอยู่ในเครื่องหมาย $$...$$ หรือ \[...\] เช่น
    พิมพ์สมการ \[E = mc^{2}\] จะแสดง \[E = mc^{2}\]
  • ถ้าต้องการใส่เลขสมการกำกับ ใช้ equation แทนดังนี้

     \begin{equation}
     ...
     \end{equation}

    อย่างเช่นสมการที่ (\ref{eq:eq1}) \begin{equation} \label{eq:eq1} E = mc^2 \end{equation} เป็นยังไงบ้างครับ ไม่ยากเลยใช่มั้ย แค่นี้ก็สามารถสร้างสมการสวยๆ บนเวปไซต์ได้แล้ว แล้วไว้พบกันในบทความต่อไปนะครับ

    อ้างอิง

    [1] http://docs.mathjax.org/en/latest/tex.html.
    [2] https://www.w3.org/Math/MJ/Overview.html.
    [3] https://www.ctan.org/tex-archive/info/lshort/.

    ไม่มีความคิดเห็น:

    แสดงความคิดเห็น