// Web application of earthquake 3D mapping using SVG //

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

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

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

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

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

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

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

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

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

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

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

12. // 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) オンライン・オフラインともに動作可能 PAGE 12 Takeo NOMURA (Nagashima Labo. Thesis 2008)

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

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

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

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

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

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

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

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

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

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

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

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

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