cesium面积测量

article/2025/9/21 12:07:02

使用方法新建一个文件measureArea.js将下面代码贴上去

// DrawPolygon
/*
绘制面(面积测量)*/class measureArea {constructor(arg) {this.objId = Number(new Date().getTime() + "" + Number(Math.random() * 1000).toFixed(0));this.viewer = arg.viewer;this.Cesium = arg.Cesium;this.callback = arg.callback;this._polygon = null; //活动面this._polygonLast = null; //最后一个面this._positions = []; //活动点this._entities_point = []; //脏数据this._entities_polygon = []; //脏数据this._polygonData = null; //用户构造面}//返回最后活动面get polygon() {return this._polygonLast;}//返回面数据用于加载面getData() {return this._polygonData;}//加载面loadPolygon(data) {var $this = this;return this.viewer.entities.add({polygon: {hierarchy: new $this.Cesium.PolygonHierarchy(data),clampToGround: true,show: true,fill: true,material: $this.Cesium.Color.RED.withAlpha(0.5),width: 3,outlineColor: $this.Cesium.Color.BLACK,outlineWidth: 1,outline: false,classificationType: Cesium.ClassificationType.BOTH // 支持类型： 地形、3DTile、或者在地面上}});}//开始绘制startCreate() {var $this = this;this.handler = new this.Cesium.ScreenSpaceEventHandler(this.viewer.scene.canvas);this.handler.setInputAction(function(evt) {//单机开始绘制var cartesian = $this.getCatesian3FromPX(evt.position);if ($this._positions.length == 0) {$this._positions.push(cartesian.clone());}if (cartesian) {$this.createPoint(cartesian);$this._positions.push(cartesian);}}, $this.Cesium.ScreenSpaceEventType.LEFT_CLICK);this.handler.setInputAction(function(evt) {//移动时绘制面if ($this._positions.length < 1) return;var cartesian = $this.getCatesian3FromPX(evt.endPosition);if ($this._positions.length == 3) {if (!$this.Cesium.defined($this._polygon)) {$this._polygon = $this.createPolygon();}}if (cartesian) {$this._positions.pop();$this._positions.push(cartesian);}}, $this.Cesium.ScreenSpaceEventType.MOUSE_MOVE);this.handler.setInputAction(function(evt) {if (!$this._polygon) return;var cartesian = $this.getCatesian3FromPX(evt.position);$this._positions.pop();$this._positions.push(cartesian);$this.createPoint(cartesian);$this._polygonData = $this._positions.concat();$this.viewer.entities.remove($this._positions); //移除$this._positions = null;$this._positions = [];var Polygon = $this.loadPolygon($this._polygonData);$this._entities_polygon.push(Polygon);$this._polygonLast = Polygon;var textArea = $this.getArea($this._polygonData) + "平方米";$this.createPointLabel($this._polygonData[$this._polygonData.length - 1],textArea);$this.destroy();if (typeof $this.callback == "function") {$this.callback(cartesian);}}, $this.Cesium.ScreenSpaceEventType.RIGHT_CLICK);}//创建面createPolygon() {var $this = this;var polygon = this.viewer.entities.add({polygon: {hierarchy: new $this.Cesium.CallbackProperty(function() {return new $this.Cesium.PolygonHierarchy($this._positions);}, false),clampToGround: true,show: true,fill: true,material: $this.Cesium.Color.RED.withAlpha(0.5),width: 3,outlineColor: $this.Cesium.Color.BLACK,outlineWidth: 1,outline: false}});$this._entities_polygon.push(polygon);return polygon;}//创建点createPoint(cartesian) {var $this = this;var point = this.viewer.entities.add({position: cartesian,point: {pixelSize: 10,color: $this.Cesium.Color.YELLOW,disableDepthTestDistance: Number.POSITIVE_INFINITY, //被遮罩classificationType: Cesium.ClassificationType.BOTTOM}});point.objId = this.objId;$this._entities_point.push(point);return point;}//创建点createPointLabel(cartesian, textArea) {var $this = this;var point = this.viewer.entities.add({position: cartesian,label: {text: textArea,font: "18px sans-serif",fillColor: $this.Cesium.Color.GOLD,style: $this.Cesium.LabelStyle.FILL_AND_OUTLINE,outlineWidth: 2,disableDepthTestDistance: Number.POSITIVE_INFINITY, //被遮罩classificationType: Cesium.ClassificationType.BOTTOM,verticalOrigin: $this.Cesium.VerticalOrigin.BOTTOM,pixelOffset: new $this.Cesium.Cartesian2(20, -40),heightReference: $this.Cesium.HeightReference.CLAMP_TO_GROUND}});point.objId = this.objId;$this._entities_point.push(point);return point;}//销毁事件destroy() {if (this.handler) {this.handler.destroy();this.handler = null;}}//清空实体对象clear() {for (var i = 0; i < this._entities_point.length; i++) {this.viewer.entities.remove(this._entities_point[i]);}for (var i = 0; i < this._entities_polygon.length; i++) {this.viewer.entities.remove(this._entities_polygon[i]);}this._polygon = null; //活动面this._polygonLast = null; //最后一个面this._positions = []; //活动点this._entities_point = []; //脏数据this._entities_polygon = []; //脏数据this._polygonData = null; //用户构造面}getCatesian3FromPX(px) {var cartesian;cartesian = this.viewer.scene.pickPosition(px);return cartesian;}//计算多边形面积getArea(points) {var res = 0;//拆分三角曲面for (var i = 0; i < points.length - 2; i++) {var j = (i + 1) % points.length;var k = (i + 2) % points.length;var totalAngle = this.Angle(points[i], points[j], points[k]);var dis_temp1 = this.distance(points[i], points[j]);var dis_temp2 = this.distance(points[j], points[k]);res += dis_temp1 * dis_temp2 * Math.abs(Math.sin(totalAngle));}return res;}/*角度*/Angle(p1, p2, p3) {var bearing21 = this.Bearing(p2, p1);var bearing23 = this.Bearing(p2, p3);var angle = bearing21 - bearing23;if (angle < 0) {angle += 360;}return angle;}/*方向*/Bearing(from, to) {var radiansPerDegree = Math.PI / 180.0; //角度转化为弧度(rad)var degreesPerRadian = 180.0 / Math.PI; //弧度转化为角度var cartographic_from = this.Cesium.Cartographic.fromCartesian(from);var cartographic_to = this.Cesium.Cartographic.fromCartesian(to);var lon_from = this.Cesium.Math.toDegrees(cartographic_from.longitude);var lat_from = this.Cesium.Math.toDegrees(cartographic_from.latitude);var lon_to = this.Cesium.Math.toDegrees(cartographic_to.longitude);var lat_to = this.Cesium.Math.toDegrees(cartographic_to.latitude);var lat1 = lat_from * radiansPerDegree;var lon1 = lon_from * radiansPerDegree;var lat2 = lat_to * radiansPerDegree;var lon2 = lon_to * radiansPerDegree;var angle = -Math.atan2(Math.sin(lon1 - lon2) * Math.cos(lat2),Math.cos(lat1) * Math.sin(lat2) -Math.sin(lat1) * Math.cos(lat2) * Math.cos(lon1 - lon2));if (angle < 0) {angle += Math.PI * 2.0;}angle = angle * degreesPerRadian; //角度return angle;}distance(point1, point2) {var point1cartographic = this.Cesium.Cartographic.fromCartesian(point1);var point2cartographic = this.Cesium.Cartographic.fromCartesian(point2);/**根据经纬度计算出距离**/var geodesic = new this.Cesium.EllipsoidGeodesic();geodesic.setEndPoints(point1cartographic, point2cartographic);var s = geodesic.surfaceDistance;//返回两点之间的距离s = Math.sqrt(Math.pow(s, 2) +Math.pow(point2cartographic.height - point1cartographic.height, 2));return s;}
}export default measureArea;

使用方法如下：

import measureArea from "@/assets/js/measureArea.js";
let measureAreas = new measureArea({viewer: window.viewer,Cesium: Cesium});measureAreas.startCreate();

效果图

 


http://chatgpt.dhexx.cn/article/FHfjTJl4.shtml

相关文章

CAD快速测量面积与周长

CAD快速测量面积与周长

这篇来教大家如何用CAD梦想画图快速测出规则图形与不规则图形的面积&#xff0c;首先这些图形都需要是封闭图形。 操作工具 操作系统&#xff1a;Windows10 CAD软件&#xff1a;CAD梦想画图 步骤 1.首先我们画一个规则的矩形与一个用多边形绘制的不规则封闭图形&#xff0…
阅读更多...
openlayers测距和测面积

openlayers测距和测面积

初次使用openlayers地图进行开发各种地图功能，测距和测面积使用的是官方例子并进行了一些简单的修改，官方示例在测量一次之后不能停止，修改后，每点击测量，只会测量一次。 而且需要注意的是，官方例子测距测面积使用的投影坐标系是3857。 js文件：measure.js import Draw…
阅读更多...
手机测量面积的软件哪个好用？这些软件你值得收藏

手机测量面积的软件哪个好用？这些软件你值得收藏

相信大家在日常生活中总会遇到测量的问题&#xff0c;如果身边有测量工具还好&#xff0c;就怕恰好身边没有测量的工具&#xff0c;那就麻烦了。那有没有什么快捷的方法能够让我们迅速获得测量数据呢&#xff1f; 其实&#xff0c;现在市面上有很多面积测量软件&#xff0c;能…
阅读更多...
cesium 实现测距离测面积 （划线画面 跟随鼠标位置 ）

cesium 实现测距离测面积 （划线画面 跟随鼠标位置 ）

效果图 方法一&#xff1a;使用插件 cesium_measure.js 下载地址&#xff1a;https://github.com/zhangti0708/cesium-measure/blob/master/src/cesium-measure.js <!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8"&g…
阅读更多...
平方面积怎么测量？教你快速学会这个方法

平方面积怎么测量？教你快速学会这个方法

平方面积怎么测量&#xff1f;我们平常可能很少会需要测量平方面积的&#xff0c;但是当我们装修屋子的时候&#xff0c;不可避免地需要计算各种物品的面积。只有精准的计算&#xff0c;才能减少不必要的浪费。我们可以手工测量&#xff0c;然后进行计算。我们也可以借助手机上…
阅读更多...
QML QtLocation地图应用学习-3：实现面积测量

QML QtLocation地图应用学习-3：实现面积测量

1.实现思路 参照网上的测面积功能&#xff0c;界面效果和测距差不多&#xff0c;在点和线的基础上多了一个填充区域。 点和线参照上一篇博客&#xff1a;https://blog.csdn.net/gongjianbo1992/article/details/103674047 填充区域使用 MapPolygon &#xff0c;但是这个类接口…
阅读更多...
手机怎么测量物品面积？测试原理是什么？

手机怎么测量物品面积？测试原理是什么？

在我们的日常生活中&#xff0c;我们常常需要测量物品的面积&#xff0c;比如房间的面积、墙壁的面积、家具的面积等等。传统的测量方法需要使用量尺或计算公式&#xff0c;不仅繁琐而且容易出现误差。而现在&#xff0c;我们可以利用手机的功能来快速、准确地测量物品的面积。…
阅读更多...
NMF(非负矩阵分解)

NMF(非负矩阵分解)

NMF 1.算法概述2. 损失函数python代码 1.算法概述 NMF(Non-negative matrix factorization)&#xff0c;即对于任意给定的一个非负矩阵V&#xff0c;其能够寻找到一个非负矩阵W和一个非负矩阵H&#xff0c;满足条件VW*H,从而将一个非负的矩阵分解为左右两个非负矩阵的乘积。 …
阅读更多...
CAUCHY NMF FOR HYPERSPECTRAL UNMIXING

CAUCHY NMF FOR HYPERSPECTRAL UNMIXING

J. Peng, F. Jiang, W. Sun and Y. Zhou, "Cauchy NMF for Hyperspectral Unmixing," IGARSS 2020 - 2020 IEEE International Geoscience and Remote Sensing Symposium, 2020, pp. 2384-2387, doi: 10.1109/IGARSS39084.2020.9323950. 摘要&#xff1a; 非负矩阵…
阅读更多...
【降维之NMF】NMF（非负矩阵分解）实例

【降维之NMF】NMF（非负矩阵分解）实例

数据介绍&#xff1a;NMF人脸数据特征提取目标&#xff1a;已知 Olivetti 人脸数据共400个&#xff0c;每个数据是 64*64 大小。由于NMF分解得到的 W 矩阵相当于从原始矩阵中提取的特征&#xff0c;那么就可以使用NMF对400个人脸数据进行特征提取。 NMF 非负矩阵分解是在矩阵中…
阅读更多...
ADMM求解优化NMF

ADMM求解优化NMF

本文拟对文章&#xff1a;“An Alternating Direction Algorithm for Matrix Completion with Nonnegative Factors”中利用ADMM进行非负矩阵分解部分进行推导。 他的 augmented Lagrangian 可写成如下形式&#xff1a; (1) (1)优化W (2)优化H: &#xff08;3&#xff09;优化…
阅读更多...
NMF降维算法与聚类模型的综合运用

NMF降维算法与聚类模型的综合运用

NMF降维算法与聚类模型的综合运用 前言一&#xff1a;NMF算法二&#xff1a;NMF算法的使用三&#xff1a;NMF算法与层次聚类的综合使用四&#xff1a;总结 前言 这一章&#xff0c;我们讨论下另一个比较有效的降维手段&#xff1a;NMF&#xff08;非负矩阵分解&#xff09;。N…
阅读更多...
NMF（非负矩阵分解）分子分型

NMF（非负矩阵分解）分子分型

<~生~信~交~流~与~合~作~请~关~注~公~众~号生信探索> Non-Negative Matrix Factorization (NMF). Find two non-negative matrices, i.e. matrices with all non-negative elements, (W, H) whose product approximates the non-negative matrix X. This factorization c…
阅读更多...
LSA、pLSA、LDA、NMF、BERTopic、Top2Vec进行主题建模

LSA、pLSA、LDA、NMF、BERTopic、Top2Vec进行主题建模

在自然语言处理（NLP）中，主题建模是一种技术，用于从文本数据中发现隐藏的语义主题（或主题）。这是一个无监督机器学习问题，即在没有标签或标签的情况下学习模式。主题建模的应用非常广泛，可用于搜索引擎、情感分析、新闻聚类和摘要生成等许多任务。 在这里将探讨主题建模…
阅读更多...
NMF通俗理解及python实现

NMF通俗理解及python实现

一、通俗理解概念 NMF(Non-negative matrix factorization)&#xff0c;即对于任意给定的一个非负矩阵 V&#xff0c;其能够寻找到一个非负矩阵 W 和一个非负矩阵 H&#xff0c;满足条件 V W H VW \times H VWH&#xff0c;即将一个非负的矩阵分解为左右两个非负矩阵的乘积…
阅读更多...
NMF-CC

NMF-CC

题目&#xff1a;Multi-view clustering by non-negative matrix factorization with co-orthogonal constraints 一、创新点 和其他使用NMF的方法一样&#xff0c;这篇文章也是加约束&#xff0c;使创造出来的representation matrices更好。这篇文章加的约束叫做co-orthogon…
阅读更多...
用python实现NMF降维

用python实现NMF降维

非负矩阵分解(Non-negative Matrix Factorization) NMF简介 NMF用于文本降维 NMF的可解释性 NMF用于归纳单篇文章主题 NMF用于推荐多篇相似文章 NMF简介 NMF也是一种降维方法&#xff0c;相比PCA具有以下特点&#xff1a; 1&#xff0c;可解释性 2&#xff0c;可以用于所…
阅读更多...
nmf java_NMF pLSA

nmf java_NMF pLSA

今天在围脖中看到自动化所刘康的围脖中给了一个关于NMF和pLSA对比分析的链接http://ezcodesample.com/plsaidiots/NMFPLSA.html&#xff0c;大体读了一下&#xff0c;下面用中文对文中的思想重新解释&#xff0c;版权归原作者Andrew Polar。 一、名词解释 (1)NMF, nonnegative …
阅读更多...
nmf java_NMF的算法原理

nmf java_NMF的算法原理

NMF(Non-negative matrix factorization&#xff0c;非负矩阵分解)&#xff0c;即对于任意给定的一个非负矩阵V&#xff0c;其能够寻找到一个非负矩阵W和一个非负矩阵H&#xff0c;满足条件VW*H,从而将一个非负的矩阵分解为左右两个非负矩阵的乘积。其中&#xff0c;V矩阵中每一…
阅读更多...
NMF降维的本质，NMF和PCA的区别

NMF降维的本质，NMF和PCA的区别

一、NMF的本质 1.当数据完全一样时 # 将如下数据的行向量用NMF降到3维&#xff0c;初始化策略全部用nndsvd&#xff0c;不能用random&#xff0c;下同 Xnp.array([[5,5,5,5],[5,5,5,5],[5,5,5,5],[5,5,5,5]])结果是这样的&#xff1a; 2.当数据分布全部递增时 # 原数据 Xn…
阅读更多...
推荐文章

Copyright @ 2022~2023