ＳＶＧを用いた地震データ検索・３Ｄ表示アプリケーションの開発 // Web application of earthquake 3D mapping using SVG // ＳＶＧを用いた地震データ検索・３Ｄ表示アプリケーションの開発 //長島研究室// 野村　剛生 2008年度 機械創成工学科 卒業研究発表会 2009年2月5日 Takeo NOMURA (Nagashima Labo. Thesis 2008) PAGE 1

Fig.1 気象庁公開地震データ（引用元：気象庁） // Web application of earthquake 3D mapping using SVG// はじめに 気象庁公開地震データの問題点 テキスト 形式 →　　データ検索困難 ラスタ画像 →　　2次利用困難 連携困難 Fig.1 気象庁公開地震データ（引用元：気象庁） 前年度研究概要 Takeo NOMURA (Nagashima Labo. Thesis 2008) PAGE 2

Fig.2 地震検索システム Fig.3 日本2D地震表示システム // Web application of earthquake 3D mapping using SVG// 前年度研究概要 前年度研究概要 Fig.2 地震検索システム Fig.3 日本2D地震表示システム 開発プログラム概要 Takeo NOMURA (Nagashima Labo. Thesis 2008) PAGE 3

Fig.4 EarthQuake3D JP Fig.5 EarthQuake3D // Web application of earthquake 3D mapping using SVG// 開発プログラム概要 開発プログラム概要 Fig.4 EarthQuake3D JP Fig.5 EarthQuake3D スペック概要 Takeo NOMURA (Nagashima Labo. Thesis 2008) PAGE 4

3Dマッピングの実現 アニメーションの実現 再現SVGコードの出力機能の実装 複合的検索機能の実装 インタラクティブな動作を実現 // Web application of earthquake 3D mapping using SVG// スペック概要 開発プログラムスペック概要 複合的検索機能の実装 3Dマッピングの実現 アニメーションの実現 インタラクティブな動作を実現 様々なグラフィック表示条件を指定可能 スタンドアロン型動作の実現 オンライン・オフラインともに動作可能 Webブラウザ上で動作可能 XMLデータ読み込み機能の実装 再現SVGコードの出力機能の実装 ソースコードを入手可能 スペック詳細解説 Takeo NOMURA (Nagashima Labo. Thesis 2008) PAGE 5

地震データ検索が可能 検索条件を複数指定可能 該当データをカウント可能 スペックの詳細解説 Fig.6 震源検索機能 // Web application of earthquake 3D mapping using SVG// スペックの詳細解説 (a) 複合的検索機能の実装 地震データ検索が可能 検索条件を複数指定可能 該当データをカウント可能 Fig.6 震源検索機能 (b) 3Dマッピングの実現 Takeo NOMURA (Nagashima Labo. Thesis 2008) PAGE 6

EarthQuake3D 利点 広域を分析可能 (b) 3Dマッピングの実現 スペックの詳細解説 Fig.7 EarthQuake3D 利点 // Web application of earthquake 3D mapping using SVG// スペックの詳細解説 (b) 3Dマッピングの実現 EarthQuake3D 利点 広域を分析可能 Fig.7 EarthQuake3D 利点 マッピング性能対比 Takeo NOMURA (Nagashima Labo. Thesis 2008) PAGE 7

EarthQuake3D JP 利点 震源深さ分析に最適 (b) 3Dマッピングの実現 海面に目線を合わせた場合 スペックの詳細解説 // Web application of earthquake 3D mapping using SVG// スペックの詳細解説 (b) 3Dマッピングの実現 EarthQuake3D JP 利点 震源深さ分析に最適 海面に目線を合わせた場合 Fig.8 EarthQuake3D　JPの利点 (c)　アニメーションの実現 Takeo NOMURA (Nagashima Labo. Thesis 2008) PAGE 8

