タイルドディスプレイシステム ChOWDER の超⼤規模画像データ表⽰機能とその応⽤事例
川鍋 友宏 1), 小野 謙二 1),2),3), 櫻井 大督 3)1) 理化学研究所 計算科学研究センター
2) 九州大学 情報基盤研究開発センター
3) 九州大学 情報基盤研究開発センター附属汎オミクス計測・計算科学センター
tkawanabe@riken.jp, keno@cc.kyushu-u.ac.jp,
sakurai.daisuke.950@m.kyushu-u.ac.jp

Ultra-High-Resolution Image Display Function of Tiled Display System
ChOWDER and its Application
Tomohiro Kawanabe 1), Kenji Ono 1),2),3), Daisuke Sakurai 3)
1) Center for Computational Science, RIKEN
2) Research Institute for Information Technology, Kyushu Univ.
3) Pan-Omics Data Driven Innovation Research Center, Kyushu Univ.
概要

理研と九州大学が共同で開発するタイルドディスプレイシステム ChOWDER は複数拠点でコンテンツ共有が可能なウェブベースのタイルドディスプレイシステムである。最近、大規模静止画データを分割してディスプレイに配信することで表示性能を改善する機能を実装した。本機能の紹介に加え、理研、九大での利用事例についても紹介する。

1

はじめに

2

ChOWDER

科学に限らず、時代はビッグデータである。そ2.1 概要

れは計算機、ネットワークの高速化と大規模化に理化学研究所と九州大学が共同で開発するソよりもたらされた。 入力データの爆発的な増加にフトウェア、ChOWDER[1][2] (Cooperative Workspace

対応すべく、機械学習を筆頭に様々な分析手法がDriver)は、複数の物理ディスプレイ装置を並べて提案されているが、最終的なデータ提示装置とし配置することで、全体を１つの大きなディスプレてのディスプレイデバイスは、4K〜5K 程度の解イエリアとして利用する、いわゆるタイルドディ像度のディスプレイが一般的に入手可能かつ実用スプレイウォールを実現するものである。

的な最大解像度であって、ここ数年ほとんど変化

システム概要を［図１］に示す。システムはデがない。入力データは爆発的に増え続けているにィスプレイ、コントローラ、サーバ、の３つのコも関わらず、ディスプレイ解像度の進化は相対的ンポーネントで構成される。に遅く、結果として人間に提示される情報はますディスプレイは、物理ディスプレイとそれに接ます間引かれることになる。単位面積あたりの画続された PC である。物理ディスプレイは、ウェ素数は人間の認知力の限界に近づいているため、

ブ ブ ラウ ザ（ Google Chrome あ るいは Mozilla

平面ディスプレイが提示する情報量を増やすには、Firefox を推奨）をフルスクリーン表示状態で用い物理的な面積を広げるのが現実的な方法である。て、ChOWDER のコンテンツ表示領域とする。デ筆者らが提案する ChOWDER は、特別なハードィスプレイ装置はウェブブラウザのみ必要であり、ウェアやソフトウェアを必要としない、ウェブベ他にソフトウェアのインストールは必要ない。つースのタイルドディスプレイシステムである。本

まりウェブブラウザ機能が内蔵されたテレビや、稿ではこのシステムを用いて、16K を超える解像タブレットデバイスなどもディスプレイとして利度の画像データを高速に表示する手法を紹介する。

用可能である。
コントローラはディスプレイやコンテンツを217

システムに登録し、その位置やサイズを制御する

みならずディスプレイの拡大・縮小率の変更が可ための PC である。ディスプレイ同様、コントロ能であるため、図２に示すように Site A が 2×2 構

ーラ機能はウェブブラウザ上で動作するため、コ成のタイルドディスプレイ、Site B が１つのディントローラ PC に特別なソフトウェアのインストスプレイを利用するような、異なる物理解像度、ールは必要ない。

アスペクト比であっても、両サイトがコンテンツ[3]サーバは Node.js と呼ばれる JavaScript 実行環をミラーリング共有することが可能である。
Virtual Display Area (VDA)

