DEIM Forum 2016 F4-3

クラスタリングとヒートマップによる時系列データ可視化	 
熊谷 沙津希†伊藤 貴之†

本橋 陽介‡

梅津 圭介‡

高塚 正浩‡‡†お茶の水女子大学大学院 人間文化創成科学研科 〒112-0012 東京文京区大塚 2-1-1‡日本電気株式会社情報・ナレッジ研究所 〒211-8666 神奈川県川崎市中原区下沼部 1753‡‡The University of Sydney, Faculty of Engineering and Information Technologies
J12 School of IT Building, The University of Sydney NSW 2006 Australia

E-mail:†{satsuki, itot}@itolab.is.ocha.ac.jp,‡y-motohashi@bk.jp.nec.com,‡k-umezu@ak.nec.com,‡‡masa.takatsuka@sydneyu.edu.au
あらまし時系列データの可視化には折れ線グラフと並んでヒートマップがよく用いられる．ヒートマップは標本数の多い時系列データにおいて大きな画面空間を要することから，重要でない標本や時刻のフィルタリングが重要となる．本報告ではヒートマップを用いた時間列データ可視化の一手法として，標本群や時刻群の位置関係を表現するために散布図表示を併用し，さらに標本と時刻をフィルタリングするためのGUIを搭載した手法を提案する．
我々の実装では，任意の2標本間または2時刻間の距離を定義し，その距離を用いて標本群や時刻群の系統樹を構築し，それに沿ってヒートマップのデザインを決定する．それと同時に，標本群および時刻群の位置関係を2つの散布図で表示することで，標本群や時刻群の分布を可視化する．
キーワード

ヒートマップ，可視化，クラスタリング

1. 概 要ヒートマップは，時系列データ可視化のための効果的な表現の一つであり，折れ線グラフと同様に広く用いられている手法である．しかしながら，入力データが変数や時刻を多数含むとき，表示のための画面領域を大幅に必要とする場合がある．我々は，時系列データ可視化においてヒートマップを適切に形成するとともに，重要ではない標本や時刻を対話的にフィルタリングすることが重要であると考える．本報告では，変数と時刻の有意義な表示を可能にし，ユーザが対話的に操作できる時系列データのためのヒートマップベースな可視化手法について議論する．

図 1 提案手法の画面キャプチャ例

我々が開発しているヒートマップベースの可視化手法の画面キャプチャを図 1 に示す．本手法では 2 標
本 間 の 非 類 似 度 ，お よ び 2 時 刻 間 の 非 類 似 度 を 算 出 し ，その位置関係を 2 つの散布図で表示する．それと同時

2. 関 連 研 究
時系列データの可視化には，一般的に折れ線グラフやヒートマップを用いた可視化が利用されている．に，非類似度にもとづいて標本群の系統樹を生成し，画面空間の横軸に時刻を割り当てる形式で時系列系統樹上での標本群の隣接性にもとづいてヒートマッデータを可視化する手法として，折れ線グラフとヒープを生成する．図 1 において画面の左半分にはヒートトマップが広く用いられている．折れ線グラフはヒーマップが表示され，画面の右半分には 2 つの散布図がトマップに比べて，各標本における正確な数値を読み表示されている．画面の右端には 2 つのスライダー部取りやすい，また線の傾きから数値の上昇や下降を読品が搭載されており，これを操作することで重要でなみ取りやすい，などの利点がある．しかし，データをい標本，または重要でない時刻をヒートマップから割構成する標本数の増加とともに，折れ線どうしの絡み愛するための閾値を調節することができる．

合いも増加し，視認性低下の原因となる．これらの問A = {𝑎! , … , 𝑎! }𝑎! = {𝑣!! , … , 𝑣!" }T = {𝑡! , … , 𝑡! }𝑡! = {𝑣!! , … , 𝑣!" }題を解決するために，折れ線の表示数を対話的に調節
す る 手 法 が 提 案 さ れ て い る [1]．ま た ，数 値 の 範 囲 が 大
きく，かつ数値分布が不均一である場合には，画面領域を浪費するような可視化結果になることが多い，という問題もある．
ヒートマップは値の大きさを色で表示する可視化