3Dアニメーション可能 緯度・経度増分指定可能 遠近表現の強化 (c) アニメーションの実現 スペックの詳細解説 Fig.9 アニメーション // Web application of earthquake 3D mapping using SVG// スペックの詳細解説 (c)　アニメーションの実現 3Dアニメーション可能 緯度・経度増分指定可能 遠近表現の強化 Fig.9 アニメーション (d)　インタラクティブな動作を実現 Takeo NOMURA (Nagashima Labo. Thesis 2008) PAGE 9

クリック 画像クリックで詳細表示可能 スペックの詳細解説 Fig.10 詳細表示機能 (e) 様々なグラフィック表示条件 // Web application of earthquake 3D mapping using SVG// スペックの詳細解説 (d)　インタラクティブな動作を実現 画像クリックで詳細表示可能 クリック Fig.2 EarthQuake3D JP Fig.10 詳細表示機能 (e) 様々なグラフィック表示条件 Takeo NOMURA (Nagashima Labo. Thesis 2008) PAGE 10

検索条件と連動可能 表示中心を指定可能 地図表示精度変更可能 スペックの詳細解説 Fig.11 マグニチュードで色分け // Web application of earthquake 3D mapping using SVG// スペックの詳細解説 (e) 様々なグラフィック表示条件を指定可能 検索条件と連動可能 表示中心を指定可能 地図表示精度変更可能 Fig.11 マグニチュードで色分け (a) 1%プロット(精度低) (b) 100%プロット（精度高） Fig.12 地図表示精度の対比 (f) スタンドアロン型動作の実現 Takeo NOMURA (Nagashima Labo. Thesis 2008) PAGE 11

インストール不要 スペックの詳細解説 クリック 長島研究室 野村研究員のページ Zip書庫解凍するだけで準備OK // Web application of earthquake 3D mapping using SVG// スペックの詳細解説 (f) スタンドアロン型動作の実現 クリック インストール不要 長島研究室　野村研究員のページ http://www.mech.tohoku-gakuin.ac.jp/nken/labo2008/nomura/index.html Zip書庫解凍するだけで準備OK Fig.13 実行ファイル一式 (g) オンライン・オフラインともに動作可能 Takeo NOMURA (Nagashima Labo. Thesis 2008) PAGE 12

オンライン実行可能 スペックの詳細解説 クリック 長島研究室野村研究員のページ Fig.14 オンライン実行可能 オンライン動作の仕組み // Web application of earthquake 3D mapping using SVG// スペックの詳細解説 (g) オンライン・オフラインともに動作可能 オンライン実行可能 クリック 長島研究室野村研究員のページ http://www.mech.tohoku-gakuin.ac.jp/nken/labo2008/nomura/index.html Fig.14 オンライン実行可能 オンライン動作の仕組み Takeo NOMURA (Nagashima Labo. Thesis 2008) PAGE 13

オンライン動作模式図 データサーバ データリクエスト データサーバ XMLデータ プログラム （ページ表示） URLに アクセス プログラム // Web application of earthquake 3D mapping using SVG// スペックの詳細解説 オンライン　 (g) オンライン・オフラインともに動作可能 オフライン オンライン動作模式図 データサーバ データリクエスト データサーバ XMLデータ プログラム （ページ表示） URLに アクセス プログラム プログラムの配列上にデータを格納 地震データ読込指示 クライアント クライアント (a)URLアクセス (b)地震XMLデータ取得の仕組み Fig.15 オンライン動作模式図 (h) Webブラウザ上で動作可能 Takeo NOMURA (Nagashima Labo. Thesis 2008) PAGE 14

Adobe SVG Viewerプラグインをインストールすれば誰でも利用可能に！ // Web application of earthquake 3D mapping using SVG// スペックの詳細解説 (h) Webブラウザ上で動作可能 Adobe SVG Viewerプラグインをインストールすれば誰でも利用可能に！ Fig.16 Webブラウザ上で利用可能 (i) XMLデータ読み込み機能の実装 Takeo NOMURA (Nagashima Labo. Thesis 2008) PAGE 15

