上面地形数据，是调用cesium官方的地图服务，需要先注册cesium账户，配置cesium的账户token才行

1、在线地形服务的示例代码如下

<!DOCTYPE html>

<html lang="en">

<head>

  <meta charset="UTF-8">

  <title>cesium示例</title>

  <!-- 引用cesium的js和css，天地图的扩展js -->

  <script src="https://cesium.com/downloads/cesiumjs/releases/1.92/Build/Cesium/Cesium.js"></script>

  <link rel="stylesheet" href="https://cesium.com/downloads/cesiumjs/releases/1.92/Build/Cesium/Widgets/widgets.css"/>

  <script src="http://api.tianditu.gov.cn/cdn/plugins/cesium/cesiumTdt.js" ></script>

  <style type="text/css">

    html, body, #tiandituContainer {

      width: 100%; height: 100%; margin: 0; padding: 0; overflow: hidden;

    }

  </style>

</head>

<body onload="loadData()">

<div id="tiandituContainer">

</div>

<script>

  //Cesium官网注册后的授权token，没有token不能使用cesium在线的地形服务，这里需要改成自己的token

  Cesium.Ion.defaultAccessToken = "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiI5NjE1MDIwOC1jOGYxLTQzZWItYjNhOC1iNjZlMWM1OGYxMDIiLCJpZCI6MTAyODY5LCJpYXQiOjE2NTkwMDA3ODN9.Vy4hW4jpjbZs6ee4BcRl3-cCl-oRGn42e2_Hjbo5nas";

  var viewer;

   function loadData()

   {

       //默认会调用微软virtualearth地图

        viewer = new Cesium.Viewer('tiandituContainer',{

          animation:false,       //是否显示动画控件

          homeButton:true,       //是否显示home键

          geocoder:true,         //是否显示地名查找控件，如果设置为true，则无法查询

          baseLayerPicker:true, //是否显示图层选择控件

          timeline:false,        //是否显示时间线控件

          fullscreenButton:true, //是否全屏显示

          infoBox:true,         //是否显示点击要素之后显示的信息

          sceneModePicker:true,  //是否显示投影方式控件  三维/二维

          navigationInstructionsInitiallyVisible:false, //导航指令

          navigationHelpButton:false,     //是否显示帮助信息控件

          selectionIndicator:false, //是否显示指示器组件

        });

        //隐藏cesium的logo

        viewer._cesiumWidget._creditContainer.style.display = "none";

        //默认的Cesium会加载一个bingMap底图，这个地图网络不太好，一般要先去掉这个默认的

        viewer.imageryLayers.remove(viewer.imageryLayers.get(0));

        //arcgis在线影像地图

        viewer.imageryLayers.addImageryProvider(new Cesium.ArcGisMapServerImageryProvider({

            name:"img_arcgis",

            url:"https://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer"

        }));

         //加载Cesium的在线Asset地形数据--有点慢

         // var terrainProvider = new Cesium.CesiumTerrainProvider({

         //       url : Cesium.IonResource.fromAssetId(1),

         //       requestWaterMask: true, // 请求水体效果所需要的海岸线数据

         //       requestVertexNormals: true, // 请求地形照明数据

         //     });

         //   viewer.terrainProvider = terrainProvider;

         //加载Cesium默认的地形数据。Bing在线地形影像--很慢，可以指定mapStyle，详见BingMapsStyle类

         var terrainProvider = Cesium.createWorldTerrain({

           requestWaterMask: true, // 请求水体效果所需要的海岸线数据

           requestVertexNormals: true, // 请求地形照明数据

         });

         viewer.terrainProvider = terrainProvider;

         viewer.scene.globe.depthTestAgainstTerrain = true;//地形遮挡效果开关，打开后地形会遮挡看不到的区域

         viewer.scene.globe.enableLighting = true; //对大气和雾启用动态照明效果

          //将三维球定位到指定位置，camera是相机，是当前视野范围相机

          //destination是相机的目标位置，参数是经度、纬度、高度

          //orientation是相机朝向

          //    heading-代表镜头左右方向,正值为右,负值为左

          //    pitch-代表镜头上下方向,正值为上,负值为下.

          //    roll-代表镜头左右倾斜,正值,向右倾斜,负值向左倾斜

          viewer.camera.flyTo({

              destination: Cesium.Cartesian3.fromDegrees(114.47004, 37.0904, 20000000),

              orientation: {

                  heading :  Cesium.Math.toRadians(348.4202942851978),

                  pitch : Cesium.Math.toRadians(-89.74026687972041),

                  roll : Cesium.Math.toRadians(0)

              },

              complete:function callback() {

                  // 定位完成之后的回调函数

              }

          });

   }

