項目需要用到二三維地圖切換，本來準備研究ArcGIS js for Web 3d，但考慮到版權的問題，決定試著用cesium來做，於是花了2天時間抱著試試看的心態把cesium從環境配置到加載三維模型完整的走了一遍。

一、環境配置

1.下載cesium js

下載地址 https://github.com/AnalyticalGraphicsInc/cesium/releases ，版本已是1.28。

2.下載安裝nodejs

我去官網(https://nodejs.org/en/)下載的V6.9.2,這其實已經包括了npm，打開安裝文件，一直默認安裝，完成之後在cmd命令行中鍵入node -v以及npm確定node.js安裝完成。

3.打開cmd命令行進入到cesium的安裝目錄(比如d盤的123文件夾底下的456文件夾 你在cmd中輸入D: 回車 再輸入cd 123/456 就進去了)，執行npm install，這個過程因為要連接到國外的網站，過程會非常慢，如果安裝失敗可以去網上找找原因，該命令執行成功後會在cesium根目錄下創建node_modules目錄。

4.安裝gulp作為項目開發的依賴，如下圖

gulp安裝之後會在node_modules目錄中創建執行gulp命令所需要的依賴包，如下圖 ：

二、編譯cesiumjs

在cesium根目錄執行gulp default命令，將會在cesiumjs安裝的根目錄創建一個Build文件夾，裏面包含的是編譯後生成的cesium.js文件及相關組件。 其中cesium主js位於我的CesiumUnminified文件夾中。

三、準備三維數據

Cesium中目前支持gltf和bgltf兩種格式，gltf和bgltf都可以通過dae格式的三維模型轉換而來，這裏我使用的模型是直接下載的dae格式數據，使用colladaTogltf.exe轉換工具轉成gltf格式。

1.通過cmd進入到colladaTogltf.exe所在的文件夾，使用如下命令即可：

collada2gltf.exe–f daePath -e或者collada2gltf.exe–f daePath -o gltfPath，這裏的daePath為dae文件的全路徑，比如C:\Test.dae，gltfPath為gltf的輸出路徑。

另外這裏使用-e命令選項的意思是把轉換後的gltf只輸出為一個文件，其把幾何和紋理數據一起打包在一起；-o命令則一般輸出3個格式.bin、.gltf、.glsl。（Cesium在1.16後提供了紋理和幾何異步加載的機制，這樣就建議不要用-e了）

轉換成功時的命令行會輸出轉換過程中轉換的一些信息，包含了幾何和動畫信息，並且轉換後的gltf會在dae目錄或者指定的文件夾下。

（這裏我發現一個比較坑的問題，有人說這個bug已經消除了，但還是遇到了,應該是轉換器colladaTogltf.exe的bug，當我的dae、gltf、exe文件沒放一個文件夾時，轉化成gltf文件後，gltf文件內部的文件關聯都是相對於exe的相對路徑，如果移到其他位置，就找不到gltf的關聯文件了。我們可以用文本編輯器修改關聯文件的路徑，也可以直接將dae、gltf、exe放到同一個文件夾。）

四、cesium開發，加載三維模型

這部分主要涉及的是cesium開發了，因為剛剛接觸，所以做了一個最簡單的例子，加載默認地圖，在地圖中加入三維模型。

1.引入必要的js、css，創建容器

2.創建地圖，在視角中加入三維模型

以下是效果圖：

cesium初探之加載三維模型