境上で動作する Web サーバとして実装されており、ディスプレイ、コントローラ PC のウェブブラウザからの接続要求を受け付け、それぞれのブラウザが ChOWDER のディスプレイ、コントローラと振る舞うように制御する。

Instance of VDA at
Site A (2x2 Tiled Displays)

また、サーバは外部アプリケーションから接続

Instance of VDA at
Site B (single Display)

図２ Virtual Display Area 概念

可能な WebAPI を提供しており、サードパーティアプリケーションが ChOWDER ディスプレイにコウェブベースのタイルドディスプレイシステンテンツを表示することができる。理研が開発すムとしては、米国イリノイ大学を中心に開発される大規模並列可視化ソフトウェア HIVE[4]がこのる SAGE2[5]がデファクトスタンダードであるが、API を利用しており、HIVE が出力する大規模可視ディスプレイ構成はサーバの設定ファイルで静的化画像を ChOWDER ディスプレイ上に表示可能でに指定する必要があるうえ、複数拠点でコンテンある。本稿が紹介する大規模画像表示機能も、こツミラーリングを行う場合、各拠点が全て同じデの API を利用して実装したものである。

ィスプレイ構成をとる必要がある。ChOWDER は
VDA 概念がもたらす設定の自由度により、SAGE2と比較して柔軟性の高いシステムであるといえる。
[2]

3 大規模画像表示機能
3.1 開発経緯
上述のとおり ChOWDER はウェブブラウザを表示用ソフトウェアとして利用しているため、表示可能なデータ種別やレンダリング性能などは、ウェブブラウザに依存している。ウェブブラウザ

図１ ChOWDER システム概要のエコシステムを利用することで開発コストが抑2.2 Virtual Display Area
ChOWDER の最も特徴的な機能として、VDA(Virtual Display Area)が挙げられる［図２］。これはシステムが管理する仮想的な２次元表示空間であり、最大で 90071992547409912 ピクセルの表示空
間 を ユ ー ザ に 提 供 す る （ 9007199254740991 はJavaScript における整数の最大値）。ユーザはシステムを利用する際にこの VDA 内の任意の場所に物理ディスプレイの位置を割り当てる。物理ディスプレイは複数割当可能であり、格子状に割り当てれば所謂タイルドディスプレイとなる。表示するコンテンツも VDA 上の任意の位置に登録可能である。コンテンツはタイルドディスプレイを構成する複数の物理ディスプレイ間をまたがった移動や拡縮が可能である。VDA 上ではコンテンツの218えられるメリットがあるが、ソフトウェアの仕組み上、大規模なデータを扱う場合に無駄なデータ転送コストとレンダリングコストを支払うこととなる。
［図 3］に示すような、２×２構成のタイルドディスプレイにおいて全体の中央に画像コンテンツを表示する場合を考える。ChOWDER では、VDA 上のコンテンツとディスプレイの位置情報にもとづき、そのコンテンツが表示されるディスプレイにコンテンツを配信する。この場合、４つ全てのディスプレイに画像データが配信される。
各ディスプレイが受信するデータは、表示されている部分領域ではなく、非表示領域も含めた画像データ全体である。これは無駄な通信コストにみえるが、操作者が表示コンテンツの位置の移動や拡縮を行った場合、ディスプレイにはコンテンツ3.2 機能説明の位置情報や拡縮率といったメタデータの配信だ

超大規模画像は、HPC でのシミュレーション結けで済むため軽快な操作が可能で、総合的に経済果データや、気象衛星観測データなど、バッチ処的な仕組みである。

理で生成されることが多い。そのため、ChOWDERの従来操作（ウェブブラウザをユーザが操作）によるコンテンツ登録よりも、バッチ処理から直接コンテンツが登録可能とするほうが汎用性が高いと 考 え 、 コ マ ン ドラ イ ン プ ロ グラ ム
tileimage.sh として実装した。ユーザはシェルスクリプトとして実行するが、中身は Node.js を利

