Cesium入门-2-增加地形

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>自定义的平铺图片数据</title>
    <script src="https://cesiumjs.org/releases/1.54/Build/Cesium/Cesium.js"></script>
    <link href="https://cesiumjs.org/releases/1.54/Build/Cesium/Widgets/widgets.css" rel="stylesheet">
</head>
<body>
    <div id="cesiumContainer"></div>
    <script>
        Cesium.Ion.defaultAccessToken = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiI4MWI5NTY0Mi1iOGE3LTQ3ZTMtOGQ4OC03NThiN2VkZGI4NTYiLCJpZCI6NzY2Niwic2NvcGVzIjpbImFzbCIsImFzciIsImFzdyIsImdjIl0sImlhdCI6MTU1MDIyNTM5OX0.2Abc9p46PA9kJ3E-BaKMXiyb0rvgo7AFUR1nR78VF7c';
        let viewer=new Cesium.Viewer('cesiumContainer',{//世界地形
            terrainProvider:new Cesium.CesiumTerrainProvider({
                url:Cesium.IonResource.fromAssetId(1),
                requestWaterMask:true,
                requestVertexNormals: true
            })
        })

        //设置太阳效果.背面为黑
        viewer.scene.globe.enableLighting=true;

        //添加瓦片数据
        var tileset=viewer.scene.primitives.add(
            new Cesium.Cesium3DTileset({
                url:Cesium.IonResource.fromAssetId(15792)
            })
        )
        viewer.zoomTo(tileset);
    </script>
</body>
</html>

Cesium中地形可以在新建Viewer中，第二个参数，配置项进行配置，由{}对象形式定义

{//世界地形 terrainProvider:new Cesium.CesiumTerrainProvider({ url:Cesium.IonResource.fromAssetId(1), requestWaterMask:true, requestVertexNormals: true }) }

Cesium.IonResource.fromAssetId（“你的CesiumIon资源ID”） CesiumIcon地址https://cesium.com/ion/signin

requestWaterMask:true 设定Cesium额外的水效果，

viewer.scene.globe.enableLighting=true;

设置受太阳光照效果，背光的一面为黑色

        //添加瓦片数据
         var tileset=viewer.scene.primitives.add(
             new Cesium.Cesium3DTileset({
                 url:Cesium.IonResource.fromAssetId(15792)
             })
         )

Cesium中将地图数据由三维变为二维展示中，将一个场景所需要渲染的图片，抽象成瓦片的概念，就类似拼图

本文由创作，采用知识共享署名4.0 国际许可协议进行许可
本站文章除注明转载/出处外，均为本站原创或翻译，转载前请务必署名
最后编辑时间为: 2019/02/17 14:00