#三維視覺化##3D開發#

為了控制穀物儲藏溫度，需要創造一個不利於蟲黴生長低溫環境的儲糧技術環境，然而出於成本考慮以及進出糧的需要，糧堆內的溫度感測器設定數量有限，因此在儲糧當中測得的溫度值只是感測器附近的溫度，其他部分則需要利用相應的方法進行數值模擬。

因此，我們的客戶採用雙B樣條取樣方法進行數值模擬，並從時間和空間域兩方面進行分析，採用B樣條插值函式的方法進行溫度插值擬合，這樣就能夠解決糧食溫度感測器密度的缺陷，並利用 WebGL技術實現糧堆溫度的視覺化。

B樣條曲線一般應用在計算機輔助設計與製造當中，是一種由大量控制點生成曲線的工具，它具有樣條曲線的普遍特性：

（1）是一條只需要幾個點依次指定的光滑曲線；

（2）可以透過相應演算法找到曲線或者曲面的點；

（3）根據人們對近似度的需求，透過迭代計算方法使用線段能足夠準確再現曲線的形狀。

曲線有9個控制點定義，曲線整體趨向控制點，B樣條曲線按照節點分佈的情況，分為均勻B樣條曲線和非均勻B樣條曲線。

透過建立一個HTML頁面，在HTML當中新增 canvas元素以便於 WebGL進行渲染，然後再在body上新增 onload事件來接收初始化整個 WebGL環境。於是在頁面載入完成後，呼叫 onload中的函式， WebGL開始渲染。

某一糧倉當中糧堆內感測器排列如圖中球體呈8×6×3矩形排列。每一個球體代表糧堆內相應位置的感測器，當感測器提示溫度正常時，球體呈綠色，溫度過高或者過低時，球體呈紅色；資料顯示不正常時呈藍色利用滑鼠拖動整個矩陣，可以從不同角度觀察糧堆內整體情況感測擬圖。

糧堆內部某一平面溫度如圖5所示，利用滑鼠可以從各個角度觀察儲糧資訊。X、Y代表糧堆內某一平面糧食的實際位置，Z代表相應點的溫度值，Z=0即XY面代表一溫度基面，高於XY則該面的糧食溫度過高，相反低於該面，說明糧面溫度處於警戒線以下。

// 如果溫度>25 改變顏色function changeColor(obj) {	var temper = obj.getAttribute("monitorData/溫度");	var value = temper.substr(0, temper.indexOf("℃"));	if (value > 25) {		obj.style.color = 'rgb(255,0,0)';	}	else {		obj.style.color = null;	}}

透過B樣條插值曲面的方法對糧堆內部的溫度分佈進行數值模擬，然後利用WGL技術實現溫度監控的三維視覺化，因為其具有跨平臺、免外掛以及聯網資料互動的特性，比起普通方法更直觀、高效，便於相關人員遠端監控。

鑑於WebGL的特性，人們還可以透過手機、平板等移動終端訪問實時瞭解糧堆內溫度資訊，不過由於直接在GPU端渲染，一般的移動終端限於硬體條件只能訪問簡單的頁面，但是在電子技術日新月異的今天，這些問題一定能夠得到解決。