複習一下上次的東西，我們在使用這種地圖套件的時候，我個人認為首要的步驟是了解資料結構，如果對於整體的資料結構了然於胸的話，我想查起資料和在這種拼圖式的撰寫中，應該會得心應手，所以我們來複習一下吧。

Basic CesiumJS Application
├── Cesium.Viewer (必要)
│   ├── scene (必要)
│   │   ├── globe (必要)
│   │   │   └── imageryLayers (必要)
│   │   ├── camera (必要)
│   ├── entityCollection (必要)

我們會需要一個Viewer > imageryLayers, Viewer > camera，我需要一個底圖圖資、相機的位置這樣我才能看到地圖。

HTML

你只需要給我一個div容器就好，有id讓js可以去抓到這個容器，至於css就看你地圖想要的大小設置。

<div id="cesiumContainer"></div>

JS

下面可以關注我的補充說明，簡單來說你只要結構對了，有一個view，放上圖資，放上相機，你就可以看到地圖了。

// 創建Cesium Viewer實例
  var viewer = new Cesium.Viewer("cesiumContainer");

  // 添加WMTS圖層
  viewer.imageryLayers.addImageryProvider(
    new Cesium.UrlTemplateImageryProvider({
      // 這邊是用內政部的通用電子地圖，可以去內政部國土測繪參考，如果你有放其他的底圖的話。
      url: "https://wmts.nlsc.gov.tw/wmts/EMAP5/default/EPSG:3857/{z}/{y}/{x}.png",
      tilingScheme: new Cesium.WebMercatorTilingScheme(),
      maximumLevel: 18,
    })
  );

  // 設定視角到台灣
  // 在 CesiumJS 中，攝像機的高度並不像 OpenLayers 那樣直接使用縮放級別（zoom level）的概念，但可以通過計算來模擬這種效果。這涉及將縮放級別轉換為對應的高度。
  viewer.camera.setView({
    destination: Cesium.Cartesian3.fromDegrees(121.5, 25, 150000.0), // 設置初始視角，經度、緯度、高度(km)，所以如果要像openlayers有zoom的感覺需要自己設定in out的公里數
  });

參考

Github