{{b_center
{{ref_ex_image shinyapps.io_font_setting01.png,,size:20%,nolink}}
}}
この記事では、RのShinyアプリをクラウドでホスティングする、[shinyapps.io|https://www.shinyapps.io/]サービスにおいて、グラフィックスに日本語を使用するための設定を紹介します。実際にフォントを設定したShinyアプリやソースコードは、[GitHubリポジトリ|https://github.com/ltl-manabi/shinyapps.io_japanese_font]に置いてあります。
{{outline}}
!!!RStudio Cloudでは設定不要です
先に書いておきますが、shinyapps.ioと同じく、RStudio社のクラウドサービスである、[RStudio Cloud|https://rstudio.cloud/]では、デフォルトでIPAexフォント (下記参照) がインストールされており、標準のゴシック体 (Sans) フォントとして使われるので、フォント関係の設定は (特にこだわりなく日本語が表示されればよいのであれば) 不要です。
!!!Google Colabでも使えます
[Google Colaboratory|https://colab.research.google.com/]でRをランタイムに指定してノートブックを作成する場合、標準では日本語フォントが入っていないため、shinyapps.ioと同様に文字化けします。この記事で紹介している方法が、Colabでも使えます。ただし、スクリプトをダウンロードした際のパスが異なりますので、Colabでは以下のように記述してください。
{{tag "<script src=\"https://gist.github.com/ltl-manabi/b3f98c484bbea4332000512b83b42516.js\"></script>"}}
!!!shinyapps.ioではグラフに日本語が使えない？
shinyapps.ioでは、Shinyアプリを開発し、ローカルでテストしたのち、''rsconnect::deployApp("ディレクトリ名")'' として、簡単にクラウド環境にデプロイ (配備) できます。手元のパソコンで動かすのと同じように動作し、一方でプロジェクトメンバーとの共有や、インターネットに広く公開することが容易{{fn ちなみに、検索には引っかからないようになっているようです。}}です。ある程度までは無料でも使えます。
{{b_center
{{ref_ex_image shinyapps.io_web.png,,size:25%,nolink}}
https://www.shinyapps.io/
}}
shinyapps.ioにデプロイするアプリは、基本的には、ローカルのパソコンと同じように開発、実行できますが、'''日本語フォントがインストールされていないため、そのままでは日本語が表示できません。'''以下のShinyアプリ ([RStudio社のチュートリアル|https://github.com/rstudio-education/shiny.rstudio.com-tutorial]ほぼそのままですが) を、ローカル (Windows) で実行した結果と、shinyapps.ioにデプロイした結果を示します。
{{tag "<script src=\"https://gist.github.com/ltl-manabi/430c13338b12570e33baaaabb22fb360.js\"></script>"}}
{{b_center
{{ref_ex_image shinyapps.io_font_setting02.png,,size:80%,nolink}}
ローカル (Windows) で実行した結果
{{ref_ex_image shinyapps.io_font_setting03.png,,size:80%,nolink}}
shinyapps.ioにデプロイした結果 ([実際のアプリはこちら|https://ltl-manabi.shinyapps.io/shinyappsio_without_japanese_font/])
}}
画像の中で、赤枠で囲ったように、ローカルでは正常に表示される日本語が、shinyapps.ioでは文字化けします。shinyapps.ioでは、シェルで裏側のOSにアクセスできないため、詳しくはわかりませんが、"sans", "serif" などの名前で、日本語までカバーするフォントはインストールされていないようです。この記事では、これを解決するひとつの{{fn もっとナウい方法があるかもしれません。}}方法を紹介します。
!!!日本語フォントを用意する
まず、shinyapps.ioで使用したい日本語フォントを用意します。用意する、といっても、実際には、以下で述べるように、Shinyアプリの中でフォントファイルをダウンロードするので、使用した日本語フォントを機械的に{{fn wgetやcurlなどでダウンロードできる、という意味で。}}ダウンロードできるURLを確認しましょう。

この記事では、以下の4種類の自由に利用できるフォントを使用することにします。
!!IPAexフォント
[IPAexフォント|https://moji.or.jp/ipafont/]は、情報処理推進機構 (IPA) が開発、公開していたフォントです。2020年8月からは[一般社団法人文字情報技術促進協議会|https://moji.or.jp/]という==天下り==団体に権利、配布が移管されています。IPAexフォントは、それ以前から公開されていたIPAフォントの欧文部分について、プロポーショナルにしたフォントです。{{fn 余談ですが、IPAフォントが出る前の日本語フリーフォント界隈は、ライセンス問題や、字体追加の作業者不足や、いろいろ大変でした。筆者はその頃にTeXをそれなりに使っていたので、和田研フォント、東風フォント、さざなみフォント、フォントを合成するなどなど、主流がうつりゆく様子を眺めていました。}}

なお、IPAフォント、IPAexフォントは2019年4月に、新元号「令和」に対応してアップデートされています。
{{b_center
{{ref_ex_image ipaex_004_01_reiwa.png,,size:60%,nolink}}
}}
本題ですが、IPAexフォントは、以下のURLからダウンロードできます。IPAex明朝、IPAexゴシックのセットです。なお、ダウンロード (アプリ開発) の際には、[フォントのライセンス|https://moji.or.jp/ipafont/ipaex00401/]を一読してください。
* https://moji.or.jp/wp-content/ipafont/IPAexfont/IPAexfont00401.zip
!!源ノフォント
[源ノ角ゴシック|https://blog.typekit.com/alternate/source-han-sans-jp/]および、[源ノ明朝|https://source.typekit.com/source-han-serif/jp/]は、Adobe社とGoogle社の共同プロジェクトによって開発された、CJKの幅広い文字を取り扱うことができるオープンソースフォントです。正式な (グローバルな) 名称は "Source Han Sans" (ゴシック)、"Source Han Serif" (明朝) ですが、日本語では'''「源ノ角ゴシック」「源ノ明朝」(げんの) '''と呼ばれています。{{fn このあたり、正確にはわかりませんが、CJKすべてを包括するフォントがSource Hanで、その日本語サブセットが「源ノ」なのだろうと思います。}}
{{b_center
{{ref_ex_image shinyapps.io_font_setting04.png,,size:50%,nolink}}
[源ノ角ゴシックの各種ウェイト|https://fonts.adobe.com/fonts/source-han-sans-japanese]
}}
広い範囲の文字 (グリフ) を扱うため、フォントファイルが巨大でしたが、源ノ角ゴシックについては、[2021年4月にバリアブルフォント化され|https://forest.watch.impress.co.jp/docs/news/1317619.html]、サイズが劇的に小さくなりました。Shinyアプリの実行時にダウンロードしても、さほど待ちは発生しないでしょう。

源ノ角ゴシック (Source Han Sans)、源ノ明朝 (Source Han Serif) は、それぞれ以下のURLからダウンロードできます。
* https://github.com/adobe-fonts/source-han-sans/releases/download/2.003R/SourceHanSans.ttc
* https://github.com/adobe-fonts/source-han-serif/releases/download/1.001R/SourceHanSerif.ttc
上記のURLでは、CJKすべてのグリフ、ウェイトを含むフォントを指定していますが、日本語のみ、単一ウェイトのみで良ければ、より小さなサブセットも使用できます。
* 日本語、Regularウェイトのみ: https://github.com/adobe-fonts/source-han-sans/raw/release/SubsetOTF/JP/SourceHanSansJP-Regular.otf
!!Notoフォント
源ノフォントについて、「Adobe社とGoogle社の共同プロジェクト」と述べましたが、Google社からも成果が公表されており、こちらは'''Notoフォント'''と呼ばれます。グリフがなく、表示したい文字が□で表示されることを、昔から「豆腐」と読んでいますが、Notoフォントは '''"No more Tofu"''' という決意から名づけられたそうです。[Noto Sans|https://fonts.google.com/specimen/Noto+Sans+JP]と[Noto Serif|https://fonts.google.com/specimen/Noto+Serif+JP]が提供されています。
{{b_center
{{ref_ex_image shinyapps.io_font_setting05.png,,size:80%,nolink}}
Noto Sans, Noto Serifのグリフ (上: Sans, 下: Serif)
}}
Notoフォントは、Webデザインの分野で、[Webフォント|https://ja.wikipedia.org/wiki/Web%E3%83%95%E3%82%A9%E3%83%B3%E3%83%88]を使い、サイトの標準フォントとして使用することが極めて多いですが、ファイルとしてもダウンロードできます。ここでは、日本語のみに絞ったサブセットのURLを示しています。
* https://noto-website-2.storage.googleapis.com/pkgs/NotoSansCJKjp-hinted.zip
* https://noto-website-2.storage.googleapis.com/pkgs/NotoSerifCJKjp-hinted.zip
!!瀬戸フォント
ここまで、国や大企業が開発した、実績十分なフォントを紹介しました。shinyapps.ioで、個人製作の手書きフォントなどもちゃんと動くかな、ということを検証したいと思います。{{fn 会社か個人か、というのは本質ではないですが、使用する開発ツールなどを含めて、いろいろと違いがあるだろう、ということで。}}[2021年用、日本語のフリーフォント477種類のまとめ|https://coliss.com/articles/freebies/japanese-free-fonts.html]という記事を眺めていて、収録字体数 (JIS第1 - 第4水準) が豊富で、ライセンス (Open Font License) が明確なものとして、[瀬戸フォント|https://ja.osdn.net/projects/setofont/]を選びました。
{{b_center
{{linkimage https://static-cdn.osdn.net/thumb/g/5/190/800x600_0.png,,width:640,link:}}
[瀬戸フォント公式サイト|https://ja.osdn.net/projects/setofont/]
}}
OSDNのダウンロードページは、ブラウザからアクセスすると、いくつかのページ遷移が発生しますが、[ドキュメント|https://ja.osdn.net/docs/FileRelease_Guide]によると、
"" 直接ダウンロード
"" 現在、wget、curl、libwww-perl、PowerShellからのリリースファイルURLへのアクセスがあった場合、htmlページを経由することなく直接ファイルのダウンロードが開始されます。
ということで、ダウンロードプログラムで以下のURLにアクセスすると、直接zipファイルがダウンロードできます。
* https://ja.osdn.net/projects/setofont/downloads/61995/setofont_v_6_20.zip
なお、OSDNのサイトでは、URLが
 https://ja.osdn.net/projects/setofont/downloads/61995/setofont_v_6_20.zip/
と、末尾にスラッシュがついて表示されますが、curlでは、末尾にスラッシュが入っていると、以下のようなエラーが発生します。
 curl: Remote file name has no length!
 curl: (23) Failed writing received data to disk/application
ご自身でプログラムを使ってダウンロードする際は注意しましょう。

なお、諸々のコードや記事を書いてから判明したのですが、'''瀬戸フォントは fontconfig によるフォント決定メカニズムの中で妙に優先順位が高く'''、IPAexフォント、源ノフォント、Notoフォントよりも優先して、Sans、Serifに対応する日本語フォントとして使用されるようです。つまり、フォントを指定しないで表示する日本語が常に瀬戸フォントになってしまいます。これはこれで、困り者だと思いますので、注意してください。

ということで、今回はこの4つのフォントをShinyアプリで使用し、shinyapps.ioにデプロイする手順を紹介します。
!!!フォントをダウンロード、OSで利用可能にするためのスクリプト
shinyapps.ioはUbuntu Linuxで動作しているようです。そのため上記のフォントをダウンロードし、Linuxで使えるように設定する必要があります。それほど難しい話ではなく、フォントをダウンロードし、Linuxのfontconfigに認識させるシェルスクリプトを作成するだけです。shinyapps.ioのサーバーには、少なくとも ''curl'' コマンドはインストールされているので、それを使います。例えば、IPAexフォントをダウンロードし、fontconfigの ''fc-cache'' コマンドで認識させるには、以下のようなスクリプトを実行します。
{{tag "<script src=\"https://gist.github.com/ltl-manabi/c91a3409c91b94400a0eb2ec55457c49.js\"></script>"}}
このスクリプトを、Shinyアプリの中で呼び出すことで、アプリがデプロイされたサーバーにフォントを登録し、使用できます。
!!!Rプログラムからのスクリプトの実行
なお、shinyapps.ioではシェルにアクセスできませんし、もちろんroot権限もありません。そのため、アプリのRプログラムの中から、上記のスクリプトをダウンロードし、実行します。Rプログラム中でファイルをダウンロードするには、''download.file()'' 関数、任意の外部コマンドを実行するには、''system()'' 関数を使います。
{{tag "<script src=\"https://gist.github.com/ltl-manabi/7785c63a33f00a9db5ef99dd03b1e892.js\"></script>"}}
また、実際にグラフィックスでフォントを指定するには、組み込みの ''plot()'' 関数では、
 plot(..., family = "IPAexGothic")
としたり、
 par(family = "IPAexGothic")
 plot(...)
とします。ggplot2では、以下のようにします。
 g <- ggplot(...) + geom_*()
 g <- g + theme_gray(base_family = "IPAexGothic")
[実際のアプリ例は、リポジトリに公開しています|https://github.com/ltl-manabi/shinyapps.io_japanese_font]ので、そちらをご覧ください。
!!!日本語フォントを指定したShinyアプリの例
上記のような設定を行ったShinyアプリを、以下のURLで公開しています。
* フォント設定なし (文字化け): https://ltl-manabi.shinyapps.io/shinyappsio_without_japanese_font/
* IPAexゴシック & ''plot()'' 関数: https://ltl-manabi.shinyapps.io/shinyappsio_with_ipaex_font/
* 源ノ角ゴシック & ''plot()'' 関数: https://ltl-manabi.shinyapps.io/shinyappsio_with_sourcehan_font/
* Noto Sans & ''plot()'' 関数: https://ltl-manabi.shinyapps.io/shinyappsio_with_noto_font/
* 上記3フォント + 瀬戸フォント + ggplot2: https://ltl-manabi.shinyapps.io/shinyappsio_with_japanese_font_ggplot2/
ggplot2の例では、フォントをダイアログから選択できます。なお、上述のように源ノ角ゴシックとNoto Sansは実体はほぼ同じなので、画面上も違いはありません。また、'''アクセス時に、複数のファイルをダウンロードするため、起動 (画面表示) に20秒から30秒程度かかります。'''
{{b_center
{{ref_image shinyapps.io_font_setting06.gif}}
}}
!!!まとめ
shinyapps.ioには、日本語フォントがインストールされていないので、標準ではグラフィックスに日本語が使用できません。しかし、任意の日本語フォントをダウンロード、インストールすることで、組み込みの ''plot()'' 関数、ggplot2パッケージのいずれにおいても、正常に日本語が表示されるようになります。
!!!注
{{footnote_list}}
----
カテゴリ: {{category R,shiny}}