Cesium加载天地图

把leaflet换成cesium,并没有看出来差别,可能是面积太小了吧 变形不明显。。

 http://localhost:8080/cesium/Apps/HelloWorld.html

<script>
        Cesium.Ion.defaultAccessToken='xxxx';
        let viewerOption = {
            animation: false, // 控制场景动画的播放速度控件
            baseLayerPicker: false, // 底图切换控件
            fullscreenButton: false, // 全屏控件
            geocoder: false, // 地理位置查询定位控件
            homeButton: false, // 默认相机位置控件
            timeline: false, // 时间滚动条控件
            infoBox: false,           //是否显示信息框
            sceneModePicker: false, //是否显示3D/2D选择器
            selectionIndicator: false, // 点击点绿色弹出 是否显示选取指示器组件
            sceneMode: Cesium.SceneMode.SCENE3D, //设定3维地图的默认场景模式:Cesium.SceneMode.SCENE2D、Cesium.SceneMode.SCENE3D、Cesium.SceneMode.MORPHING
            navigationHelpButton: false, // 默认的相机控制提示控件
            scene3DOnly: true, // 每个几何实例仅以3D渲染以节省GPU内存
            navigationInstructionsInitiallyVisible: false,
            showRenderLoopErrors: false, //是否显示渲染错误
            orderIndependentTranslucency:false,//设置背景透明
            errainProvider: Cesium.createWorldTerrain()
        };
        
        let viewer = new Cesium.Viewer("cesiumContainer", viewerOption);

        var TDU_Key = "xxxxxx"//天地图申请的**
 
        //在线天地图影像服务地址(墨卡托投影)
        var TDT_IMG_W = "http://{s}.tianditu.gov.cn/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=" + TDU_Key;
        //在线天地图矢量地图服务(墨卡托投影) 
        var TDT_VEC_W = "http://{s}.tianditu.gov.cn/vec_w/wmts?service=wmts&request=GetTile&version=1.0.0" +
            "&LAYER=vec&tileMatrixSet=w&TileMatrix={TileMatrix}&TileRow={TileRow}&TileCol={TileCol}" +
            "&style=default&format=tiles&tk=" + TDU_Key;
        //在线天地图影像中文标记服务(墨卡托投影)  
        var TDT_CIA_W = "http://{s}.tianditu.gov.cn/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=" + TDU_Key
        //在线天地图矢量中文标记服务(墨卡托投影)            
        var TDT_CVA_W = "http://{s}.tianditu.gov.cn/cva_w/wmts?service=wmts&request=GetTile&version=1.0.0" +
            "&LAYER=cva&tileMatrixSet=w&TileMatrix={TileMatrix}&TileRow={TileRow}&TileCol={TileCol}" +
            "&style=default.jpg&tk=" + TDU_Key;
 
//此处插播广告。有BIM模型引擎的需求,可以找我们。官网http://www.qmodel.cn/
 
        let Img = new Cesium.WebMapTileServiceImageryProvider({   //调用影响中文服务
            url: TDT_VEC_W,//url地址,换影像还是矢量,随便你喜欢
            layer: "img_w",    //WMTS请求的层名称
            style: "default",//WMTS请求的样式名称
            format: "tiles",//MIME类型,用于从服务器检索图像
            tileMatrixSetID: "GoogleMapsCompatible",//    用于WMTS请求的TileMatrixSet的标识符
            subdomains: ["t0", "t1", "t2", "t3", "t4", "t5", "t6", "t7"],//天地图8个服务器
            minimumLevel: 0,//最小层级
            maximumLevel: 18,//最大层级
        })
 
        viewer.imageryLayers.addImageryProvider(Img)//添加到cesium图层上
 
 
        let cia = new Cesium.WebMapTileServiceImageryProvider({   //调用影响中文注记服务
            url: TDT_CVA_W,
            layer: "cia_w",
            style: "default",
            format: "tiles",
            tileMatrixSetID: "GoogleMapsCompatible",
            subdomains: ["t0", "t1", "t2", "t3", "t4", "t5", "t6", "t7"],//天地图8个服务器
            minimumLevel: 0,
            maximumLevel: 18,
        })
 
        viewer.imageryLayers.addImageryProvider(cia)//添加到cesium图层上
        viewer.scene.globe.depthTestAgainstTerrain = !0;
 
        // 没有影像图层时地球的底色
        viewer.scene.globe.baseColor = Cesium.Color.BLACK;
 
        viewer.camera.setView({
            destination: new Cesium.Cartesian3(6788280.844465209, -81980750.10214644, 1061921.04004376)
        });
        viewer.camera.flyTo({
          //  destination: new Cesium.Cartesian3.fromDegrees(116.435314, 40.960521, 10000000.0),
          //  duration:8
            destination: new Cesium.Cartesian3.fromDegrees(116.435314, 22.960521, 2000.0),
            duration:18
        });
 
  </script>
原文地址:https://www.cnblogs.com/2008nmj/p/14911966.html