以 上 の 定 義 に よ り ，各 標 本 お よ び 各 時 刻 は ベ ク タ と して 表 現 さ れ る ． 図 2(1)の 赤 線 が 1 個 の 標 本 を ， 図 2(1)手法である．ヒートマップを用いた時系列データの可の青線が 1 個の時刻に対応する．

視化には，データを構成する標本を縦軸に沿って一列	  提 案 手 法 で は 任 意 の 時 刻 間 の 非 類 似 度 （ 以 下 距 離 とずつに並べ，横軸に何らかの変数（時系列データの場称する）を算出して，それらの距離関係を表す散布図

合には時刻）を割り当てて，両軸を分割して得られるを 図 2(2)の よ う に 表 示 す る ． 同 様 に 提 案 手 法 で は ， 任各領域に色付ける．ヒートマップは標本数が大きなデ意の標本間の距離を算出して，それらの距離関係を表ータにおいても，数値を表現する形状が画面上で重なす 散 布 図 を 図 2(3)の よ う に 表 示 す る ． さ ら に 提 案 手 法り絡み合うことがないため，視認性の維持が容易であでは，時刻群と標本群にクラスタリングを適用するこる．さらに折れ線グラフと比較して，数値の範囲や分とで，ヒートマップ上での表示対象となる時刻群と標布により表示領域を浪費するような可視化結果を生じ

本 群 を 特 定 す る （ 図 2(4)）．

ることもない．
ヒートマップを用いた可視化では，標本や変数を縦軸に沿って並べる順番によって，その効果が大きく変わる．ここで井元らはヒートマップの時間的に変化するデータの興味深い結果を抽出する手法を定時した[2]．さ ら に ，標 本 の 画 面 上 で の 配 置 順 を 決 定 す る た めの一手段として，類似性にもとづいて標本の分類や順列 化 を 適 用 す る こ と が 考 え ら れ る [3,4]． し か し こ れ らの 手 法 で は ， k-means 法 を 単 純 に 適 用 し て 標 本 を ク ラ
図 2 提案手法の処理手順

スタリングしているため，類似性は低いが関係性の高い標本を視覚的に比較することが容易ではない．例えば負の相関を有する変数が同一のクラスタに属することがないため，このような変数を視覚的に比較することが容易ではない．

3.2 標 本 間 の 距 離 算 出
2 章で論じたヒートマップ型の時系列データ可視化手法の問題点を解決するために，変数間の類似性に着多次元データの分析において，次元間の相関や類似目するのではなく，類似性に限定せずに任意の変数間度を散布図で表示する手法がいくつか発表されている．

距離を算出し，それに基づいて生成された距離行列を

Yuan ら の 手 法 [5]や Zhang ら の 手 法 [6]で は ， 多 次 元 デ

用い，変数をクラスタリングすることを考える．

ータを構成する各次元を，標本数だけ次元があるベク	  我 々 は 正 と 負 の 相 関 に お い て 変 数 間 の 関 係 を 観 察

タ と し て 扱 い ，そ の 非 類 似 度 を 散 布 図 で 表 示 し て い る ．

し た い と 考 え ，相 関 係 数 に も と づ い て 変 数 間 距 離 を 算提案手法の画面右側にある 2 つの散布図も同様な考え

出 し こ れ に ク ラ ス タ リ ン グ を 適 用 す る こ と に し た ．こ方にもとづいて生成されている．

