2014年11月5日 星期三

20141105 MathJax

今天看到一則轉貼椅子設計師的文章,記得以前看GQ時曾看過他,我滿喜歡他曾說過的一段話
  • “We must play-but must play in serious way.” 要玩,但要玩得嚴謹。
  • 關於創意, 漢斯.韋格納 曾說出上述名言,可看得出他的設計並非純然天馬行空,而是將最自由的意念灌注在最精準的執行上
發現一個滿實用的訓練玩意
看到黃雅信今天貼給我她熱騰騰的新文章,滿喜歡估狗台灣區總經理說的這句話
  • 我們,不是活在海島,而是活在海洋。
去看mike-map的code時,發現我對CSS幾乎沒什麼概念,該開始學習CSS了,估狗找到這篇文章,覺得不錯,開始學習
看到conprehensive這單字,覺得眼熟,在查單字時突然想知道它的字根,於是估狗時發現一個有趣的部落格
讀英文習慣去學字根是受以前補飛哥英文的影響,這比只是背單字有更多的畫面 ^_^
另外這網站的展開收放選單的構想我滿喜歡的


剛剛發現從Jerome Etienne的Twitter看到一篇感覺很厲害的文章,沒詳讀但依舊感覺到非常厲害,讀到文章末看到他的reference少說有10篇以上,就決定把這部落格收藏起來了,這部落格裡有各種遊戲構想,非常適合閒暇時閱讀之
先前構思許久,要如何在遊戲中顯示數學式,取自mike-map的文字是透過CSS購成,於是就從CSS著手估狗,發現有一個用JavaScript寫的Library:MathJax

估狗找到雄: MathJax : 在網頁中顯示數學式子這篇時,發現它的數學式真漂亮,不過在開網頁時需要再前端運算,滿花時間的

運算完結果


看到另一篇文章,說"這種耗時的處理腳本的放到頁面後面加載更合理",恩....很有道理,這作者用Hexo來弄,估狗到一些資料知道,Hexo可以結合GitHub架獨立部落格,但這種事就等以後再說了

估狗良久找到一個還算詳細的用MathJax在部落格貼數學式教學
發現一個youtube影片教學

找到一個很齊全的各種公式整理
找了幾篇中文的文章讀,關於MathJax設定,幾乎都出自這兩篇文章

並在此備份MathJax的設定出自

非常有趣,這次沒辦法再bloger的HTML裡用<pre></pre>來紀錄code,因為遇到<script></script>這段keyword,該繼續找辦法處理,畢竟我不太喜歡用外面網站的外掛來紀錄code

還在edit blogger,用預覽模式時就可以看到在載入MathJax
我們測試雄: MathJax : 在網頁中顯示數學式子
input: (兩個錢字號暫時用全形字代替,以免被 MathJax 轉譯了)
$$\frac{1}{5}+\frac{2}{5}=\frac{3}{5}$$

output:
$$\frac{1}{5}+\frac{2}{5}=\frac{3}{5}$$
經測試後,確實可以如期顯示我要的

發現一個有趣的事,現在用Chrome開MathJax的首頁,首頁右上角的數學式會變亂碼,但是一開始我第一次看這網頁時都沒發生這種事
為了要驗正,是chrome本身的問題,所以我用FireFox再開一次MathJax的首頁,結果就正常了
想了老半天,哪裡有問題,後來想起來,我在讀過後段班聯合戰線: MathJax這文章最末端裡,用了它推薦的chrome外掛:Daum Equation Editor ,想起後曾試圖把它移除,但是徹底失敗 =..=

既來之則安之,於是就開始測試Daum Equation Editor,真的滿好用,但輸出然後呢,我還是要轉成MathJax的code才能在我的broswer上顯示math equation啊,後來發現,我在主視窗弄好數學式後,下面的較狹長的視窗就會自動生成MathJax的code,這點真的是太正了,以後我只需要在這網站弄好math equation就自動生出code,而不用一一去查表
測試從Daum Equation Editor視覺編譯好數學方程式後,輸出的結果
$$\frac { 2 }{ 3 } \times \sin { 60 } $$
先去看漫畫,晚點測試把它包入Require.js,實作在我要做的遊戲上面

(以下2014/12/07新增)
使用Math Jax test | CodePen來測試,已成功。已成功在對話窗裡顯示方程式,實作於Retractable Dialog with MathJax | CodePen
(以上2014/12/07新增)

沒有留言:

張貼留言