Logs

18.2.2020:

  • Customize RStudio với mhchem để hiển thị Công thức hóa học.

  • Upload lên RPubs.

22.1.2020:

  • Khởi tạo trang ddrEquation.


6. Equation: ddrEquation



6.3. Hiển thị Chemistry formulae với mhchem

Do RStudio phiên bản hiện hành (v1.2.5033) xài JavaScript MathJax v2.7.2 để hiển thị Công thức toán học, để file “MathJax.js” online trên host RStudio, với config không cho phép biểu diễn những công thức hóa học, hay phương trình hóa học, dù là rất đơn giản. Do vậy, chúng ta cần phải customize bổ sung cho RStudio cũng như RMarkdown, để hiển thị được những Công thức hóa học dạng đơn giản.


Bước 1: Hiển thị trong RMarkdown Editor (RStudio)

  • Trong Windows,

    1. Đổi tên file mhchem.js thành mhchem.bak.js ở thư mục cài đặt RStudio (thông thường là C:/Program Files/RStudio/resources/mathjax-26/extensions/TeX).

    2. Download file https://raw.githubusercontent.com/mhchem/MathJax-mhchem/master/mhchem.js mới nhất (v3.3.2), chép vào thay thế.

  • Mở file MathJax.js ở thư mục C:/Program Files/RStudio/resources/mathjax-26 bằng Notepad dưới quyền Administrator (click chuột phải vào Notepad, chọn Run as administrator). Rồi Enter xuống dòng ở cuối file, bổ sung thêm đoạn code sau, rồi Save lại.

MathJax.Hub.Config({ TeX: { extensions: ["mhchem.js"] } });


Bước 2: Hiển thị trong Viewer (RStudio)

  • Tiếp tục sử dụng Notepad để mở file C:/Program Files/RStudio/resources/presentation/mathjax.html, rồi bổ sung thêm đoạn code TeX: { extensions: ["mhchem.js"] } như sau (nhớ dấu , phân cách):
<script type="text/x-mathjax-config">
    MathJax.Hub.Config({ showProcessingMessages: false, messageStyle: "none", TeX: { extensions: ["mhchem.js"] } });
</script>

<script type="text/javascript" src="https://mathjax.rstudio.com/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML">
</script>


Bước 3: Hiển thị online trên RPubs

  • Tạo file header.html ở cùng thư mục với file RMarkdown đang soạn thảo, để cấu hình cho MathJax load thêm extension dạng online là mhchem.

Nội dung file header.html

<script type="text/x-mathjax-config">
    MathJax.Ajax.config.path["mhchem"] = "https://cdnjs.cloudflare.com/ajax/libs/mathjax-mhchem/3.3.2";
    MathJax.Hub.Config({ TeX: { extensions: ["[mhchem]/mhchem.js"] } });
</script>
  • Chỉ định cho RMarkdown tích hợp thêm nội dung của file header.html vào tag <head> khi xây dựng trang web.
output: 
  html_document: 
    includes:
      in_header: header.html #Thêm đường dẫn nếu file không cùng thư mục.

Lưu ý: Cái chuyện thục vô bằng phím Spacebar hay Tab là rất quan trọng, nhất là ở phần header của RMarkdown.

Tham khảo thêm: https://bookdown.org/yihui/rmarkdown/html-document.html#advanced-customization.


Bước 4: Thử nghiệm lại bằng Công thức hóa học cụ thể

  • $\ce{SO4^2- + Ba^2+ -> BaSO4 v}$ \(\ce{SO4^2- + Ba^2+ -> BaSO4 v}\)

Hoặc:

  • $$\ce{SO4^2- + Ba^2+ -> BaSO4 v}$$ \[\ce{SO4^2- + Ba^2+ -> BaSO4 v}\]

Lưu ý: MathJax v2.7.2 biểu diễn các Công thức Hóa học thông qua Extension (một đoạn JavaScript) là mhchem. Do vậy, để biểu diễn tất cả những Công thức Hóa học mà mhchem hỗ trợ (tùy thuộc vào phiên bản của mhchem), thiết nghĩ, cũng nên xem lướt qua tài liệu của chính tác giả gốc viết.

Tham khảo thêm:

  1. MathJax/mhchem: https://docs.mathjax.org/en/v2.7-latest/tex.html.

  2. Tài liệu mhchem: https://mhchem.github.io/MathJax-mhchem.

  3. Source code mhchem: https://github.com/mhchem/MathJax-mhchem.

  4. LaTeX/mhchem: https://www.ctan.org/pkg/mhchem.