こ で 高 次 元 デ ー タ を 構 成 す る 変 数 𝑣 = {𝑣! … 𝑣! }と し ， i
番 目 の 変 数 は 数 値 𝑣! = {𝑣!! … 𝑣!" }を 持 つ と す る ．現 時 点

3. 変 数 間 距 離 に 基 づ く ヒ ー ト マ ッ プ 表 示の我々の実装ではケンドール順位相関係数を適用し本章では提案手法が前提とするデータ構造を定義て ，式 (1)か ら i 番 目 と j 番 目 の 変 数 間 の 相 関 係 数 𝑑 𝑖, 𝑗

し，全体的な処理手順を述べたのちに，具体的な実装を算出する．また，このとき P は変数 i における任意方法について論じる．の隣り合う 2 つの時刻と，変数 j のこれに対応する 2
つ の 時 刻 に つ い て ，そ れ ぞ れ の 組 の 大 小 関 係 が 一 致 す

3.1 デ ー タ 構 造 と 処 理 手 順

る と き 1 を 加 算 し ，不 一 致 の と き -1 を 加 算 し た 和 と す

入力情報となる時系列データが m 標本および n 時刻る．

を有するデータであるとする．このとき本報告では，
標 本 群 A お よ び 時 刻 群 T を 以 下 の よ う に 表 現 す る ．こ𝑑 𝑖, 𝑗 =4𝑃− 1    𝑛(𝑛 − 1)

こ で v ij は i 番 目 の 標 本 の j 番 目 の 時 刻 に お け る 実 数 値

こ こ で 得 ら れ た 値 を 式 (2)に 適 用 し ， i 番 目 と j 番 目である．の 変 数 間 の 距 離 𝐿!,! を 得 る ．

𝐿!,! = 1 − 𝑑 𝑖, 𝑗   リーフを所有するブランチに若い番号を付与し，各階上記処理を全ての 2 変数のペアに適用し，距離行列層において同様にブランチに番号を付与する．ヒートを得る．続いてこの距離行列に，以下を用いてクラスマップ表示の際にはこの番号が若い順に下から表示すタリングを適用する．

るため，ユーザ操作によって変わるクラスタリングの表示結果の前後で，各クラスタの位置，およびクラス3.3 階 層 型 ク ラ ス タ リ ン グ と ヒ ー ト マ ッ プ デ ザ イ ン

タ内の各標本の位置関係が大きく入れ替わることがな	  階 層 型 ク ラ ス タ リ ン グ と は ， 近 い 距 離 に あ る 標 本 をい．これにより，ユーザのメンタルマップを保持しや1 個ずつ階層的に連結させ，標本を一続きにつなげたすい可視化を実現できる．同一の入力データに対して系統樹を形成し，クラスタをボトムアップに形成するクラスタリングの閾値を調節して可視化結果の例を図手法である．提案手法では階層型クラスタリング手法

4 に示す．

により，全ての標本を連結する系統樹を構築し，その隣接順に沿ってヒートマップ上での標本の並び順を決定する．また距離の閾値を与えることで，標本群のクラスタを形成する．提案手法におけるヒートマップデザインの考え方を図 3 に示す．

図 4	 
クラスタリング結果とヒートマップ表示(左 )閾 値 0.2	  (右 )閾 値 0.25

なお我々の実装では，時刻群にも同様に階層型クラスタリングを適用し，表示するクラスタの構成時刻数の下限値を 2 と設定している．これにより，他のいずれの時刻とも数値分布が全く異なるノイズのような時刻をヒートマップから割愛することができる．
図 3	  系 統 樹 に も と づ く ヒ ー ト マ ッ プ デ ザ イ ン
3.4 カ ラ ー マ ッ プ
提案手法が表示するヒートマップでは，横軸が時刻

我々の実装ではヒートマップの色計算に以下の 2 種を表し，標本群が画面の縦軸に沿って上下に並ぶ．同類のカラーマップを採用している．なお色計算には一クラスタに属する標本群は間隔を空けずにひと続き

HSB 表 色 系 を 採 用 し ，入 力 値 に は v ij を [0,1]の 区 間 に 正に並べて表示し，異なるクラスタに属する標本間には

規 化 し た 値 v’ ij を 使 用 す る も の と す る ．

境界線を表す灰色の帯をはさんで表示する．

1)

色相のみを変化させる汎用的なカラーマップ

