从0开始的Cesium

第一章 Cesium学习入门之搭建Vite+Vue3+Cesium开发环境
第二章 Cesium学习入门之搭建Cesium界面预览和小控件隐藏
第三章 Cesium学习入门之地形数据（DEM）的加载
第四章 Cesium学习入门之加载离线影像图（tif）
第五章 Cesium学习入门之加载影像WMTS切片服务（ArcGIS/Geowebcache）

前言

本文直接从服务加载开始，关于影像的切片和发布请跳转到第二章 ArcGIS影像切片并发布ArcGIS和geowebcache服务

一、Cesium加载ArcGIS的切片服务

1. 访问切片服务并获取参数

登录ArcGIS服务页面，点击ogc服务，选择WMTS服务类型，访问配置文件

配置文件中查看参数

2. 代码展示

    const arcgisTile = new Cesium.WebMapTileServiceImageryProvider({
        url: "https://localhost:6443/arcgis/rest/services/chengdu/MapServer/WMTS/tile/1.0.0/chengdu/{Style}/{TileMatrixSet}/{TileMatrix}/{TileRow}/{TileCol}.png",
        layer: "chengdu",
        style: "default",
        tileMatrixSetID: "default028mm",
        format: "image/png",
        tilingScheme: new Cesium.WebMercatorTilingScheme(),
        maximumLevel: 19,
        tileMatrixLabels: [
            "0",
            "1",
            "2",
            "3",
            "4",
            "5",
            "6",
            "7",
            "8",
            "9",
            "10",
            "11",
            "12",
            "13",
            "14",
            "15",
            "16",
            "17",
            "18",
            "19",
        ],
    });
    viewer.imageryLayers.addImageryProvider(arcgisTile);

二、Cesium加载Geowebcache的切片服务

1. 访问切片服务并获取参数

   访问Geowebcache服务并访问配置文件

配置文件中查看参数

2. 代码展示

    const gwcTile = new Cesium.WebMapTileServiceImageryProvider({
        url: "http://localhost:8050/geowebcache/service/wmts",
        layer: "chengdu",
        style: "default",
        tileMatrixSetID: "EPSG:3857_chengdu",
        format: "image/png",
        tilingScheme: new Cesium.WebMercatorTilingScheme(),
        maximumLevel: 19,
        tileMatrixLabels: [
            "EPSG:3857_chengdu:0",
            "EPSG:3857_chengdu:1",
            "EPSG:3857_chengdu:2",
            "EPSG:3857_chengdu:3",
            "EPSG:3857_chengdu:4",
            "EPSG:3857_chengdu:5",
            "EPSG:3857_chengdu:6",
            "EPSG:3857_chengdu:7",
            "EPSG:3857_chengdu:8",
            "EPSG:3857_chengdu:9",
            "EPSG:3857_chengdu:10",
            "EPSG:3857_chengdu:11",
            "EPSG:3857_chengdu:12",
            "EPSG:3857_chengdu:13",
            "EPSG:3857_chengdu:14",
            "EPSG:3857_chengdu:15",
            "EPSG:3857_chengdu:16",
            "EPSG:3857_chengdu:17",
            "EPSG:3857_chengdu:18",
            "EPSG:3857_chengdu:19",
        ],
    });
    viewer.imageryLayers.addImageryProvider(gwcTile);

三、加载结果