図３ 各ディスプレイが保持する画像データの例

用した JavaScript プログラムである。利用例を以下に示す。

しかし一方で、タイルドディスプレイの表示エリア全体を覆うほどに大規模な画像データについtileimage.sh [--config=configfile] imagefileて同様な仕組みを適用すると、無駄なデータ転送とウェブブラウザでの描画処理による性能低下、具体的に言えばコンテンツを登録してから表示されるまでにかかる時間の増加が著しい。例えば［図４］に示す大規模画像を理研が所有する
ChOWDER 装置［図５］で表示するのにかかった時間は 18.00 秒であった。SAGE2 においても同一

imagefile は表示したい画像ファイル名である。JPEG と PNG 形式に対応している。--config
オプションに指定する設定ファイル（JSON 形式）の例を以下に示す。xsplit, ysplit はそれぞれ横、縦方向の画像分割数である。
{"id": "APIUser","password": "my_password","url": "ws://my_ChOWDER_server:8081/v2/","xsplit": 8,"ysplit": 8,"contentid": "my_content01","contentgrp": "default"

条件で測定したところ、20.53 秒かかった（いずれも５回計測の平均）。そのため、このような大規模画像については移動操作の軽快さよりも、コンテンツ登録時の表示高速化が必要と考え、画像を分割し、表示先ディスプレイのみに配信することで、通信と描画コスト両方を改善する大規模画像表示機能を実装した。[6]}tileimage.sh コマンドが実行されると、引数で指定された画像ファイルを指定の個数に矩形分割して ChOWDER サーバへ送信する。サーバは各分割画像を配信すべきディスプレイを VDA の位置情報から算出し、送信する。なお、画像分割処理では、JPEG 形式の圧縮処理の分割単位に合わせ、8 ピクセル単位で分割位置が決定される。
＊

図４ 計測に用いた画像データ

3.3 性能評価（JPEG 形式、15360×6480 ピクセル、約 86.8MB）＊Data courtesy of JAMSTEC and AORI/The University of Tokyo(HPCI SPIRE3) collaboration with RIKEN AICS

tileimage.sh コマンドを使い、［図４］の大規模画像を［図５］の装置において、コマンド実行から表示完了までの時間を、画像分割数を変えて計測した結果を［表１］に示す。

図５ 理研所有の ChOWDER 装置構成図

219

が設置され、ChOWDER が利用可能である。今後、

表１ 大規模画像分割機能の速度計測結果
分割パターン

時間（秒）

（横×縦）
２×２

各５回計測の平均
9.50

３×３7.14

４×３

6.62

４×４

6.90

５×５

7.08

６×６6.76

７×７

7.14

８×６

6.67

８×８

6.85

９×９6.84

理研の ChOWDER 装置と連携させたリモートコラボレーション機能の検証を予定している。

図７ 九大筑紫キャンパスに設置された
タイルドディスプレイ
また、JHPCN 課題「HPC と高速通信技術の融この結果に見る通り、従来機能での表示時間合による大規模データの拠点間転送技術開発と実（18.0 秒）に対して最大で約 2.7 倍の高速化が図データを用いたシステム実証試験」[7]に参加するれた。４×３、８×６分割は、今回の物理ディス千葉大学環境リモートセンシングセンターのタイプレイ構成と分割パターンが一致するため、最もルドディスプレイにおいても ChOWDER が利用さ高速な分割数であるが、期待したほどの性能差にれている。気象衛星ひまわりから生成される 22Kは表れなかった。今回の条件では、３×３分割以×22K 相当の大規模気象画像を閲覧する要求があ上であれば、体感的な速度差はなく、従来機能とり、本稿で紹介した大規模画像表示機能を適用し、比較して十分高速であると感じられた。

その効果を検証する予定である。

4 ChOWDER 利用事例

5 まとめ

理研計算科学研究センター内のタイルドディ

本稿ではウェブベースのタイルドディスプレ

スプレイ（前掲の図［５］）は、廉価な民生用 4K