プログラムを直さずデータ追加可能 XMLデータだからこそ、ブラウザで読み込むことができる。 プログラムとデータが分離している。 // Web application of earthquake 3D mapping using SVG// スペックの詳細解説 (i) XMLデータ読み込み機能の実装 XMLデータだからこそ、ブラウザで読み込むことができる。 プログラムとデータが分離している。 プログラムを直さずデータ追加可能 Fig.17 読み込み可能なXMLデータ形式 (j) 再現SVGコードの出力機能の実装 Takeo NOMURA (Nagashima Labo. Thesis 2008) PAGE 16

実行結果をファイルに保存可能！ 再現可能な静的なSVGコードの出力が可能 ベクタ画像対応ソフトウェアで編集可能 // Web application of earthquake 3D mapping using SVG// スペックの詳細解説 (j) 再現SVGコードの出力機能の実装 再現可能な静的なSVGコードの出力が可能 ベクタ画像対応ソフトウェアで編集可能 実行結果をファイルに保存可能！ Fig.18 SVGコード出力の様子 (k) ソースコードを入手可能 Takeo NOMURA (Nagashima Labo. Thesis 2008) PAGE 17

オープンソース 転用可能 テキスト形式 スペックの詳細解説 Fig.19 ソースコードの一部 デモンストレーション // Web application of earthquake 3D mapping using SVG// スペックの詳細解説 (k) ソースコードを入手可能 オープンソース 転用可能 テキスト形式 Fig.19 ソースコードの一部 デモンストレーション Takeo NOMURA (Nagashima Labo. Thesis 2008) PAGE 18

デモンストレーションを行います。 スクリーンにご注目ください。 デモンストレーション まとめ デモンストレーション // Web application of earthquake 3D mapping using SVG// デモンストレーション デモンストレーション デモンストレーションを行います。 スクリーンにご注目ください。 まとめ Takeo NOMURA (Nagashima Labo. Thesis 2008) PAGE 19

SVGを用いて地震データの3D表現が可能になった 地震の3Dアニメーションが可能となった // Web application of earthquake 3D mapping using SVG// まとめ まとめ SVGを用いて地震データの3D表現が可能になった 地震の3Dアニメーションが可能となった Takeo NOMURA (Nagashima Labo. Thesis 2008) PAGE 20

END END END // Web application of earthquake 3D mapping using SVG// Takeo NOMURA (Nagashima Labo. Thesis 2008) PAGE 21

Fig.20 日本（機能・精度向上） Fig.21 世界対応 // Web application of earthquake 3D mapping using SVG// 前年度研究拡張 前年度2D研究拡張 Fig.20 日本（機能・精度向上） Fig.21 世界対応 開発プログラム概要 Takeo NOMURA (Nagashima Labo. Thesis 2008) PAGE 22

Fig.22 日本汎用プロットシステム （日本の大学・短大・高専） Fig.23 全世界汎用プロットシステム （世界の首都） // Web application of earthquake 3D mapping using SVG// ソースコード転用例 ソースコード転用例 Fig.22 日本汎用プロットシステム 　　（日本の大学・短大・高専） Fig.23 全世界汎用プロットシステム （世界の首都） Takeo NOMURA (Nagashima Labo. Thesis 2008) PAGE 23

Scalable Vector Graphics // Web application of earthquake 3D mapping using SVG// 用語解説 SVG Scalable Vector Graphics 概要 2001年にW3Cにより勧告された画像規格 特徴 テキストデータで画像データを記述 利点 拡大縮小時に劣化なし アフィン変換可能 Fig.27 SVG記述例 Takeo NOMURA (Nagashima Labo. Thesis 2008) PAGE 24

Microsoft社が提供するXML解釈用ライブラリ // Web application of earthquake 3D mapping using SVG// 用語解説 MSXML 概要 　Microsoft社が提供するXML解釈用ライブラリ Takeo NOMURA (Nagashima Labo. Thesis 2008) PAGE 25