Pandocでのhtmlに数式を表示するオプションを試した

Pandocでtex -> htmlへ変換する際に、数式の表示方法のオプションがあるので試してみました。

Pandoc ユーザーズガイド 日本語版 - Japanese Pandoc User’s Association
にオプションがあります

pandoc 1.12.4.2で試しています。

texの文章は

\begin{equation}
  E = mc^{2}
\end{equation}

$E = mc^{2}$

\(E = mc^{2}\)

を用意しました

latexmthmlを使う場合、

$ pandoc -f latex --latex-engine=lualatex --latexmathml -t html sample.tex -o sample.html

といったコマンドでhtmlへ変換してみます
(実際には作っているWebサービスに組んで実行しました)

htmlのキャプチャとコードを並べてます。

  • デフォルトの出力

<p><span class="math"><em>E</em> = <em>m</em><em>c</em><sup>2</sup></span></p>
<p><span class="math"><em>E</em> = <em>m</em><em>c</em><sup>2</sup></span></p>
<p><span class="math"><em>E</em> = <em>m</em><em>c</em><sup>2</sup></span></p>
  • latexmathml

<p><span class="LaTeX">$$E = mc^{2}$$</span></p>
<p><span class="LaTeX">$E = mc^{2}$</span></p>
<p><span class="LaTeX">$E = mc^{2}$</span></p>
  • jsmath

<div class="math">E = mc^{2}</div>
<p><span class="math">E = mc^{2}</span></p>
<p><span class="math">E = mc^{2}</span></p>
  • mimetex

<p><img style="vertical-align:middle" data-cke-saved-src="/cgi-bin/mimetex.cgi?E%20%3D%20mc%5E%7B2%7D" src="/cgi-bin/mimetex.cgi?E%20%3D%20mc%5E%7B2%7D" alt="E = mc^{2}" title="E = mc^{2}"></p>
<p><img style="vertical-align:middle" data-cke-saved-src="/cgi-bin/mimetex.cgi?E%20%3D%20mc%5E%7B2%7D" src="/cgi-bin/mimetex.cgi?E%20%3D%20mc%5E%7B2%7D" alt="E = mc^{2}" title="E = mc^{2}"></p>
<p><img style="vertical-align:middle" data-cke-saved-src="/cgi-bin/mimetex.cgi?E%20%3D%20mc%5E%7B2%7D" src="/cgi-bin/mimetex.cgi?E%20%3D%20mc%5E%7B2%7D" alt="E = mc^{2}" title="E = mc^{2}"></p>

※ckeditorに表示したため、いくつかプロパティがついてます

  • gladtex

<p><eq env="displaymath">E = mc^{2}</eq></p>
<p><eq env="math">E = mc^{2}</eq></p>
<p><eq env="math">E = mc^{2}</eq></p>
  • webtex

<p><img style="vertical-align:middle" data-cke-saved-src="http://chart.apis.google.com/chart?cht=tx&chl=E%20%3D%20mc%5E%7B2%7D" src="http://chart.apis.google.com/chart?cht=tx&chl=E%20%3D%20mc%5E%7B2%7D" alt="E = mc^{2}" title="E = mc^{2}"></p>
<p><img style="vertical-align:middle" data-cke-saved-src="http://chart.apis.google.com/chart?cht=tx&chl=E%20%3D%20mc%5E%7B2%7D" src="http://chart.apis.google.com/chart?cht=tx&chl=E%20%3D%20mc%5E%7B2%7D" alt="E = mc^{2}" title="E = mc^{2}"></p>
<p><img style="vertical-align:middle" data-cke-saved-src="http://chart.apis.google.com/chart?cht=tx&chl=E%20%3D%20mc%5E%7B2%7D" src="http://chart.apis.google.com/chart?cht=tx&chl=E%20%3D%20mc%5E%7B2%7D" alt="E = mc^{2}" title="E = mc^{2}"></p>

※ckeditorに表示したため、いくつかプロパティがついてます

  • mathjax

<p><span class="math">\[E = mc^{2}\]</span></p>
<p><span class="math">\(E = mc^{2}\)</span></p>
<p><span class="math">\(E = mc^{2}\)</span></p>

色々違いがありました
どれを使おうかな、と

httpsからhttpに戻したのに、httpsに勝手にリダイレクトされる

Nginxにsslを設定してhttpsでアクセスできるようにした置いたサイトをhttpに戻したら使っていたGoogle Chromeで勝手にhttpsへリダイレクトされました

原因はHSTSでした

Nginxで設定していたconfの箇所は以下

  add_header Strict-Transport-Security max-age=15768000;

これで、対応しているブラウザはhttpのアクセスをhttpsにしてくれます
これをブラウザが覚えているせいで、Nginxの設定を変えても、ブラウザでリダイレクトしていたようでした

Google chromeの場合、消すには
chrome://net-internals/#hsts
にアクセス

Delete domainに該当のURLを入力して Delete すれば消えます
サブドメインも入力しないとだめでした

Rails5でBootstrap Toggleが初回表示だけ動かない

Ruby on Rails 5をrailstutorialをやっていれていたので、そこにBootstrap Toggleを導入してみました

gemは

rails 5.0.3
bootstrap-sass 3.3.7
bootstrap-toggle-rails 2.2.1
turbolinks 5.0.1

な感じです

assetにjsとcssをセット

$ vim app/assets/javascripts/application.js

//= require jquery
//= require jquery_ujs
//= require bootstrap
//= require bootstrap-toggle
//= require turbolinks
//= require_tree .

$ vim app/assets/stylesheets/custom.scss

@import "bootstrap-sprockets";
@import "bootstrap";
@import "bootstrap-toggle";

として、bootstrap-toggleを読み込みました

Viewに

<%= check_box_tag "mode", 1, true,
  data: { toggle: "toggle", on: "On", off: "Off", onstyle: "primary", offstyle: "danger" },
  class: "toggle"
%>

を用意
これだけで、表示されてたりします
初回表示がただのチェックボックスで、リロードすると表示されたり..

Turbolinkの動きのせいらしいので、
GitHub - rkallensee/bootstrap-toggle-rails: Bootstrap Toggle plugin for the Rails asset pipeline
に記載があるように

$(document).on('ready page:change', function() {
  $('input[type="checkbox"].toggle').bootstrapToggle(); // assumes the checkboxes have the class "toggle"
});

としたら良さそうでしたが Turbolink 5 からは書き方が違うので

$(document).on('turbolinks:render', function() {
  $('input[type="checkbox"].toggle').bootstrapToggle();
});

としてあげると、正しく動きました

Vivaldiが起動しなくなった

Windows10で使っていたVivaldiが起動しなくなったので、復旧してみました
立ち上げてて、普通に使えてたのが、新しいタブを開いても新しいページが真っ白、Vivaldiを閉じると、立ち上がらなくなり、PC再起動でも変わらず..でした

PCを再起動してから

C:\Users\username\AppData\Local\Vivaldi\Application\User Data

の名前を変えます(e.g. User Data backup)
そして、Vivaldi起動

すると設定のされてないVivaldiが立ち上がりました
いったんVivaldiを閉じて、設定を戻すのにバックアップを取った

C:\Users\username\AppData\Local\Vivaldi\Application\User Data backup\Default

を新しく作られた

C:\Users\username\AppData\Local\Vivaldi\Application\User Data\Default

に上書きします

そして起動!で戻りました

URLバーにabout:aboutでバージョンを確認したら
Vivaldi: 1.10.867.42 (Stable channel) (32-bit)

でした