LS0tDQp0aXRsZTogIjYuIEVxdWF0aW9uIg0Kc3VidGl0bGU6ICIoPHNwYW4gc3R5bGU9XCJ0ZXh0LWRlY29yYXRpb246IHVuZGVybGluZVwiPioqRCoqPC9zcGFuPmVzaWduIDxzcGFuIHN0eWxlPVwidGV4dC1kZWNvcmF0aW9uOiB1bmRlcmxpbmVcIj4qKkQqKjwvc3Bhbj5vY3VtZW50cyB3aXRoIDxzcGFuIHN0eWxlPVwidGV4dC1kZWNvcmF0aW9uOiB1bmRlcmxpbmVcIj4qKlJNYXJrZG93bioqPC9zcGFuPikiDQphdXRob3I6ICJUcsOhdCBRdWFuZyBUaOG7pXkiDQpkYXRlOiAiTmfDoHkgMTkvMi8yMDIwIg0Kb3V0cHV0OiANCiAgaHRtbF9kb2N1bWVudDogDQogICAgY29kZV9kb3dubG9hZDogeWVzDQogICAgY29kZV9mb2xkaW5nOiBzaG93DQogICAgY3NzOiBTdHlsZS5jc3MNCiAgICBkZl9wcmludDoga2FibGUNCiAgICBoaWdobGlnaHQ6IGhhZGRvY2sNCiAgICBrZWVwX21kOiB5ZXMNCiAgICBpbmNsdWRlczoNCiAgICAgIGluX2hlYWRlcjogX2hlYWRlcl9NYXRoSmF4Lmh0bWwNCi0tLQ0KDQpgYGB7ciBzZXR1cCwgaW5jbHVkZT1GQUxTRX0NCmtuaXRyOjpvcHRzX2NodW5rJHNldChlY2hvID0gVFJVRSkNCmBgYA0KDQotLS0NCg0KPGRpdiBjbGFzcz0ibG9ncyI+DQo8ZGl2IGNsYXNzPSJsb2dzLWNhcHRpb24iPkxvZ3M8L2Rpdj4NCjxkaXYgY2xhc3M9ImxvZ3MtY29udGVudCI+DQoqKjE4LjIuMjAyMDoqKg0KDQotIGBDdXN0b21pemVgIGBSU3R1ZGlvYCB24bubaSBgbWhjaGVtYCDEkeG7gyBoaeG7g24gdGjhu4sgQ8O0bmcgdGjhu6ljIGjDs2EgaOG7jWMuDQoNCi0gVXBsb2FkIGzDqm4gYFJQdWJzYC4NCg0KKioyMi4xLjIwMjA6KioNCg0KLSBLaOG7n2kgdOG6oW8gdHJhbmcgIGBkZHJFcXVhdGlvbmAuDQoNCjwvZGl2PjwvZGl2Pg0KPGJyLz4NCg0KIyMgNi4gRXF1YXRpb246IGRkckVxdWF0aW9uDQo8YnIvPjxici8+DQoNCjwhLS0NCmh0dHBzOi8vd3d3LmZhY2Vib29rLmNvbS9iYWJ5bW91c2UubmljZS9wb3N0cy80MDQzMzk5MjYyMzUyOTEwDQotLT4NCg0KIyMjIDYuMy4gSGnhu4NuIHRo4buLIGBDaGVtaXN0cnkgZm9ybXVsYWVgIHbhu5tpIGBtaGNoZW1gDQoNCkRvIGBSU3R1ZGlvYCBwaGnDqm4gYuG6o24gaGnhu4duIGjDoG5oIChgdjEuMi41MDMzYCkgeMOgaSBgSmF2YVNjcmlwdGAgYE1hdGhKYXhgIGB2Mi43LjJgIMSR4buDIGhp4buDbiB0aOG7iyBDw7RuZyB0aOG7qWMgdG/DoW4gaOG7jWMsIMSR4buDIGZpbGUgImBNYXRoSmF4LmpzYCIgb25saW5lIHRyw6puIGhvc3QgYFJTdHVkaW9gLCB24bubaSBjb25maWcga2jDtG5nIGNobyBwaMOpcCBiaeG7g3UgZGnhu4VuIG5o4buvbmcgY8O0bmcgdGjhu6ljIGjDs2EgaOG7jWMsIGhheSBwaMawxqFuZyB0csOsbmggaMOzYSBo4buNYywgZMO5IGzDoCBy4bqldCDEkcahbiBnaeG6o24uIERvIHbhuq15LCBjaMO6bmcgdGEgY+G6p24gcGjhuqNpIGBjdXN0b21pemVgIGLhu5Ugc3VuZyBjaG8gIGBSU3R1ZGlvYCBjxaluZyBuaMawIGBSTWFya2Rvd25gLCDEkeG7gyBoaeG7g24gdGjhu4sgxJHGsOG7o2Mgbmjhu69uZyBDw7RuZyB0aOG7qWMgaMOzYSBo4buNYyBk4bqhbmcgxJHGoW4gZ2nhuqNuLg0KDQo8YnIvPg0KKipCxrDhu5tjIDE6KiogSGnhu4NuIHRo4buLIHRyb25nIGBSTWFya2Rvd24gRWRpdG9yYCAoYFJTdHVkaW9gKQ0KDQoqIFRyb25nIGBXaW5kb3dzYCwNCg0KICAxLiDEkOG7lWkgdMOqbiBmaWxlIGBtaGNoZW0uanNgIHRow6BuaCBgbWhjaGVtLmJhay5qc2Ag4bufIHRoxrAgbeG7pWMgY8OgaSDEkeG6t3QgYFJTdHVkaW9gICh0aMO0bmcgdGjGsOG7nW5nIGzDoCBgQzovUHJvZ3JhbSBGaWxlcy9SU3R1ZGlvL3Jlc291cmNlcy9tYXRoamF4LTI2L2V4dGVuc2lvbnMvVGVYYCkuDQoNCiAgMi4gRG93bmxvYWQgZmlsZSBgaHR0cHM6Ly9yYXcuZ2l0aHVidXNlcmNvbnRlbnQuY29tL21oY2hlbS9NYXRoSmF4LW1oY2hlbS9tYXN0ZXIvbWhjaGVtLmpzYCBt4bubaSBuaOG6pXQgKGB2My4zLjJgKSwgY2jDqXAgdsOgbyB0aGF5IHRo4bq/Lg0KDQoqIE3hu58gZmlsZSBgTWF0aEpheC5qc2Ag4bufIHRoxrAgbeG7pWMgYEM6L1Byb2dyYW0gRmlsZXMvUlN0dWRpby9yZXNvdXJjZXMvbWF0aGpheC0yNmAgYuG6sW5nIGBOb3RlcGFkYCBkxrDhu5tpIHF1eeG7gW4gQWRtaW5pc3RyYXRvciAoY2xpY2sgY2h14buZdCBwaOG6o2kgdsOgbyBgTm90ZXBhZGAsIGNo4buNbiBgUnVuIGFzIGFkbWluaXN0cmF0b3JgKS4gUuG7k2kgYEVudGVyYCB4deG7kW5nIGTDsm5nIOG7nyBjdeG7kWkgZmlsZSwgYuG7lSBzdW5nIHRow6ptIMSRb+G6oW4gY29kZSBzYXUsIHLhu5NpIGBTYXZlYCBs4bqhaS4NCg0KYGBgamF2YXNjcmlwdA0KTWF0aEpheC5IdWIuQ29uZmlnKHsgVGVYOiB7IGV4dGVuc2lvbnM6IFsibWhjaGVtLmpzIl0gfSB9KTsNCmBgYA0KDQo8YnIvPg0KKipCxrDhu5tjIDI6KiogSGnhu4NuIHRo4buLIHRyb25nIGBWaWV3ZXJgIChgUlN0dWRpb2ApDQoNCiogVGnhur9wIHThu6VjIHPhu60gZOG7pW5nIGBOb3RlcGFkYCDEkeG7gyBt4bufIGZpbGUgYEM6L1Byb2dyYW0gRmlsZXMvUlN0dWRpby9yZXNvdXJjZXMvcHJlc2VudGF0aW9uL21hdGhqYXguaHRtbGAsIHLhu5NpIGLhu5Ugc3VuZyB0aMOqbSDEkW/huqFuIGNvZGUgYFRlWDogeyBleHRlbnNpb25zOiBbIm1oY2hlbS5qcyJdIH1gIG5oxrAgc2F1IChuaOG7myBk4bqldSBgLGAgcGjDom4gY8OhY2gpOg0KDQpgYGBodG1sDQo8c2NyaXB0IHR5cGU9InRleHQveC1tYXRoamF4LWNvbmZpZyI+DQogICAgTWF0aEpheC5IdWIuQ29uZmlnKHsgc2hvd1Byb2Nlc3NpbmdNZXNzYWdlczogZmFsc2UsIG1lc3NhZ2VTdHlsZTogIm5vbmUiLCBUZVg6IHsgZXh0ZW5zaW9uczogWyJtaGNoZW0uanMiXSB9IH0pOw0KPC9zY3JpcHQ+DQoNCjxzY3JpcHQgdHlwZT0idGV4dC9qYXZhc2NyaXB0IiBzcmM9Imh0dHBzOi8vbWF0aGpheC5yc3R1ZGlvLmNvbS9sYXRlc3QvTWF0aEpheC5qcz9jb25maWc9VGVYLUFNUy1NTUxfSFRNTG9yTU1MIj4NCjwvc2NyaXB0Pg0KYGBgDQoNCjxici8+DQoqKkLGsOG7m2MgMzoqKiBIaeG7g24gdGjhu4sgb25saW5lIHRyw6puIGBSUHVic2ANCg0KKiBU4bqhbyBmaWxlIGBoZWFkZXIuaHRtbGAg4bufIGPDuW5nIHRoxrAgbeG7pWMgduG7m2kgZmlsZSBgUk1hcmtkb3duYCDEkWFuZyBzb+G6oW4gdGjhuqNvLCDEkeG7gyBj4bqldSBow6xuaCBjaG8gYE1hdGhKYXhgIGxvYWQgdGjDqm0gYGV4dGVuc2lvbmAgZOG6oW5nIG9ubGluZSBsw6AgYG1oY2hlbWAuDQoNCk7hu5lpIGR1bmcgZmlsZSBgaGVhZGVyLmh0bWxgDQpgYGBodG1sDQo8c2NyaXB0IHR5cGU9InRleHQveC1tYXRoamF4LWNvbmZpZyI+DQogICAgTWF0aEpheC5BamF4LmNvbmZpZy5wYXRoWyJtaGNoZW0iXSA9ICJodHRwczovL2NkbmpzLmNsb3VkZmxhcmUuY29tL2FqYXgvbGlicy9tYXRoamF4LW1oY2hlbS8zLjMuMiI7DQogICAgTWF0aEpheC5IdWIuQ29uZmlnKHsgVGVYOiB7IGV4dGVuc2lvbnM6IFsiW21oY2hlbV0vbWhjaGVtLmpzIl0gfSB9KTsNCjwvc2NyaXB0Pg0KYGBgDQoNCiogQ2jhu4kgxJHhu4tuaCBjaG8gYFJNYXJrZG93bmAgdMOtY2ggaOG7o3AgdGjDqm0gbuG7mWkgZHVuZyBj4bunYSBmaWxlIGBoZWFkZXIuaHRtbGAgdsOgbyB0YWcgYDxoZWFkPmAga2hpIHjDonkgZOG7sW5nIHRyYW5nIHdlYi4NCg0KYGBgeW1sDQpvdXRwdXQ6IA0KICBodG1sX2RvY3VtZW50OiANCiAgICBpbmNsdWRlczoNCiAgICAgIGluX2hlYWRlcjogaGVhZGVyLmh0bWwgI1Row6ptIMSRxrDhu51uZyBk4bqrbiBu4bq/dSBmaWxlIGtow7RuZyBjw7luZyB0aMawIG3hu6VjLg0KYGBgDQoNCioqKkzGsHUgw706KioqIEPDoWkgY2h1eeG7h24gdGjhu6VjIHbDtCBi4bqxbmcgcGjDrW0gYFNwYWNlYmFyYCBoYXkgYFRhYmAgbMOgIHLhuqV0IHF1YW4gdHLhu41uZywgbmjhuqV0IGzDoCDhu58gcGjhuqduIGBoZWFkZXJgIGPhu6dhIGBSTWFya2Rvd25gLg0KDQoqKipUaGFtIGto4bqjbyB0aMOqbToqKiogPGEgdGFyZ2V0PSJfcGFyZW50IiBocmVmPSJodHRwczovL2Jvb2tkb3duLm9yZy95aWh1aS9ybWFya2Rvd24vaHRtbC1kb2N1bWVudC5odG1sI2FkdmFuY2VkLWN1c3RvbWl6YXRpb24iPmh0dHBzOi8vYm9va2Rvd24ub3JnL3lpaHVpL3JtYXJrZG93bi9odG1sLWRvY3VtZW50Lmh0bWwjYWR2YW5jZWQtY3VzdG9taXphdGlvbjwvYT4uDQoNCjxici8+DQoqKkLGsOG7m2MgNDoqKiBUaOG7rSBuZ2hp4buHbSBs4bqhaSBi4bqxbmcgQ8O0bmcgdGjhu6ljIGjDs2EgaOG7jWMgY+G7pSB0aOG7gw0KDQoqIGAkXGNle1NPNF4yLSArIEJhXjIrIC0+IEJhU080IHZ9JGAgJFxjZXtTTzReMi0gKyBCYV4yKyAtPiBCYVNPNCB2fSQNCg0KSG/hurdjOg0KDQoqIGAkJFxjZXtTTzReMi0gKyBCYV4yKyAtPiBCYVNPNCB2fSQkYCAkJFxjZXtTTzReMi0gKyBCYV4yKyAtPiBCYVNPNCB2fSQkDQoNCioqKkzGsHUgw706KioqIGBNYXRoSmF4YCBgdjIuNy4yYCBiaeG7g3UgZGnhu4VuIGPDoWMgQ8O0bmcgdGjhu6ljIEjDs2EgaOG7jWMgdGjDtG5nIHF1YSBgRXh0ZW5zaW9uYCAobeG7mXQgxJFv4bqhbiBgSmF2YVNjcmlwdGApIGzDoCBgbWhjaGVtYC4gRG8gduG6rXksIMSR4buDIGJp4buDdSBkaeG7hW4gdOG6pXQgY+G6oyBuaOG7r25nIEPDtG5nIHRo4bupYyBIw7NhIGjhu41jIG3DoCBgbWhjaGVtYCBo4buXIHRy4bujICh0w7l5IHRodeG7mWMgdsOgbyBwaGnDqm4gYuG6o24gY+G7p2EgYG1oY2hlbWApLCB0aGnhur90IG5naMSpLCBjxaluZyBuw6puIHhlbSBsxrDhu5t0IHF1YSB0w6BpIGxp4buHdSBj4bunYSBjaMOtbmggdMOhYyBnaeG6oyBn4buRYyB2aeG6v3QuDQoNCioqKlRoYW0ga2jhuqNvIHRow6ptOioqKg0KDQoxLiBgTWF0aEpheGAvbWhjaGVtOiA8YSB0YXJnZXQ9Il9wYXJlbnQiIGhyZWY9Imh0dHBzOi8vZG9jcy5tYXRoamF4Lm9yZy9lbi92Mi43LWxhdGVzdC90ZXguaHRtbCI+aHR0cHM6Ly9kb2NzLm1hdGhqYXgub3JnL2VuL3YyLjctbGF0ZXN0L3RleC5odG1sPC9hPi4NCg0KMi4gYFTDoGkgbGnhu4d1YCBtaGNoZW06IDxhIHRhcmdldD0iX3BhcmVudCIgaHJlZj0iaHR0cHM6Ly9taGNoZW0uZ2l0aHViLmlvL01hdGhKYXgtbWhjaGVtIj5odHRwczovL21oY2hlbS5naXRodWIuaW8vTWF0aEpheC1taGNoZW08L2E+Lg0KDQozLiBgU291cmNlIGNvZGVgIG1oY2hlbTogPGEgdGFyZ2V0PSJfcGFyZW50IiBocmVmPSJodHRwczovL2dpdGh1Yi5jb20vbWhjaGVtL01hdGhKYXgtbWhjaGVtIj5odHRwczovL2dpdGh1Yi5jb20vbWhjaGVtL01hdGhKYXgtbWhjaGVtPC9hPi4NCg0KNC4gYExhVGVYYC9taGNoZW06IDxhIHRhcmdldD0iX3BhcmVudCIgaHJlZj0iaHR0cHM6Ly93d3cuY3Rhbi5vcmcvcGtnL21oY2hlbSI+aHR0cHM6Ly93d3cuY3Rhbi5vcmcvcGtnL21oY2hlbTwvYT4uDQoNCjxici8+PGJyLz48YnIvPjxici8+DQo=