Cesium 加载在线天地图瓦片和离线瓦片功能（cesium开发记录）

Cesium 加载在线天地图瓦片功能

1、未联网状态加载默认本地底图，保证地球有底图显示

let viewer = new Cesium.Viewer('cesiumContainer', {
    // 未联网状态下 默认显示球面地图
    imageryProvider: new Cesium.TileMapServiceImageryProvider({
        url: Cesium.buildModuleUrl('Assets/Textures/NaturalEarthII')
    }),
    orderIndependentTranslucency: false,
    contextOptions: {
        webgl: {
            alpha: true
        }
    },
    baseLayerPicker: false,
    geocoder: false,
    timeline: true,
    navigationHelpButton: false,
    animation: false,
    fullscreenButton: false,
    skyAtmosphere: false, //光圈
    infoBox: false, //信息提示盒
    selectionIndicator: false //选中提示框
});

2、添加天地图瓦片（影像底图、影像注记）

var subdomains = ['0', '1', '2', '3', '4', '5', '6', '7'];
var layers = viewer.imageryLayers;
var blackMarble1 = layers.addImageryProvider(
    new Cesium.WebMapTileServiceImageryProvider({
        //影像底图
        url:
            'http://t{s}.tianditu.com/img_w/wmts?service=wmts&request=GetTile&version=1.0.0&LAYER=img&tileMatrixSet=w&TileMatrix={TileMatrix}&TileRow={TileRow}&TileCol={TileCol}&style=default&format=tiles&tk=' +
            '您的密钥',
        subdomains: subdomains,//URL模板中用于{s}占位符的子域。如果该参数是单个字符串，则字符串中的每个字符都是一个子域。如果它是一个数组，数组中的每个元素都是一个子域
        layer: 'tdtImgLayer',
        style: 'default',
        format: 'image/jpeg',
        tileMatrixSetID: 'GoogleMapsCompatible', //使用谷歌的瓦片切片方式
        show: true
    })
);
var blackMarble2 = layers.addImageryProvider(
    new Cesium.WebMapTileServiceImageryProvider({
        //影像注记
        url:
            'http://t{s}.tianditu.com/cia_w/wmts?service=wmts&request=GetTile&version=1.0.0&LAYER=cia&tileMatrixSet=w&TileMatrix={TileMatrix}&TileRow={TileRow}&TileCol={TileCol}&style=default.jpg&tk=' +
            '您的密钥',
        subdomains: subdomains,
        layer: 'tdtCiaLayer',
        style: 'default',
        format: 'image/jpeg',
        tileMatrixSetID: 'GoogleMapsCompatible',
        show: true
    })
);
blackMarble1.alpha = 0.5;// 透明度 imageryLayer
blackMarble1.brightness = 2.0; // 亮度 imageryLayer
blackMarble2.alpha = 0.5;
blackMarble2.brightness = 2.0;

3、天地图密钥获取以及图层更换官网地址

http://lbs.tianditu.gov.cn/server/MapService.html
https://console.tianditu.gov.cn/api/key
更换图层只需更换对应的"http://t{s}.tianditu.com/cia_w/wmts"

Cesium 加载离线瓦片功能

需要下载网上的瓦片资源到本地服务器使用，保存为谷歌瓦片格式如下：

const base = '存放离线瓦片的服务器地址'
viewer.imageryLayers.addImageryProvider(new Cesium.UrlTemplateImageryProvider({
     url: `http://${base}/tiles/{z}/{x}/{y}.png`, //服务地址
 }))