簡易檢索 / 詳目顯示

回結果列表
研究生： 袁康祥
Yuan, Kang-Shiang
論文名稱： 2D 虛擬實境系統
2D Virtual Reality System
指導教授： 陳立祥
Chen, Lih-Shyang
學位類別： 碩士
Master
系所名稱： 電機資訊學院 - 電腦與通信工程研究所
Institute of Computer & Communication Engineering
論文出版年： 2020
畢業學年度： 109
語文別： 中文
論文頁數： 120
中文關鍵詞： 數位學習 、虛擬實境 、虛擬顯微鏡 、網頁系統
外文關鍵詞： E-Learning, Virtual Reality, Virtual Microscope, Web System
相關次數： 點閱：136  下載：0 
分享至:
查詢本校圖書館目錄 查詢臺灣博碩士論文知識加值系統 勘誤回報

    • 本研究主要是利用網路非同步傳輸技術(AJAX)與ASP.NET框架，建置出一套可以模擬傳統顯微鏡醫學顯微切片和製作虛擬環景之數位學習平台，主要在將傳統顯微鏡之教學數位化，及將原本課本之內容透過環物功能立體化，讓學習者可以對所學之物有更具體的認知。教師可以透過瀏覽器進入我們的系統中上傳切片圖檔，並在切片圖檔上使用繪製重點（Draw）、標記註記（Annotation）等教學功能，除了模擬傳統顯微鏡功能之外，本系統也可以加入環景影像，並在環景影像上加入環景連結、環物影像連結和網頁超連結，透過這些連結功能模擬出虛擬環景，讓使用者可以在環景中探索並學習。

    The goal of this research is to create a 2D virtual reality system that is built by Asp.Net/C# and OpenSeaDragon.js for e-Learning. The 2D Virtual Reality system is comprised of two subsystems, which is the Virtual Microscope system and the 2D Panorama system. The Virtual Microscope system provides plenty of learning functions for students and teachers, such as microscopic annotation, magnifier, ruler, snapshot, and personal notes. Hence, the system can allow the students to learn the microscopic images more efficiently and effectively than the traditional physical microscopic images.
    The 2D Panorama system is built by adding the concept of virtual reality to the Virtual Microscope system for simulating the real environment. In the 2D Panorama system, students can browse the 360-degree objects created by teachers in the panorama. Students can learn the true appearance of real objects through 360-degree objects.

    第1章 導論 1 1.1 前言、研究背景與動機 1 1.1.1 研究背景和動機 1 1.1.2 前言 2 1.2 研究目的 4 第2章 理論基礎與文獻探討 6 2.1 目前相關研究 6 2.1.1 虛擬顯微鏡 6 2.1.2 環物影像 8 2.1.3 環景影像 8 2.2 設計理念與方法 9 2.3 HINTS 11 第3章 研究設計與方法 12 3.1 2D虛擬實境教學系統架構 12 3.1.1 製作虛擬切片圖之影像檔流程 12 3.1.1.1 醫學切片圖影像之取得 13 3.1.1.2 Deep Zoom Composer影像切割 14 3.1.1.3 分割圖檔上傳與編輯 14 3.1.2 虛擬顯微鏡系統簡介 14 3.1.3 虛擬顯微鏡系統操作介面 19 3.2 影像上傳及編輯頁面 22 3.2.1 簡介 22 3.2.1 分析 23 3.2.3 設計與實作 28 3.3 虛擬顯微鏡主畫面功能介紹 45 3.3.1 註記工具 45 3.3.1.1 簡介 45 3.3.1.2 分析 46 3.3.1.3 設計與實作 48 3.3.2 光圈 56 3.3.2.1 簡介 56 3.3.2.2 分析 56 3.3.2.3 設計與實作 57 3.3.2 切片圖縮放工具 59 3.3.3.1 簡介 59 3.3.1.2 分析 59 3.3.1.3 設計與實作 60 3.3.4 尺規工具 64 3.3.4.1 簡介 64 3.3.4.2 分析 64 3.3.4.3 設計與實作 68 3.3.5 鳥瞰圖視窗縮放和放大鏡工具 72 3.3.5.1 簡介 72 3.3.5.2 分析 73 3.3.5.3 設計與實作 75 3.3.6 螢幕擷取 78 3.3.6.1 簡介 78 3.3.6.2 分析 78 3.3.6.2 設計與實作 80 3.3.7 多重切片比較視窗設計 82 3.3.7.1 簡介 82 3.3.7.2 分析 82 3.3.7.3 設計與實作 89 3.4 虛擬實境系統 93 3.4.1 將環景導入2D虛擬實境系統 93 3.4.1.1 簡介 93 3.4.1.2 分析 94 3.4.1.3 設計與實作 95 3.4.2 環物影像 97 3.4.2.1 簡介 97 3.4.2.2 分析 98 3.4.2.3 設計與實作 102 3.4.3 連接環景及新增環物連結 107 3.4.3.1 簡介 107 3.4.3.2 分析 108 3.4.3.3 設計與實作 112 第4章 結論與未來展望 117 § 參考文獻 § 119

    [1] OpenSeaDragon 函式庫,
    https://openseadragon.github.io/, accessed on 2019-11-11

    [2] Deep Zoom Composer,
    https://www.microsoft.com/en-us/download/details.aspx?id=24819, accessed on 2020-01-21

    [3] DotNetZip,
    https://archive.codeplex.com/?p=DotNetZip, accessed on 2020-02-22

    [4] Web4.0 技術,
    https://stephenletts.wordpress.com/web-4-0/, accessed on 2020-02-22

    [5] AJAX,
    https://www.w3schools.com/whatis/whatis_ajax.asp, accessed on 2019-11-11

    [6] Aperio ImageScope – Pathology Slide Viewing Software,
    https://www.leicabiosystems.com/digital-pathology/manage/aperio-imagescope/, accessed on 2019-11-11

    [7] Base64編碼,
    https://en.wikipedia.org/wiki/Base64, accessed on 2020-4-5

    [8] HtmlCanvas,
    https://github.com/niklasvh/html2canvas, accessed on 2020-4-5

    [9] Fabric.js,
    http://fabricjs.com/, accessed on 2020-4-5

    [10] KeyEvent,
    https://developer.mozilla.org/zh-TW/docs/Web/API/KeyboardEvent, accessed on 2020-4-5

    [11] 環景介紹,
    https://zh.wikipedia.org/wiki/%E5%85%A8%E6%99%AF%E5%9B%BE, accessed on 2020-4-25

    [12] C# Dictionary<TKey,TValue> Class,
    https://docs.microsoft.com/zh-tw/dotnet/api/system.collections.generic.dictionary-2?view=netcore-3.1, accessed on 2020-4-25

    [13] .Net Framework框架,
    https://zh.wikipedia.org/wiki/.NET%E6%A1%86%E6%9E%B6#.NET_Framework_4.6.1, accessed on 2019-11-11

    [14] Spritespin.js,
    http://spritespin.ginie.eu/, accessed on 2020-4-25

    [15] Daniel Gasienica , Inside Deep Zoom – Part I: Multiscale Imaging, Online available,
    http://gasi.ch/blog/inside-deep-zoom-1/, accessed on 2019-11-11

    [16] ScaleBar,
    https://github.com/usnistgov/OpenSeadragonScalebar, accessed on 2020-4-5

    下載圖示
    2026-01-01公開
    QR CODE