--- title: 2020 年秋季 進階電腦系統理論與實作課程作業 —— render image: https://en.scratch-wiki.info/w/images/ExampleGamePhotoForRaycasterTutorial.png description: 做中學浮點數和定點數運算,並在指定的程式碼基礎上,體驗物件導向程式設計 --- # I07: render ###### tags: `sysprog2020` > 主講人: [jserv](http://wiki.csie.ncku.edu.tw/User/jserv) / 課程討論區: [2020 年系統軟體課程](https://www.facebook.com/groups/system.software2020/) :mega: 返回「[進階電腦系統理論與實作](http://wiki.csie.ncku.edu.tw/sysprog/schedule)」課程進度表 ## :memo: 預期目標 * 學習數值系統:浮點運算和定點數 * 以 C 語言為基礎的物件導向程式設計 * 視窗程式開發 * 事件驅動的程式設計 ## raycaster [raycaster](https://github.com/sysprog21/raycaster) 程式實作《毀滅戰士》(Doom) 系列遊戲中經典的 ray casting 並確保光線追蹤的算繪 (render) 完全不用除法操作。原始程式碼約 500 行,透過 SDL2 達到跨平台圖形處理,已在 macOS 和 Ubuntu Linux 測試過。 ![](https://i.imgur.com/DxAjCkD.png) > 左圖是 fixed-point 實作,右圖是 floating-point 實作,可見到右圖的算繪 (render) 效果不理想,預期應該是連續牆壁投影 :::info :information_source: 注意用語,"render" 一詞在多個領域都存在,例如口語的 "[Render a Wall](https://www.wikihow.com/Render-a-Wall)" 是「粉刷牆壁」的意思 (這裡不該出現「渲染」),在資料庫領域中,對資料進行操作時,"[render](https://datatables.net/reference/option/columns.render)" 和 "process" 同等意思,都是對指定的資料欄位或範圍予以處理。 關於翻譯用語討論,可參見 ==[論 Render 翻譯(算繪/演繹)](http://breezymove.blogspot.com/2013/12/render.html)==。在本專案中,我們將 "render" 翻譯為「==算繪==」。 ::: [raycaster](https://github.com/sysprog21/raycaster) 程式支援的按鍵: * 向上 (arrow up): 前往更深處 * 向下 (arrow down): 自深處離開 * 向左 (arrow left): 左轉 * 向右 (arrow right): 右轉 * `Esc`: 離開本程式 前述方向按鍵按壓後,遊戲的視角會隨之變動。可嘗試透過方向鍵變更位置和視角,請留意到畫面左側 (fixed-point 實作) 和右側 (floating-point 實作) 的算繪結果差異。 延伸閱讀: * [Doom rendering engine](https://doom.fandom.com/wiki/Doom_rendering_engine) * [Casting Wolf3D-style Rays with an FPGA and Arduino](http://www.dormando.me/post/fpga-raycaster/) ## :penguin: 作業要求 * 在 GitHub 上 fork [raycaster](https://github.com/sysprog21/raycaster),目標如下: - 修正浮點數和定點數算繪程式展現的缺失,並提出改進 precision 及 accuracy 的方式 - 輸出算繪過程的 [frame rate](https://en.wikipedia.org/wiki/Frame_rate),日後當我們進一步提升算繪程式的效率時,這會是效能評比的方式之一 - 利用 [tools/precalculator.cpp](https://github.com/sysprog21/raycaster/blob/master/tools/precalculator.cpp) 產生運算表格,修改相關程式碼,使得程式碼在編譯時期才去產生運算表格,後者以標頭檔案 (generated header) 的形式存在並編譯進入主程式。換言之,檔案 [raycaster_tables.h](https://github.com/sysprog21/raycaster/blob/master/raycaster_tables.h) 應自 repository 移除,改用編譯時期產生 - 解說現有 fixed-point 實作機制,並探討前述表格產生的機制,需要提及其中的考量點 - 參照 [C 語言:物件導向程式設計篇](https://hackmd.io/@sysprog/c-oop),透過建立共用介面 (interface) 的手法,將 [raycaster](https://github.com/sysprog21/raycaster) 以 C99/C11 (或 gnu99/gnu11) 重寫,允許在執行時期載入 fixed-point 和 floating-point 為基礎的 renderer :::info 對照研讀 [Object-oriented techniques in C](https://dmitryfrank.com/articles/oop_in_c) 及 [Achieving polymorphism in C](https://www.codeproject.com/Articles/739687/Achieving-polymorphism-in-C) :::: * 閱讀 [Doom rendering engine](https://doom.fandom.com/wiki/Doom_rendering_engine) 和 [Casting Wolf3D-style Rays with an FPGA and Arduino](http://www.dormando.me/post/fpga-raycaster/),解釋 [raycaster](https://github.com/sysprog21/raycaster) 運作原理,並探討後續的改進方案,例如更換彩色的貼圖素材 (texture)、引入遊戲元素 (sprite) 等等。 ## 繳交方式 編輯 [Homework5 作業區共筆](https://hackmd.io/@sysprog/2020-homework5),將你的觀察、上述要求的解說、應用場合探討,以及各式效能改善過程,善用 gnuplot 製圖,紀錄於新建立的共筆 ## 截止日期 * Nov 9, 2020 (含) 之前 > 越早在 GitHub 上有動態、越早接受 code review,評分越高