イシステム ChOWDER に新たに追加した大規模解像度の 43 インチ液晶ディスプレイを用い、横４画像表示機能を紹介した。本機能を利用すること×縦３の計１２枚で構成され、縦列毎に１台のMac mini に接続されている。縦列毎に可動するので、［図６］のように円弧状に配置でき、没入感をで、16K 解像度画像の表示速度が評価環境において約 2.7 倍高速化することが確認できた。また、
ChOWDER は現在、理研 R-CCS、九州大学、千高めることが可能である。

葉大学において、HPC シミュレーション結果の可視化や、気象衛星観測データなどの大規模画像を等倍サイズのまま閲覧する装置として利用されている事例を紹介した。今後は ChOWDER が従来から持つ特徴であるリモートコラボレーション機
能と、本稿で紹介した大規模画像表示機能を組み合わせ、遠隔地間での大規模データのコラボレーション分析などの応用を進める予定である。
図６ 円弧状配置の ChOWDER 装置（理研 R-CCS）

ChOWDER は BSD2 ライセンスによるオープ
ンソース・ソフトウェアとしてユーザ向けドキュ

九州大学情報基盤研究開発センター附属汎オ
ミクス計測・計算科学センター（筑紫キャンパス）には、50 インチ 4K 解像度液晶ディスプレイを横５×縦３に配置したタイルドディスプレイ［図７］220

メントと共に Github にて公開[8]しており、アカデミアのみならず企業ユーザにも幅広く使っていただけることを願っている。

6 謝辞
ChOWDER は、内閣府戦略的イノベーション創造プログラム(SIP) 革新的設計生産技術の採択
テーマ「全体俯瞰設計と製品設計の着想を支援するワークスペースの研究開発」においてプロトタイプの開発を行った。また、東京理科大学工学部
情報工学科 藤井・立川研究室には、本システム応用利用を通して、ユーザビリティ向上に関して多大なるご貢献を頂いた。関係各位に感謝いたします。

参考文献[1] Kawanabe, T., Nonaka, J., & Ono, K. (2018,August). ChOWDER: Dynamic contents sharing
through remote tiled display system. In: 11thInternational Symposium on Visual Information
Communication and Interaction, VINCI 2018 (pp.
108-109). Association for Computing Machinery.
[2] Kawanabe T., Nonaka J., Hatta K., Ono K. (2018)
ChOWDER: An Adaptive Tiled Display Wall
Driver for Dynamic Remote Collaboration. In:Luo Y. (eds) Cooperative Design, Visualization,and Engineering. CDVE 2018 (pp. 11-15).
Lecture Notes in Computer Science, vol 11151.
Springer, Cham.
[3] https://nodejs.org[4] Nonaka, J., Ono, K., Sakamoto, N., Hayashi, K.,Kawanabe, T., Shoji, F., & Hatta, K. (2018).
HIVE: A Cross-Platform, Modular Visualization
Ecosystem for Heterogeneous Computational
Environments. In: SC18 Poster, November 2018,Dallas, Texas USA.
[5] Thomas Marrinan, Jillian Aurisano, Arthur
Nishimoto, Krishna Bharadwaj,Victor Mateevitsi,
Luc Renambot, Lance Long, Andrew Johnson,
and Jason Leigh. Sage2: A new approach for dataintensive collaboration using scalable resolution
shared displays. In Collaborative Computing:
Networking, Applications and Worksharing(CollaborateCom), 2014 International Conferenceon, pages 177–186. IEEE, 2014.
[6] Kawanabe T., Nonaka J., Sakurai D., Hatta K.,
Okayama S., Ono K. (2019) Showing
Ultra-High-Resolution Images in VDA-Based
Scalable Displays. In: Luo Y. (eds) Cooperative
Design, Visualization, and Engineering. CDVE
2019. Lecture Notes in Computer Science, vol11792. Springer, Cham (in press).
[7] https://jhpcn-kyoten.itc.u-tokyo.ac.jp/ja/abstract.p
hp?ID=jh190005-MDH[8] https://github.com/SIPupstreamDesign/ChOWDER221