“任意多边形地形开挖” 是“地形开挖”的补充篇,在这节里,我们介绍关于如何使用任意多边形对地形进行开挖,同时,由于有不少小伙伴也咨询了关于“地形开挖”篇后序内容中的填充地形的效果,之前没放出来,是想让小伙伴有个思考的过程,现在放出来,也是提供一种解决方法。

效果图

直接上代码说明方法

1、使用鼠标交互事件,采集需要开挖的范围

注: 这里要特别注意一点,为了下面的计算 ClippingPlane 方便,采集点顺序最好是 逆时针,如果点集的组织是顺时针,需要首先逆序成逆时针,关于如果判断一个点集是否是顺时针或者是逆时针,可以用向量法求多边形面积的方式,如果为正,则为顺时针,否者为逆时针。或者使用JS插件计算,比如turf.js。

  • var points = [
  • new Cesium.Cartesian3(-1715292.6999753984, 4993153.157628936, 3566663.752912529),
  • new Cesium.Cartesian3(-1715285.8150713604, 4993167.072601330,3566647.6921528564),
  • new Cesium.Cartesian3(-1715286.5985765400, 4993181.309761941, 3566627.519787549),
  • new Cesium.Cartesian3(-1715299.0249209427, 4993191.177501195, 3566607.861264360),
  • new Cesium.Cartesian3(-1715349.5762367432, 4993176.675656664, 3566603.878289345),
  • new Cesium.Cartesian3(-1715375.5538853381, 4993159.990032478, 3566614.671147202),
  • new Cesium.Cartesian3(-1715370.1945772346, 4993141.041835706, 3566643.580587877),
  • new Cesium.Cartesian3(-1715359.7019716015, 4993131.063945592, 3566662.468046927),
  • new Cesium.Cartesian3(-1715321.9141253997, 4993137.762602262, 3566671.205164391)
  • ];

2、根据点集计算 ClippingPlane (这个计算方式来源于官网示例)

  • var pointsLength = points.length;
  • var clippingPlanes = []; // 存储ClippingPlane集合
  • for (var i = 0; i < pointsLength; ++i) {
  • var nextIndex = (i + 1) % pointsLength;
  • var midpoint = Cesium.Cartesian3.add(points[i], points[nextIndex], new Cesium.Cartesian3());
  • midpoint = Cesium.Cartesian3.multiplyByScalar(midpoint, 0.5, midpoint);
  •  
  • var up = Cesium.Cartesian3.normalize(midpoint, new Cesium.Cartesian3());
  • var right = Cesium.Cartesian3.subtract(points[nextIndex], midpoint, new Cesium.Cartesian3());
  • right = Cesium.Cartesian3.normalize(right, right);
  •  
  • var normal = Cesium.Cartesian3.cross(right, up, new Cesium.Cartesian3());
  • normal = Cesium.Cartesian3.normalize(normal, normal);
  •  
  • var originCenteredPlane = new Cesium.Plane(normal, 0.0);
  • var distance = Cesium.Plane.getPointDistance(originCenteredPlane, midpoint);
  •  
  • clippingPlanes.push(new Cesium.ClippingPlane(normal, distance));
  • }

3、赋值给globe的 clippingPlanes 属性

更多详情见下面链接文章

Cesium专栏-地形开挖2-任意多边形开挖(附源码下载)

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

Cesium专栏-地形开挖2-任意多边形开挖(附源码下载)的更多相关文章

  1. Cesium专栏-空间分析之坡度分析(附源码下载)

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

  2. Cesium专栏-样条插值(平滑路径、飞行动画,源码下载)

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

  3. cesium 之加载地形图 Terrain 篇(附源码下载)

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

  4. leaflet结合turf.js实现多边形分割(附源码下载)

    前言 leaflet 入门开发系列环境知识点了解: leaflet api文档介绍,详细介绍 leaflet 每个类的函数以及属性等等 leaflet 在线例子 leaflet 插件,leaflet ...

  5. cesium 之地图切换展示效果篇(附源码下载)

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

  6. Cesium专栏-填挖方分析(附源码下载)

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

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

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

  8. cesium 雷达扫描(附源码下载)

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

  9. cesium 实现风场图效果(附源码下载)

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

随机推荐

  1. matlab-汉字unicode编码转换

    str='黑大哥'bianma=unicode2native(str); disp(bianma); pp=native2unicode(bianma);disp(pp)

  2. 【计算机网络】你真的了解HTTP(HTTPS)协议的这12个知识点吗

    HTTP协议 1. 介绍一下OSI七层参考模型和TCP/IP五层模型 1.1 OSI七层模型 1.2 TCP/IP五层模型 1.3 各层的设备 [各层设备] 1.4 各层对应协议 2. HTTP协议和 ...

  3. 关于JMeter原子性相关探究

    1.背景 最近宝路遇到个项目,在使用JMeter过程中引发了一些思考,宝路尝试用各种方式去验证,进而有了今天"JMeter原子性"相关主题. 2.目的 探究JMeter的事务的原子 ...

  4. centos7安装fail2ban

    fail2ban是一款非常实用的安全软件,通过监视系统日志,设置错误登陆次数,可阻挡暴力密码攻击. 1.安装epelyum install epel-release -y 2.安装fail2banyu ...

  5. Server MyEclipse Tomcat v7.0 was unable to start within 45 seconds. If the server requires more time

    启动Tomcat服务器时经常遇到这个错误, Server MyEclipse Tomcat v7.0 was unable to start within 45 seconds. If the ser ...

  6. Qt之高DPI显示器(一) - 解决方案整理

    目录 DPI发展 1.PPI 2.DPI 一.Win自适应系统 二.Qt机制 1.Windows系统DWM缩放 2. Qt适配高DPI 3.适配DPI结论 三.Qt适配 四.自己适配 1.窗口大小 2 ...

  7. php 7.4 的 Unpacking inside arrays (...)

    总的说明 php 7.4 增加了一个很有意思的功能 这是官方说明: Unpacking inside arrays <?php$parts = ['apple', 'pear'];$fruits ...

  8. java基础-泛型举例详解

    泛型 泛型是JDK5.0增加的新特性,泛型的本质是参数化类型,即所操作的数据类型被指定为一个参数.这种类型参数可以在类.接口.和方法的创建中,分别被称为泛型类.泛型接口.泛型方法. 一.认识泛型 在没 ...

  9. 小白探究UE4网络系列(一)、UE4网络基础类分析

    转载请标明出处:http://www.cnblogs.com/zblade/ 一.概要 捣鼓UE4也有两个多月了,从这儿开始,逐步探究UE4中经典的值复制,RPC两种同步方式.想要弄到其复制和调用的原 ...

  10. javascript类数组

    一.类数组定义: 而对于一个普通的对象来说,如果它的所有property名均为正整数,同时也有相应的length属性,那么虽然该对象并不是由Array构造函数所创建的,它依然呈现出数组的行为,在这种情 ...