MathJaxを使ってtex形式で書いた数式を表示できるようにしました。
通常はhtmlに数行追加するだけで使えるようになります。
ただ、markdownでも数式を書けるようにするためには、レンダラの定義が必要だったのでメモしておきます。
まずはテンプレートにMathJaxの設定を追加します。現在IE8対策は必要ないようです。
In MathJax v2.0, IE8 and IE9 run faster in their IE8 and IE9 standards mode than in IE7 emulation mode. (http://www.mathjax.org/resources/browser-compatibility/)
このブログではテンプレートにhamlを用いているので、default.hamlを以下のようにしました。
!!! XML
!!! 5
<!-- default.haml -->
%html{:xmlns =>"http://www.w3.org/1999/xhtml"}
%head
%script{:type => "text/x-mathjax-config"}
MathJax.Hub.Config({tex2jax: {inlineMath: [['$','$'], ['\\(','\\)']]}});
%script{:type => "text/javascript", :src => "https://c328740.ssl.cf1.ra"+ |
"ckcdn.com/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"} |
%bodymarkdown内でも書けるように、default.rbファイルで以下のようにレンダラを定義しました。codespanではinlineでの数式描画を設定しています。
#default.rb
require "redcarpet"
require "cgi"
require "coderay"
class ArticleRenderer < Redcarpet::Render::XHTML
def block_code(code, language)
if language=="mathjax"
"<script type=\"math/tex; mode=display\">\n#{code}\n</script>"
elsif language
CodeRay.scan(code, language).div(:line_numbers => :table,
:line_number_anchors => false,
:bold_every => false)
else
"\n<pre><code>#{code}</code></pre>\n"
end
end
def codespan(code)
if code[0] == "$" && code[-1] == "$"
"<script type=\"math/tex\">#{code[1...-1]}</script>"
elsif code[0..1] == "\\(" && code[-2..-1] == "\\)"
"<script type=\"math/tex\">#{code[2...-2]}</script>"
else
"<code>#{code}</code>"
end
end
endRulesでfilter適用時にrendererオプションを定義します。
#Rules
#compile ----------------------------------------------------------------------
compile '*' do
if item.binary?
# don't filter binary items
else
case item[:extension]
when 'md'
filter :redcarpet, :options => { :fenced_code_blocks => true,
:autolink -> true },
:renderer => ArticleRenderer
layout 'default'
else
filter :haml
layout 'default'
end
end
endこれで使えるようになりました。
ニュートンの運動方程式は、`$F = ma$`です。
ピタゴラスの定理は、`\(a^2 = b^2 + c^2\)`です。ニュートンの運動方程式は、$F = ma$です。ピタゴラスの定理は、\(a^2 = b^2 + c^2\)です。
ミカエリスメンテンの式
```mathjax
v = \rm\frac{V_{max}[S]}{K_m + [S]}
```ミカエリスメンテンの式
v = \rm\frac{V_{max}[S]}{K_m + [S]}