</script>

</body>

</html>

2、自己下载高精地形数据，并发布服务

下载地址：地理空间数据云 (gscloud.cn)

（1）下载数据

（2）数据处理

下载之后的数据为压缩包，解压之后，在ArcGIS中拼接、裁剪（也可以选择其他软件）

 （3）用cesiumlab进行切片

 （4）用tomcat或者nginx发布地图服务

把切片结果（文件夹YiChangShi）拷贝至tomcat的webapps文件下，启动服务，记录访问地址http://localhost:7080/YiChangShi/

window.viewer = new Cesium.Viewer('mapContainer', {

        sceneMode: Cesium.SceneMode.SCENE3D,

        infoBox: false, //信息框

        selectionIndicator: false, //绿色框

        geocoder: false,//是否显示geocoder小器件，右上角查询按钮

        homeButton: false,//是否显示Home按钮

        sceneModePicker: false,//是否显示3D/2D选择器

        baseLayerPicker: false,//是否显示图层选择器

        navigationHelpButton: false,//是否显示右上角的帮助按钮

        animation: false,//是否创建动画小器件，左下角仪表

        timeline: false,//是否显示时间轴

        fullscreenButton: false,//是否显示全屏按钮

        // imageryProvider: tdtImageryProvider, // 天地图

        terrainProvider: new Cesium.CesiumTerrainProvider({

            url:"http://localhost:7080/YiChangShi/",

            minimumLevel: 0,

            maximumLevel: 15,

        }),

    });

cesium教程2-加载显示地形地图的更多相关文章

  1. leaflet-webpack 入门开发系列二加载不同在线地图切换显示（附源码下载）

    前言 leaflet-webpack 入门开发系列环境知识点了解: node 安装包下载webpack 打包管理工具需要依赖 node 环境,所以 node 安装包必须安装,上面链接是官网下载地址 w ...

  2. 1.BMap(百度地图)第二次加载显示不全

    问题: bmap第一次加载显示没问题: 第二次 再次加载这个页面时,地图的显示出现了问题: . 分析问题出现原因:你要确保dom创建后且处于显示状态(即display不能为none)才能再次初始化地图 ...

  3. Ogre 编辑器二(用Ogre的地形组件加载天龙八部地形)

    主界面如上文设计完成后,场景刚开始添加了是Ogre例子里的,发现场景里实物太少,于是想到直接把天龙的场景拿下来,天龙网上有源码,参考了下,把天龙的地形用Ogre的地形组件完成了下,如下是效果图: 因为 ...

  4. OpenLayers学习笔记（一）—在线加载谷歌影像地图&离线加载本地瓦片地图

    实现根据在线离线判断加载地图, 在线加载谷歌影响地图, 离线加载本地瓦片地图 作者: 狐狸家的鱼 Github: 八至 html代码 <div id="map" tabind ...

  5. cesium初探之加载三维模型

    项目需要用到二三维地图切换,本来准备研究ArcGIS js for Web 3d,但考虑到版权的问题,决定试着用cesium来做,于是花了2天时间抱着试试看的心态把cesium从环境配置到加载三维模型 ...

  6. Cesium for Unreal加载倾斜摄影

    本文介绍UE4中通过Cesium插架加载本地倾斜摄影模型.Cesium for Unreal插件运行在UE环境何总运行Cesium,这样方便做一个GIS应用. 安装Cesium for Unreal插 ...

  7. bootstrap模态框modal使用remote第二次加载显示相同内容解决办法

    bootstrap模态框modal使用remote动态加载内容,第二次加载显示相同内容解决办法 bootstrap的modal中,使用remote可以动态加载页面到modal-body中,并弹窗显示 ...

  8. [ActionScript 3.0] AS3.0 动态加载显示内容

    可以将下列任何外部显示资源加载到 ActionScript 3.0 应用程序中: 在 ActionScript 3.0 中创作的 SWF 文件 — 此文件可以是 Sprite.MovieClip 或扩 ...

  9. SDWebImage 加载显示 GIF 与性能问题

    SDWebImage 加载显示 GIF 与性能问题 SDWebImage 4.0 之前,可以用 UIImageView 显示 GIF 图.如果 SDWebImage 4.0 还这么做,只会显示静态图. ...

  10. SDWebImage 加载显示 WebP 与性能问题

    SDWebImage 加载显示 WebP 与性能问题 本文包含自定义下载操作 SDWebImageDownloaderOperation 与编码器 SDWebImageCoder.SDWebImage ...

