前言

cesium 官网的api文档介绍地址cesium官网api,里面详细的介绍 cesium 各个类的介绍,还有就是在线例子:cesium 官网在线例子,这个也是学习 cesium 的好素材。

内容概览

1.基于cesium 实现地形图 Terrain 效果
2.源代码 demo 下载

本篇实现 cesium 加载地形图 Terrain 功能,效果图如下:

  • cesium 支持地形图数据格式
    Quantized-mesh ,Cesium团队提供的开发的格式
    Heightmap,Google Earth Enterprise
  • cesium 加载地形图类 CesiumTerrainProvider
    cesium 中添加地形数据,我们创建一个 CesiumTerrainProvider, 指定一个 URL 地址和一些配置的选项,然后讲它分配给一个 viewer.terrainProvider。在这个实例中,我们可以使用 createWorldTerrain 辅助功能创建一个 Cesium 世界地形。
    核心代码:
//Cesium动态叠加地形图
MapConfig.terrainObj = {url:"//assets.agi.com/stk-terrain/world",requestWaterMask:false,requestVertexNormals:false,proxyUrl:""};
MapConfig.terrainObj = {url:"http://localhost:8180/cesium/worldTerrain",requestWaterMask:false,requestVertexNormals:false,proxyUrl:""}; /**
* 添加地形图图层
* @method addTerrainLayer
* @param url 地形图url proxyUrl 代理请求url
* @return
*/
addTerrainLayer: function (terrainObj) {
if (terrainObj.url && terrainObj.url.replace(/(^s*)|(s*$)/g, "").length >0)
{
var provider ={};
if(terrainObj.proxyUrl && terrainObj.proxyUrl.length>0)
provider = {proxy:new Cesium.DefaultProxy(terrainObj.proxyUrl),url:terrainObj.url,requestWaterMask:terrainObj.requestWaterMask,requestVertexNormals:terrainObj.requestVertexNormals};
else
provider = {url:terrainObj.url,requestWaterMask:terrainObj.requestWaterMask,requestVertexNormals:terrainObj.requestVertexNormals}; var terrainProvider = new Cesium.CesiumTerrainProvider(provider);
this.cesiumViewer.terrainProvider = terrainProvider;
}
}

RequestWaterMask 和 requestVertexNormals 的配置选项,是告诉 Cesium 需要额外的获取水和照明效果。默认情况下他们设置是 false。

更多的详情见GIS之家小专栏

文章尾部提供源代码下载,对本专栏感兴趣的话,可以关注一波

cesium 之加载地形图 Terrain 篇(附源码下载)的更多相关文章

  1. Cesium专栏-雷达遮罩动态扫描(附源码下载)

    Cesium 是一款面向三维地球和地图的,世界级的JavaScript开源产品.它提供了基于JavaScript语言的开发包,方便用户快速搭建一款零插件的虚拟地球Web应用,并在性能,精度,渲染质量以 ...

  2. leaflet-webpack 入门开发系列四图层控件样式优化篇(附源码下载)

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

  3. jQuery+Ajax滚屏异步加载数据实现(附源码)

    一.CSS样式 body { font:12px/1.0em Microsoft Yahei; line-height:1.6em; background:#fff; line-height:1.2e ...

  4. cesium 结合 geoserver 实现地图属性查询(附源码下载)

    前言 cesium 官网的api文档介绍地址cesium官网api,里面详细的介绍 cesium 各个类的介绍,还有就是在线例子:cesium 官网在线例子,这个也是学习 cesium 的好素材. 内 ...

  5. Cesium专栏-气象卫星云图动图(附源码下载)

    Cesium Cesium 是一款面向三维地球和地图的,世界级的JavaScript开源产品.它提供了基于JavaScript语言的开发包,方便用户快速搭建一款零插件的虚拟地球Web应用,并在性能,精 ...

  6. cesium结合geoserver实现地图空间查询(附源码下载)

    前言 cesium 官网的api文档介绍地址cesium官网api,里面详细的介绍 cesium 各个类的介绍,还有就是在线例子:cesium 官网在线例子,这个也是学习 cesium 的好素材. 内 ...

  7. cesium 实现 3d-tiles 平移旋转贴地(附源码下载)

    前言 cesium 官网的api文档介绍地址cesium官网api,里面详细的介绍 cesium 各个类的介绍,还有就是在线例子:cesium 官网在线例子,这个也是学习 cesium 的好素材. 内 ...

  8. 使用jQuery和CSS3制作数字时钟(jQuery篇) 附源码下载

    HTML 和上一篇文章:使用jQuery和CSS3制作数字时钟(CSS3篇)一样的HTML结构,只是多了个>date用来展示日期和星期的. <div id="clock" ...

  9. Cesium专栏-绕点飞行效果(附源码下载)

    Cesium Cesium 是一款面向三维地球和地图的,世界级的JavaScript开源产品.它提供了基于JavaScript语言的开发包,方便用户快速搭建一款零插件的虚拟地球Web应用,并在性能,精 ...

随机推荐

  1. HTTP 前端需明白的相关知识点

    简介: http(Hyper Text Transfer Protocol)超文本传输协议是万维网应用层的协议,使用了面向连接的TCP作为运输层协议. 特征: 简单快速:通过url就可以访问资源,协议 ...

  2. call(),apply()方法解析(一)

    1.call()和apply()的作用是改变this指向,区别是传参列表不同(前者连续参数,后者为参数数组) 2.方法定义: function.apply(thisObj[, argArray]) f ...

  3. javascript 数组以及对象的深拷贝(复制数组或复制对象)的方法

    前言 for,slice(0),concact() 在js中,数组和对象的复制如果使用=号来进行复制,那只是浅拷贝.如下图演示:  如上,arr的修改,会影响arr2的值,这显然在绝大多数情况下,并不 ...

  4. javascript知识详解之8张思维导图

    学习的道路就是要不断的总结归纳,好记性不如烂笔头,so,下面将po出8张javascript相关的思维导图. 思维导图小tips:思维导图又叫心智图,是表达发射性思维的有效的图形思维工具 ,它简单却又 ...

  5. hibernate 增改查后对象的三种状态转换

    this.getSession().update(obj); this.getSession().merge(obj); this.getSession().saveOrUpdate(obj);1. ...

  6. 在Windows Server 2008 R2下搭建jsp环境(一)

    要把jsp项目发布到服务器上必须要有其运行的环境,首先要明确的是: 1.数据库环境:mysql,下载和安装步骤见: 2.后台代码环境:JDK,下载和安装步骤见: 3.服务器:Apache Tomcat ...

  7. 渐进式Web应用(PWA)入门教程(下)

    上篇文章我们对渐进式Web应用(PWA)做了一些基本的介绍. 渐进式Web应用(PWA)入门教程(上) 在这一节中,我们将介绍PWA的原理是什么,它是如何开始工作的. 第一步:使用HTTPS 渐进式W ...

  8. 建立CMenu菜单项,实现选中菜单项点击左键响应事件

    这里我只是根据自己的项目做了一些总结,实现点击右键弹出菜单项,点左键选择菜单项: CMenu menu; VERIFY(menu.CreatePopupMenu());//新建一个cmenu菜单项 m ...

  9. Spring mvc 上传进度条实现

    以下的仅仅是学习而已,记录以下笔记 1 springmvc 进度条,要实现ProgressListener接口,实现方法update(long readLength, long contextLeng ...

  10. setContentType与setCharacterEncoding的区别

    setCharacterEncoding只是设置字符的编码方式 setContentType除了可以设置字符的编码方式还能设置文档内容的类型 1.setCharacterEncoding respon ...