【Cesium实体创建】

提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档

Cesium目录

  • 前言
  • 一、Cesium
  • 二、点 线 实体
    • 1.点实体
    • 2.线实体
  • 总结

前言

提示：这里可以添加本文要记录的大概内容：

例如：随着人工智能的不断发展，机器学习这门技术也越来越重要，很多人都开启了学习机器学习，本文就介绍了机器学习的基础内容。

提示：以下是本篇文章正文内容，下面案例可供参考

一、Cesium

如何引用Cesium ，代码如下（示例）：

  mounted() {console.log(this.mapUrl);setTimeout(() => {this.into();}, 315);},into() {if (window.viewer) { window.viewer.destroy(); }Cesium.Ion.defaultAccessToken ="eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiJjNzRiNzNkYS0zZTRmLTRhOTMtODFlNS0zOWFhN2FmYzZmYjkiLCJpZCI6MTUyMTEwLCJpYXQiOjE2ODg2OTYyMDl9.sWkoSUmLFPfbMTMFgAZeQKjBQERg-TZPBBtIN34sDNQ";window.viewer = new Cesium.Viewer("cesiumContainer", {selectionIndicator: false, //关闭绿色点击框//需要进行可视化的数据源的集合animation: false, //是否显示动画控件timeline: false, //是否显示时间线控件shouldAnimate: false,homeButton: false, //是否显示Home按钮fullscreenButton: false, //是否显示全屏按钮baseLayerPicker: false, //是否显示图层选择控件geocoder: false, //是否显示地名查找控件sceneModePicker: false, //是否显示投影方式控件navigationHelpButton: false, //是否显示帮助信息控件infoBox: false, //是否显示点击要素之后显示的信息requestRenderMode: true, //启用请求渲染模式scene3DOnly: false, //每个几何实例将只能以3D渲染以节省GPU内存sceneMode: 3, //初始场景模式 1 2D模式 2 2D循环模式 3 3D模式  Cesium.SceneModefullscreenElement: document.body, //全屏时渲染的HTML元素 暂时没发现用处//加载天地图影像地图，WebMapTileServiceImageryProvider该接口是加载WMTS服务的接口imageryProvider: new Cesium.ArcGisMapServerImageryProvider({url: "https://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer",}),// 天地图地形terrainProvider: new Cesium.CesiumTerrainProvider({url: "http://data.mars3d.cn/terrain",}),});window.viewer.cesiumWidget.creditContainer.style.display = "none";    // 去除logowindow.viewer.scene.globe.depthTestAgainstTerrain = false;      //解决地形遮挡entity问题console.log(this.mapUrl);// 加载 3DpalaceTileset = new Cesium.Cesium3DTileset({//加载倾斜示范数据url: this.mapUrl,maximumMemoryUsage: 1024 * 1024 * 1024, // 设置3D Tiles的最大内存使用量maximumScreenSpaceError: 1, // 数值加大，能让最终成像变模糊,加载快;初始化的清晰度skipScreenSpaceErrorFactor: 16,dynamicScreenSpaceErrorDensity: 0.8, // 数值加大，能让周边加载变快dynamicScreenSpaceError: true, // 根据测试，有了这个后，会在真正的全屏加载完之后才清晰化房屋});palaceTileset.readyPromise.then((palaceTileset) => {viewer.scene.primitives.add(palaceTileset);var heightOffset = -10.0; //高度 高度你调这个就可以了var boundingSphere = palaceTileset.boundingSphere;var cartographic = Cesium.Cartographic.fromCartesian(boundingSphere.center);var surface = Cesium.Cartesian3.fromRadians(cartographic.longitude,cartographic.latitude,0.0);var offset = Cesium.Cartesian3.fromRadians(cartographic.longitude,cartographic.latitude,heightOffset);var translation = Cesium.Cartesian3.subtract(offset,surface,new Cesium.Cartesian3());palaceTileset.modelMatrix = Cesium.Matrix4.fromTranslation(translation);window.viewer.zoomTo(palaceTileset,new Cesium.HeadingPitchRange(0.6,-0.4,palaceTileset.boundingSphere.radius * 0.55));});},

二、点 线 实体

1.点实体

代码如下（示例）：


/**笛卡尔坐标**/pointdata.position =Cesium.Cartesian3.fromDegrees(pointdata.longitude, pointdata.latitude, pointdata.height)
/**点模型**/var pointEntity = new Cesium.Entity({position: pointdata.position,label: {font: '16px sans-serif', // 设置字体大小为16像素，使用sans-serif字体text: "航点" + parseInt(this.pointCoordinatesList.length),horizontalOrigin: Cesium.HorizontalOrigin.CENTER, // 水平对齐方式为中心verticalOrigin: Cesium.VerticalOrigin.BOTTOM, // 垂直对齐方式为底部pixelOffset: new Cesium.Cartesian2(0, -10) // 标签相对于点的偏移量},id: this.pointCoordinatesList[this.pointCoordinatesList.length - 1].id,point: {color: Cesium.Color.YELLOW,pixelSize: 10,},})window.viewer.entities.add(pointEntity)

视口朝向点 代码如下（示例）

window.viewer.zoomTo(pointEntity, new Cesium.HeadingPitchRange(0, Cesium.Math.toRadians(-90), 100));

2.线实体

代码如下（示例）：

/**线坐标**/this.arraymap.push(pointEntity.position.getValue())
/**线模型**/this.lineEntity = window.viewer.entities.add({id: "polyline",name: "航线",polyline: {positions: this.arraymap,width: 2,material: new Cesium.PolylineOutlineMaterialProperty({color: Cesium.Color.RED,outlineWidth: 3,outlineColor: Cesium.Color.RED}),},});

有时候存在延迟 手动 请求刷新

     let viewer = window.viewer;viewer.scene.requestRender();

在光伏巡检项目中 ：点击生成航线------这个代码并不是点击瓦片就生成航点–而是点击拿去这个点去查询附近点将附近最近的作为 航点
标准代码：

    // 创建航线async PointAdd() {// 设置最后点击时间戳的初始值var lastClickTimestamp = 0;this.createARouteOrNot = truethis.$emit('send', !this.createARouteOrNot);if (this.disableButton) return; // 如果按钮被禁用，则退出函数// 禁用按钮，防止重复点击this.disableButton = true;// 清除实体this.clearAllDrawn()this.lineEntity = null; // 保存航线的变量// 注册屏幕点击事件this.$handler = new Cesium.ScreenSpaceEventHandler(window.viewer.scene.canvas);await this.$handler.setInputAction(async (event) => {//定义一个屏幕(瓦片)点击的事件，pickPosition封装的是获取点击的位置的坐标(范围触发)let earthPosition = window.viewer.camera.pickEllipsoid(event.position,window.viewer.scene.globe.ellipsoid);var currentTimestamp = Date.now();if (currentTimestamp - lastClickTimestamp <= 500) {console.log(currentTimestamp, lastClickTimestamp);// this.showToast('点击太快')console.log("点击太快，取消上一次点击的操作");return}// 更新最后点击的时间戳lastClickTimestamp = currentTimestamp;var position = window.viewer.scene.pickPosition(event.position);//将笛卡尔坐标转化为经纬度坐标var cartographic = Cesium.Cartographic.fromCartesian(position);var x = Cesium.Math.toDegrees(cartographic.longitude);var y = Cesium.Math.toDegrees(cartographic.latitude);var z = cartographic.height;// 获取数据点坐标 ----- 拿去点击事件的经纬发送请求获取附近存在的光伏板经纬度const pointdata = await this.queryBoardGroupByPos(y, x)// 点清单 存在不等于null$$undefinedif (pointdata && pointdata != null && pointdata != "undefined") {//     if (!this.pointCoordinatesList.includes(this.value)) {//       this.pointCoordinatesList.push(this.value);//   console.log('值已成功添加到数组中。');// } else {//   console.log('值已经存在于数组中。');// }const found = this.pointCoordinatesList.some(item => item.id === parseInt(pointdata.id));if (found) {this.showMessage('点击太快：请勿重复标记！', 'warning');// console.log('ID存在于数组中。');} else {// console.log('ID不存在于数组中。');if (z > pointdata.height) {pointdata.position = Cesium.Cartesian3.fromDegrees(pointdata.longitude, pointdata.latitude, z)} else {pointdata.position = Cesium.Cartesian3.fromDegrees(pointdata.longitude, pointdata.latitude, pointdata.height)}this.pointCoordinatesList.push(pointdata)window.viewer.scene.globe.depthTestAgainstTerrain = false;// new 模型var pointEntity = new Cesium.Entity({position: pointdata.position,label: {font: '16px sans-serif', // 设置字体大小为16像素，使用sans-serif字体text: "航点" + parseInt(this.pointCoordinatesList.length),horizontalOrigin: Cesium.HorizontalOrigin.CENTER, // 水平对齐方式为中心verticalOrigin: Cesium.VerticalOrigin.BOTTOM, // 垂直对齐方式为底部pixelOffset: new Cesium.Cartesian2(0, -10) // 标签相对于点的偏移量},id: this.pointCoordinatesList[this.pointCoordinatesList.length - 1].id,point: {color: Cesium.Color.YELLOW,pixelSize: 10,},})// 如果 是多个点赋值给航线this.arraymap.push(pointEntity.position.getValue())//  、、、、、、}}window.viewer.entities.add(pointEntity)window.viewer.zoomTo(pointEntity, new Cesium.HeadingPitchRange(0, Cesium.Math.toRadians(-90), 100));if (this.lineEntity === null) {this.lineEntity = window.viewer.entities.add({id: "polyline",name: "航线",polyline: {positions: this.arraymap,width: 2,material: new Cesium.PolylineOutlineMaterialProperty({color: Cesium.Color.RED,outlineWidth: 3,outlineColor: Cesium.Color.RED}),},});} else {let viewer = window.viewer;var tempEntities = viewer.entities.getById("polyline")tempEntities.polyline.positions = this.arraymap// lineEntity.polyline.positions = arraymapviewer.scene.requestRender();}// 启用按钮this.disableButton = false;}, Cesium.ScreenSpaceEventType.LEFT_CLICK);},

总结

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.mzph.cn/bicheng/53422.shtml

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

C#游戏服务器开发框架设计与架构详解

C#游戏服务器开发框架设计与架构详解

我一直在思考一个问题&#xff0c;什么样的服务端框架最好用&#xff0c;最适合? 经过这些年的项目经验&#xff0c;其实最好用&#xff0c;最适合的游戏服务端框架就是自己结合公司项目需求,团队特点与技术能力,自己整合的游戏框架是最好用的。 很多新手会担心自己整合的框架…
阅读更多...
JS生成二维码QRCode代码

JS生成二维码QRCode代码

JavaScript是一种广泛使用的前端编程语言&#xff0c;它不仅用于网页交互&#xff0c;还可以实现许多实用功能&#xff0c;如生成二维码。本篇文章将深入探讨如何使用JavaScript生成二维码&#xff0c;以及如何确保这种生成的二维码在各种浏览器和手机端都能正常工作&#xff0…
阅读更多...
找不同-第15届蓝桥省赛Scratch初级组真题第4题

找不同-第15届蓝桥省赛Scratch初级组真题第4题

[导读]&#xff1a;超平老师的《Scratch蓝桥杯真题解析100讲》已经全部完成&#xff0c;后续会不定期解读蓝桥杯真题&#xff0c;这是Scratch蓝桥杯真题解析第183讲。 如果想持续关注Scratch蓝桥真题解读&#xff0c;可以点击《Scratch蓝桥杯历年真题》并订阅合集&#xff0c;…
阅读更多...
HarmonyOS 开发范式、应用模型

HarmonyOS 开发范式、应用模型

ArkUI框架两种开发范式&#xff1a; 基于ArkTS的声明式开发范式&#xff08;简称“声明式开发范式”&#xff09;兼容JS的类Web开发范式&#xff08;简称“类Web开发范式”&#xff09;。 以下是两种开发范式的简单对比: 开发范式名称 语言生态 UI更新方式 声明式开发范式…
阅读更多...
GAMES101(0~1作业)

GAMES101(0~1作业)

搭建虚拟机环境 安装Oracle VM VirtualBox虚拟机&#xff0c;安装虚拟硬盘&#xff0c;配置Linux Ubuntu-64 bit系统&#xff0c;启动虚拟机&#xff0c;发生冲突错误&#xff1a; 将Vmware虚拟设备取消挂起状态&#xff0c;关机确保 Hyper-V 完全关闭&#xff1a;bcdedit /se…
阅读更多...
VirtualBox中常见的网络设置模式

VirtualBox中常见的网络设置模式

1. NAT&#xff08;网络地址转换&#xff09; 用途&#xff1a;默认的网络设置。适合虚拟机需要访问外部网络&#xff08;如互联网&#xff09;&#xff0c;但不需要外界直接访问虚拟机的场景。特点&#xff1a; 虚拟机通过主机系统的 IP 地址访问外网。主机和外网可以访问虚拟…
阅读更多...
【Python · Pytorch】配置cuda环境 cuDNN库

【Python · Pytorch】配置cuda环境 cuDNN库

【Python Pytorch】配置cuda环境 & cuDNN库 1. 查找对应版本1.1 查看Pytorch GPU目前支持版本1.1 查看Nvidia驱动版本1.2 查看支持cuda版本1.3 查看支持cuDNN版本1.3.1 cuDNN 9.0.0及以上版本1.3.2 cuDNN 9.0.0以下版本 1.4 安装版本确定 2. 安装cuda环境2.1 cuda简介2.1.…
阅读更多...
Leetcode Hot 100刷题记录 -Day10（合并区间）

Leetcode Hot 100刷题记录 -Day10（合并区间）

合并区间 问题描述&#xff1a; 以数组 intervals 表示若干个区间的集合&#xff0c;其中单个区间为 intervals[i] [starti,endi] 。请你合并所有重叠的区间&#xff0c;并返回 一个不重叠的区间数组&#xff0c;该数组需恰好覆盖输入中的所有区间 。 示例 1&#xff1a; 输入&…
阅读更多...
【计算机网络】浏览器输入访问某网址时，后台流程是什么

【计算机网络】浏览器输入访问某网址时，后台流程是什么

在访问网址时&#xff0c;后台的具体流程可以因不同的网站、服务器和应用架构而异。 实际过程中可能还涉及更多的细节和步骤&#xff0c;如缓存处理、重定向、负载均衡等。 此外&#xff0c;不同的网站和应用架构可能会有不同的实现方式和优化策略。 部分特定网站或应用&#x…
阅读更多...
【C++】stack、queue、priority_queue的模拟实现

【C++】stack、queue、priority_queue的模拟实现

目录 一、stack &#x1f31f;stack的简单介绍 &#x1f31f;stack的基本使用 &#x1f31f;stack的模拟实现 &#x1f31f;stack模拟实现的完整代码 &#x1f31f;容器适配器 二、queue &#x1f31f;queue的简单介绍 &#x1f31f;queue的基本使用 &#x1f31f;q…
阅读更多...
828华为云征文｜Flexus云服务器X实例快速部署在线测评平台,适用各种信息学教学

828华为云征文｜Flexus云服务器X实例快速部署在线测评平台,适用各种信息学教学

文章目录 如何选配Flexus云服务器X实例服务器HydroOJHOJ 服务器资源的选取基础配置实例规格镜像、存储、网络弹性公网IP云服务器名称 部署HydroOJ1.设置安全组、开放端口2.部署HydroOJ回到控制中心&#xff0c;远程登录 部署HOJ安装docker# 安装docker-compose部署HOJ 本篇幅为…
阅读更多...
深度学习中的可微编程：从微分方程到物理模拟

深度学习中的可微编程：从微分方程到物理模拟

引言 可微编程&#xff08;Differentiable Programming&#xff09;是深度学习领域的一个新兴概念&#xff0c;旨在将传统编程中的数学模型&#xff08;如微分方程&#xff09;与深度学习模型结合&#xff0c;构建出更加灵活、可解释的模型。这一技术为物理模拟、科学计算等领…
阅读更多...
leetcode:3174 清除数字

leetcode:3174 清除数字

3174 清除数字 题目链接https://leetcode.cn/problems/clear-digits/ 题目描述 给你一个字符串 s 。 你的任务是重复以下操作删除 所有 数字字符&#xff1a; 删除 第一个数字字符 以及它左边 最近 的 非数字 字符。 请你返回删除所有数字字符以后剩下的字符串。 示例 1…
阅读更多...
Git 使用指南 --- 版本管理

Git 使用指南 --- 版本管理

序言 Git 是一个开源的 分布式版本控制系统&#xff0c;可以有效、高速地处理从很小到非常大的项目版本管理。对一个程序员来说&#xff0c;掌握 Git 的使用是必要的。  在这个系列中&#xff0c;将详细的介绍 Git 的使用和原理&#xff0c;话不多说&#xff0c;让我们开始吧。…
阅读更多...
【C++ 面试 - STL】每日 3 题（四）

【C++ 面试 - STL】每日 3 题（四）

✍个人博客&#xff1a;Pandaconda-CSDN博客 &#x1f4e3;专栏地址&#xff1a;http://t.csdnimg.cn/fYaBd &#x1f4da;专栏简介&#xff1a;在这个专栏中&#xff0c;我将会分享 C 面试中常见的面试题给大家~ ❤️如果有收获的话&#xff0c;欢迎点赞&#x1f44d;收藏&…
阅读更多...
qiankun微前端

qiankun微前端

qiankun微前端踩坑指南&#xff1a; 上图原因子项目未启动 上图使用$tqiankun微前端中未引用i18n插件解决方案如下&#xff1a; 子项目main.js中加上i18n: 一些坑忘记截图复现会继续更新....... 配置正文开始------> 主项目 子项目 1.名字需要与子项目跳转后缀一致 2.v…
阅读更多...
景联文科技：提供高质量多模态数据标注，推动智能化转型

景联文科技：提供高质量多模态数据标注，推动智能化转型

随着人工智能技术的快速发展&#xff0c;多模态数据标注成为推动智能系统更深层次理解和应用的关键技术之一。 作为行业领先的多模态数据标注服务商&#xff0c;景联文科技凭借其在技术、流程和人才方面的综合优势&#xff0c;推出了全面的多模态标注解决方案&#xff0c;助力…
阅读更多...
Spark MLlib模型训练—回归算法 Random forest regression

Spark MLlib模型训练—回归算法 Random forest regression

Spark MLlib模型训练—回归算法 Random forest regression 随机森林回归 (Random Forest Regression) 是一种集成学习方法，通过结合多个决策树的预测结果来提升模型的准确性和稳健性。相较于单一的决策树模型，随机森林通过随机采样和多棵树的集成，减少了模型的方差，从而在…
阅读更多...
Python | Leetcode Python题解之第392题判断子序列

Python | Leetcode Python题解之第392题判断子序列

题目&#xff1a; 题解&#xff1a; class Solution:def isSubsequence(self, s: str, t: str) -> bool:n, m len(s), len(t)f [[0] * 26 for _ in range(m)]f.append([m] * 26)for i in range(m - 1, -1, -1):for j in range(26):f[i][j] i if ord(t[i]) j ord(a) el…
阅读更多...
【5G PHY】5G循环前缀（CP）设计思路简述

【5G PHY】5G循环前缀（CP）设计思路简述

博主未授权任何人或组织机构转载博主任何原创文章&#xff0c;感谢各位对原创的支持&#xff01; 博主链接 本人就职于国际知名终端厂商&#xff0c;负责modem芯片研发。 在5G早期负责终端数据业务层、核心网相关的开发工作&#xff0c;目前牵头6G技术研究。 博客内容主要围绕…
阅读更多...
最新文章

Copyright @ 2022~2023