随机推荐

  1. Java 实现OCR扫描/识别图片文字

    图片内容一般无法编辑,如果想要读取图片中的文本,我们需要用到OCR工具.本文将介绍如何在Java中实现OCR识别读取图片中的文字. 所需工具: IDEA Spire.OCR for Java - Ja ...

  2. USACO 4.2

    目录 洛谷 2740 草地排水 代码(网络最大流) 洛谷 2751 工序安排 分析 代码 洛谷 1894 完美的牛栏 代码(二分图最大匹配) 草地排水洛谷传送门,草地排水USACO传送门 工序安排洛谷 ...

  3. OpenHarmony使用ArkUI Inspector分析布局

      本文转载自<#2023 盲盒+码 # OpenHarmony使用ArkUI Inspector分析布局>,作者:zhushangyuan_ OpenHarmony使用ArkUI Ins ...

  4. 【直播回顾】参与ArkUI,共建OpenHarmony繁荣生态

    5月31日晚上19点,战"码"先锋第三期直播 <参与ArkUI,共建OpenHarmony繁荣生态> ,在OpenHarmony社群内成功举行.   本期课程,由华为终 ...

  5. OpenHarmony Liteos_A内核之iperf3移植心得

    一.iperf3工作原理 iperf3主要的功能是测试基于特定路径的带宽,在客户端和服务器端建立连接(三次握手)后,客户端发送一定大小的数据报并记下发送的时间,或者客户端在一定的时间内发送数据并记下发 ...

  6. 对OpenHarmony中LiteOS的内核分析——超时原理和应用

    前言 在软件世界里面,超时是一个非常重要的概念.比如 ● 当前线程暂时休眠1秒钟,休眠结束后继续执行 ● 每5秒钟采集一下CPU利用率 ● 数据发送失败,2秒钟以后再试一试 ● 等待某种数据,但最多等 ...

  7. Python删除文件、文件夹----os

    使用 os  删除文件 import os '''删除文件 语法: os.unlink(path) 示例: 删除 b 文件夹中的 12.txt ''' os.unlink('b/12.txt')   ...

  8. centos-stream-9 centos9 配置国内yum源 阿里云源

    源配置 tips: yum配置文件路径 /etc/yum.repos.d/centos.repo 1.备份源配置 [Very Important!] mv /etc/yum.repos.d/cento ...

  9. VulnHub-Jangow-01-1.0.1打靶记录

    知识点 NMAP参数 -sV 获取系统信息 -sT TCP扫描可能会留下日志记录 -sC 使用默认脚本(在-A模式下不需要) -p1-xxx 扫描端口号 -p- ==>等价于 -p1-65535 ...

  10. 力扣341(java)-扁平化嵌套列表迭代器（中等）

    题目: 给你一个嵌套的整数列表 nestedList .每个元素要么是一个整数,要么是一个列表:该列表的元素也可能是整数或者是其他列表.请你实现一个迭代器将其扁平化,使之能够遍历这个列表中的所有整数. ...