また我々の実装では，表示するクラスタの構成標本圧倒的に多数の可視化ソフトウェアが採用している色数の下限値を設定し，それよりも標本数の少ないクラ計 算 ． 色 相 を v’ ij の 関 数 と し ， 彩 度 と 明 度 を 定 数 と す

スタは表示しない，という制約を設けている．我々のる．

実装では原則として 2 を下限値としている．いずれの2)

他の標本とも強い相関を有さない標本は標本数 1 のク

HSB 値 を 以 下 の 式 で 算 出 す る ．

平均値と相対値に着目したカラーマップ

ラスタを構成することから，下限値を 2 とすることでH = hue(𝑣 ! !" ), 𝑆 = 𝑠𝑎𝑡𝑢𝑟𝑎𝑡𝑖𝑜𝑛 𝑣 !! !" , 𝐵 = 𝑐𝑜𝑛𝑠𝑡

そのような標本は可視化する意義がないとし，ヒート

こ こ で hue お よ び saturation は 色 相 と 彩 度 を 算 出 す る

マップから割愛する．

関 数 で あ り ，v′!" は 1 つ の 標 本 に お け る v’ ij の 平 均 値 で系統樹を構築するための提案手法での具体的な実

あ る と す る ． ま た 𝑣′′!" = 𝑣′!" − v′!" と す る ． こ の 表 現 に装について述べる．木構造には各変数に相当するリーより，色相によって標本全体の数値の大小を表現し，フ部分と，任意の変数同士を連結させる際の分岐に当

彩度によって単一の標本における数値の変化を表現すた る ブ ラ ン チ 部 分 が あ る ．構 築 さ れ た 系 統 樹 を 保 存 し ，る．

このブランチ部分に番号を振り分ける．より下位層に

3.5 散 布 図 表 示 と ユ ー ザ イ ン タ フ ェ ー ス
我々の実装では図 1 に示す通り，クラスタリングのための閾値を設定するスライダーを搭載している．ス
ライダー操作を停止するたびに提案手法では，スライダーの位置によって指定される閾値にもとづいて，標本または時刻のクラスタを形成する．
また我々の実装では，系統樹が構築される様子を散布図上で可視化する．画面右側の 2 つの散布図では，
標 本 群 ま た は 時 刻 群 の 距 離 行 列 に 対 し て MDS（ 多 次 元尺度構成法）を適用することで各標本または各時刻の散布図上の位置を算出している．この散布図ではスライダー操作に連動して，同一クラスタに所属する 2 標本または 2 時刻を連結する線分を描画する．この散布図表示により，ヒートマップ表示だけでは視覚的に把握しきれない標本間または時刻間の関係を把握しやすくなる．
図 5AMeDAS 気 温 デ ー タ の ヒ ー ト マ ッ プ 表 示 例

4. 実 行 例
本章では実データを用いた提案手法の実行例を示す ． 我 々 は 気 象 庁 AMeDAS に よ っ て 記 録 さ れ た 全 国
86 地 点 に お け る 1 ヶ 月 間（ 31 日 間 ）の 3 時 間 お き の 気温 （ 測 定 値 合 計 248 回 ） を 可 視 化 し た ． 以 下 ， ユ ー ザの対話操作による閾値設定とともに階層型クラスタリングが適用され，そのクラスタリング結果に伴って異なるヒートマップが表示される様子を示す．また，提案手法で画面右側に表示される散布図についても同時に解説する．
提案手法においてユーザの対話操作によって閾値を調節しながら生成したヒートマップを図 5 に示す．
こ の ヒ ー ト マ ッ プ に お い て ，色 の つ い た 帯 は 標 本 群（ 本実 行 例 の 場 合 AMeDAS の 観 測 地 点 群 ）の ク ラ ス タ を 表
す ．ま た ，こ の 操 作 に と も な っ て 標 本 群（ 観 測 地 点 群 ）の散布図を構成する点群を連結する線分が表示される様 子 を 図 6 に 示 す ． こ こ で 変 数 𝑑𝑎𝑡𝑎!"#"$% は ， 標 本 群 に

図 6AMeDAS 気 象 デ ー タ へ の 散 布 図 表 示 例

よって構成されるデンドログラムからクラスタを生成
す る た め の 閾 値 で あ る ． 𝑑𝑎𝑡𝑎!"#"$% の 値 が 大 き く な る ほど，図 5 に示すヒートマップでは多くの観測地点にお以上の現象について，図 7 に示す日本地図とともに考察する．

ける気温が表示され，図 6 に示す散布図では多くの点[現 象 1]の 原 因 と し て ，観 測 所 間 の 物 理 的 距 離 が 考 え群が線分で連結される．図 6 の赤丸は線分が存在する

ら れ る ． 北 海 道 は 日 本 の 約 22%を 占 め て お り ， 本 デ ー部位を示している．

タ に お い て 約 6400km 2 に 1 観 測 所 が 割 り 当 て ら れ て い

以上の適用例から，我々は以下の現象を発見した．

る ．一 方 東 京 は 日 本 の 0.5%，つ ま り 約 2100km 2 に 1 観[現 象 1] 北 海 道 や 沖 縄 に 属 す る 観 測 点 は 𝑑𝑎𝑡𝑎!"#"$% 値 が測所が割り当てられている．また，沖縄県は周辺の各だいぶ大きくなってようやくヒートマップ上に表島に 1 観測所が割り当てられている．よって北海道や示される．

沖縄では観測所間の気象傾向の差異が大きいため，[現 象 2] 同 じ 地 域 に 属 す る 観 測 点 の 中 に も ， 𝑑𝑎𝑡𝑎!"#"$%
値が小さいうちからヒートマップ上に表示される観測点と，だいぶ大きくなってようやくヒートマップ上に表示される観測点が混在している．

𝑑𝑎𝑡𝑎!"#"$% 値 が だ い ぶ 大 き く な っ て よ う や く ヒ ー ト マ ッ
プ上に現れる．
続 い て [現 象 2]に つ い て 考 察 す る ． [現 象 2]が 見 ら れる具体的な観測点の例として，中国地方における広島

と岡山，鳥取と松江，の 2 組があげられる．これらの標本を構成する各時刻の実数値に対して地域は同じ中国地方でありながら，その間に山脈が立(𝑣!" − 𝜇! )/𝜎!

ちはだかっているため，観測所間の気象傾向の差が大を 算 出 し ，そ の 最 大 値 が 上 位 で あ る m’個 の 標 本 を 抽 出

き い ．こ の た め 同 じ 地 域 に 属 し て い な が ら ，𝑑𝑎𝑡𝑎!"#"$% 値

し て い る ． こ こ で 𝜇! は i 番 目 の 標 本 に お け る 実 数 値 のがだいぶ大きくなってようやく同一クラスタに属する

平 均 値 ， 𝜎! は i 番 目 の 標 本 に お け る 実 数 値 の 標 準 偏 差ようになる．

である．これ以外の異常値検出方法を適用することも可能である．
以 上 の 処 理 に よ っ て 抽 出 さ れ た 標 本 群 A’に 提 案 手法を適用することで，異常値を含む標本間の相関を可視化できる．このような可視化は例えば，「同じ時期に異常によく売れる商品間の売上の相関を可視化する」「同じ時期に異常によくアクセスされるウェブページ間のアクセス数の相関を可視化する」といった用途に有効である．
図 5 にその例を示す．なお，この応用例に関する実装では，散布図の表示を割愛している．かわりにこの実装では，ユーザによるヒートマップ上でのマウスクリック操作に対応する箇所の詳細情報を表示するテキ

図 7 日本の山脈地図（【 世 界 地 図 ｜ SEKAICHIZU】の 日 本 地 図 を 元 に 著 者 が手を加え作成した．
http://www.sekaichizu.jp/atlas/japan/p500_japan.html,2016/02/12）

スト表示欄をウィンドウ右下部に表示している．

本 章 で 紹 介 し た AMeDAS 気 温 デ ー タ で の 実 行 例 とその考察から，提案手法による可視化結果にはある程度妥当性があると考えられる．しかしながら本実行例
は，その数値分布がすでに十分解明されているデータを用いることで可視化結果の妥当性を示したに過ぎない．提案手法に限らず可視化技術が本来目指すべき用
途は，その特徴が明らかになっていないデータの特徴を視覚的に発見し，それを第三者に対して表現する点にある．そこで今後の課題として，まだ数値分布が明らかになっていないデータを可視化して，その特徴を発見するタスクをもって，提案手法の有用性を検証したい．

5. 応 用 ： 異 常 値 を 含 む 標 本 間 の 相 関 の 可 視化

図 8

応用：異常 値を 含む 標

本間の相関の可視化

6. ま と め と 今 後 の 課 題
本報告では，ヒートマップを用いた時系列データ可

本報告の提案手法の応用として我々は現在，時系列視化の一手法を提案した．提案手法では時間軸を横軸データ中で異常値を含む標本を抽出し，その標本間のとして標本群を縦軸に並べる一般的なヒートマップと相関を可視化するツールを開発している．

は別に，時刻群と標本群の位置関係を表示する 2 つの3.1 節 と 同 様 に ， 入 力 情 報 と な る 時 系 列 デ ー タ が m

散布図を搭載している．時刻群と標本群はそれぞれ系標本および n 時刻を有するものとする．このとき我々統樹によって構造化され，対話操作による閾値設定との 実 装 で は ，標 本 群 A = {𝑎! , … , 𝑎! } の 中 か ら 異 常 値 をともに階層型クラスタリングが適用され，そのクラス

含 む 上 位 m’個 の 標 本 を 抽 出 す る ． 以 降 こ れ を

タリング結果に沿ってヒートマップが更新される仕組

A′ = {𝑎! , … , 𝑎!! }と記述する．我々の現在の実装では単純に，i 番目のみとなっている．またクラスタ形成の過程は散布図上にも表示される．

現在の実装では相関係数から算出した距離にもとづくクラスタリングを適用することで，ノイズとなる時刻を割愛し，相関のある標本群をクラスタとして表示している．今後の課題として，それ以外の距離やクラスタリング手法の適用によって，さらに多彩な数値特性を可視化できるようにしたい．特に，異常値の見られる標本群どうしにどのような相関が見られるか，あるいはどの時刻が重要であるか，といった点についてさらに考察を深めたい．

参 	  考 	  文 	  献[1] S. Yagi, Y. Uchida, T. Itoh, A Polyline-BasedVisualization Technique for Tagged Time-Varying
Data, 16th International Conference on Information
Visualisation (IV2012), 106-111, 2012.
[2] M. Imoto, T. Itoh, A 3D Visualization Technique forLarge Scale Time-Varying Data, 14th International
Conference on Information Visualisation (IV2010),
17-22, 2010.
[3] A. Hayashi, T. Itoh, S. Nakamura, A Visual Analytics
ToolforSystemLogs
Adopting
Variable
Recommendation and Feature-Based Filtering, 17thInternational
Conference
onInformation
Visualisation (IV2013), 1-10, 2013.
[4] H. Suematsu, S. Yagi, T. Itoh, Y. Motohashi, K. Aoki,
S.
Morinaga, A
Heatmap-Based
Time-Varying
Multi-Variate Data Visualization Unifying NumericandCategorical
Variables, 18th
International
Conference on Information Visualisation (IV2014),
84-87, 2014.
[5] X. Yuan, D. Ren, Z. Wang, C. Guo, Dimension
Projection Matrix/Tree: Interactive Subspace Visual
Exploration and Analysis of High Dimensional Data,
IEEE Transactions on Visualization and Computer
Graphics, 19(12), 2625-2633, 2013.
[6] Z. Zhang, K. T. McDonnel, E. Zadak, K. Muller,
Visual Correlation Analysis of Numerical andCategorical Data on the Correlation Map, IEEE
Transactions on Visualization and Computer
Graphics , 21(2), 289–303, 2015.