移動端海洋實時模擬技術研究與實現
筆者介紹：姜雪偉，IT公司技術合夥人，IT高階講師，CSDN社群專家，特邀編輯，暢銷書作者，國家專利發明人;已出版書籍：《手把手教你架構3D遊戲引擎》電子工業出版社和《實戰核心技術詳解》電子工業出版社等。
前端時間在CSDN開始了關於《演算法與遊戲技術實戰》系列講座，主要是講解了一些遊戲實戰中常用的演算法，在這裡也是使用數學方程解決海水渲染問題，告訴開發者數學演算法對遊戲開發非常重要，我們可以使用數學運算解決很多問題：包括人工智慧，深度學習，遊戲開發，VR/AR等。
摘 要 針對目前海浪的研究都是基於PC端的問題，為了實現在移動端實時模擬模擬海洋，提出了一種可以在移動端執行的演算法，利用快速傅立葉變換演算法（FFT）建立海浪高度場，結合LOD（Levelof Detail）演算法生成多塊網格無縫拼接形成無限海水；採用GPU程式設計技術對海水錶面實現海面光照，反射，折射效果以及海面顏色渲染處理；最後通過Perlin噪音在海面產生海浪泡沫效果，從而更加逼真的實現了海水模擬可以在移動端執行。實驗結果表明，該演算法滿足了海水在移動端執行，並且達到了預期效果。
1 概述
海洋模擬的逼真度來源於海浪的波形及運動的真實性，海浪建模的方法有多種，Foumier和Reeves[1]提出一個基於深海小振幅波的海浪模型；Jensen[2]和Tessendorf[3]分別詳細描述了採用統計模型和快速傅立葉變換（FFT）方法模擬海浪的方法。在合成過程中採用規則矩形來完成繪製，降低了影象的質量和真實感。徐迎慶[4]等提出了一個基於物理模型的模擬海浪的計算機動畫方法。Mastern[5]等提出了一種利用Fourier變換來合成一塊水波區域的方法；其結果顯得非常自然。Chen[6]採用數值迭代方法求解二維的水力學方程組（Navier-Stokes）來模擬海浪。楊懷平[7]等利用海浪頻譜和方向譜的相關公式，實現了基於海頻譜的波浪造型及顯示，能夠快速的模擬海浪。以上的海水研究都是基於PC端的，隨著移動端硬體的快速發展，提出了一種新的海洋模擬方法，該方法不僅侷限於PC端和Web端模擬，可以同時執行在移動平臺。通過快速傅立葉變換（FFT）建立海浪高度場，採用LOD技術實現多塊網格無縫拼接形成無限海洋表面，而且實現了海浪隨風起伏的效果，最後通過GPU程式設計實現了水面光照、反射以及折射效果。
2 建立海浪模型
由於海水的運動形式是在不斷變化的，在統計模型中，海浪的高度方程
其中
本文引入引數
因此有表示式：
根據
把以上表達式帶入我們原始方程，可達到如下表達式：
化簡方程 (10)可得如下表達式：
將（8）和（9）代入（11）可得如下方程式：
其中
引數g是重力加速度
接下來需要解答
將(8)和(9)代入(15)可得方程式：
其中引數
其中
其中
將(18)代入(16)可得到
化簡(19)可得方程式：
解得法線向量的公式如下：
在解方程的過程中，本文假定M=N（N是2的n次方）和
以上建模演算法利用快速傅立葉變換完成了對海浪幾何建模以及海面光照法線向量的計算。
3 生成海水網格
為了完成對實時性要求比較高的大面積海域在移動平臺的模擬，鑑於目前移動平臺的處理能力，採用的是將海面定義成6*6個海洋網格塊，每塊網格的三角形數量是32*32，每塊網格的大小是128*128。建立網格無縫拼接，為了消除不同細節層次網格邊緣的裂縫，採用的是細節層次LOD（Level Of Details）[8]，最大分層為4，保證它們之間LOD級別相差1之內即可。然後利用快速傅立葉變換（FFT）海水模擬演算法生成動態的海水高度場，並將高度場存入到定點紋理中，在頂點著色器中通過取頂點紋理的值對網格進行擾動，形成動態的海水效果。海面網格如圖1-1，演算法流程圖如圖1-2。
從程式執行的流程圖中可以看出，首先需要定義要生成的網格數量，生成對應的網格塊並對網格資料進行初始化，利用快速傅立葉變換進行2次傅立葉變換生成海浪高度場，採用LOD處理塊與塊之間出現裂縫，最後通過GPU程式設計對海面進行實時渲染。如圖1-3和1-4海浪在風力作用下的效果圖
4 GPU渲染
為了提高在移動端的執行效率利用GPU對浮點紋理進行雙線濾波和法線計算，然後再用這張經過濾波處理和法線預計算的浮點紋理作為頂點著色器的高度場和法線紋理進行高度擾動，形成海浪效果。同時對海面光照，反射以及折射也通過GPU處理，從而減輕了移動端CPU處理資料的壓力，優化了效率。GPU部分核心程式碼，頂點結構體定義和法線，光照實現方法如下：
struct v2f
{
float4 pos : SV_POSITION; //位置
float4 projTexCoord : TEXCOORD0; //對映紋理
float2 bumpTexCoord : TEXCOORD1; //bump紋理
float3 viewDir : TEXCOORD2; //視角方向
float3 objSpaceNormal : TEXCOORD3; //法線
float3 lightDir : TEXCOORD4; //光線方向
float2 foamStrengthAndDistance : TEXCOORD5; //風力強度和距離
};
v2f vert (appdata_tan v)
{
v2f o;
o.bumpTexCoord.xy = v.vertex.xz/float2(_Size.x, _Size.z)*5; //紋理座標
o.pos = mul (UNITY_MATRIX_MVP, v.vertex); //矩陣換算
o.foamStrengthAndDistance.x = v.tangent.w; //噪音產生方向
o.foamStrengthAndDistance.y = clamp(o.pos.z, 0, 1.0); //資料取樣
float4 projSource = float4(v.vertex.x, 0.0, v.vertex.z, 1.0); //紋理對映
float4 tmpProj = mul( UNITY_MATRIX_MVP, projSource);
o.projTexCoord = tmpProj;
float3 objSpaceViewDir = ObjSpaceViewDir(v.vertex); //物件空間視角方向
float3 binormal = cross( normalize(v.normal), normalize(v.tangent.xyz) );//法線
float3x3 rotation = float3x3( v.tangent.xyz, binormal, v.normal ); //旋轉
o.objSpaceNormal = v.normal;
o.viewDir = mul(rotation, objSpaceViewDir); //視角方向
o.lightDir = mul(rotation, float3(_SunDir.xyz)); //光照方向
return o;
}
實現了反射，折射效果如圖1-5和1-6所示；
5 實驗資料
測試使用了市場比較流行的兩個廠家手機：一是韓國產的三星GT-N7100手機，其硬體配置是CPU四核1.6GHz、GPU 為Mali 400MP、記憶體RAMGB、ROM16GB；作業系統Anroid4.3；二是國內小米2手機硬體配置是CPU四核1.5GHz、GPU Adreno 320、記憶體RAM2GB 、ROM16GB、作業系統 MIUI android4.1。
使用的是6*6塊海洋網格，每塊網格大小是128*128，每塊網格是由32*32三角形組成，在移動平臺測試了各項實驗資料。
為了在移動端真實模擬海洋效果，我們需要開啟反射以及折射，上述測試資料滿足了在移動端使用海水的渲染，保證了程式執行的的流程性，目前該技術正運用於3D海戰手遊開發。
6 結束語
本文通過快速傅立葉變換FFT演算法和基於GPU程式設計實現了海水在移動端的執行，實現了海水隨著風力的變化而變化，在移動端實現了海浪的反射以及折射，光照效果。進一步的工作，我們將模擬浪花效果的實現，以及將海洋網格塊的生成以及LOD移植到GPU程式設計處理，使其效能繼續提高。
最後關於移動端海水實現程式碼和原理可以參考我在CSDN的講課視訊《移動端海水技術實現》。
參考文獻
[1]FOUMIER A. ,REEVES W T. A simple model of ocean waves [J]. Computer Graphics and ACMProceedings of SIGGRAPTH,, l986, 20(4):75-84.
[3] TessendorfJ.Simulatiing Ocean Water.GIGGRAPTH 2001 Course notes.
http://home1.gte.net/tssndrf/index.html,2001
[4]徐迎慶，蘇成，李華等。基於物理模型的流水及波浪模擬.計算機學報,1996,19(增刊):153-160.
[5] G A Mastin,P AWatterberg,J F Mareda.Fourier synthesis of ocean scenes[J]. IEEE ComputerGraphics and Application, 1987,7(3):16-23.
[6]Chen J X,Lobo NV. Toward INteractive-rate Simulation of Fluids with Moving Obstacles UsingNavier-Stokes Equations.Graphical Model and Image Processing, 1995,57(2):107-116.
[7]楊懷平，孫家廣.基於海浪譜的波浪模擬.系統模擬學報,2002,14(9):1175-1178.
[8]ThatcharUlrich. Chunked LOD:Rendering Massive Terrains using Chunked Level of DetailControl.In:Course at ACM SIGGRAPH’02,2002