openlayers更改点坐标

我现在的需求是无人机点位根据ws传输的经纬度改变位置,在网上查了很多资料,终于是做出来了,如果有问题请指出。
效果图,无人机可以来回移动
在这里插入图片描述
这里是核心代码

// 添加飞机点位图层let vectorLayerpointfunction DronepointLayer() {vectorLayerpoint = new VectorLayer({source: new VectorSource(),name: 'Pointlayers'});imap.addLayer(vectorLayerpoint);// var layerA = imap.getLayers().getArray()[1]; // imap.getView().setZIndex(layerA, vectorLayerpoint.getZIndex() + 1);}//Dronepoint方法传入ws的数据let modelArr = []function Dronepoint(params) {if (vectorLayerpoint == undefined) {return}if(!params){vectorLayerpoint.getSource().clear();//cesiumViewer.entities.removeById('threeDrone')modelArr=[]return}// vectorLayerpoint.getSource().clear();// cesiumViewer.entities.removeById('threeDrone')params.forEach((item, index) => {var items = item;var obj = getModelById(item.id);var model;if (obj.model) { //表示已经存在于数组当中// 更新位置model = obj.model;vectorLayerpoint.getSource().forEachFeature((itempoint)=>{itempoint.setGeometry(new Point([item.tracing.origin.lng, item.tracing.origin.lat]));// itempoint.getGeometry().translate(model.tracing.origin.lng, model.tracing.origin.lat)console.log([item.tracing.origin.lng, item.tracing.origin.lat],itempoint, '更新位置');})} else {// 创建模型model = crateModel(items);modelArr.push(model);console.log(modelArr, model,'创建模型');}});}// 创建无人机
function crateModel(item) {// 创建feature,一个feature就是一个点坐标信息const featurepoint = new Feature({geometry: new Point([item.tracing.origin.lng, item.tracing.origin.lat]),});//addModel(item.tracing.origin.lng, item.tracing.origin.lat, item.height);//console.log(item.tracing.origin,vectorLayerpoint,imap.getLayers().getArray(),'具体点');let style = new Style({image: new Icon({scale: [0.3, 0.3],src: DronepointImg,anchor: [0.2, 0.5]}),text: new Text({font: 'normal 14px 黑体',// // 对其方式textAlign: 'center',// 基准线textBaseline: 'middle',offsetY: 35,offsetX: 35,backgroundFill: new Stroke({color: 'rgb(65 65 65 / 70%)',}),// 文本填充样式fill: new Fill({color: 'rgba(236,218,20,1)'}),padding: [5, 5, 5, 5],text: `${item.name + '\n'}${'lng:' + item.tracing.origin.lng},${'lat:' + item.tracing.origin.lat}`,})})featurepoint.setStyle(style);vectorLayerpoint.getSource().addFeature(featurepoint);return item;}// 获取模型function getModelById(id) {if (!id) return null;var obj = {};for (var i = 0; i < modelArr.length; i++) {var item = modelArr[i];if (id === item.id) {obj.index = i;obj.model = item;break;}}return obj;}

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

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

相关文章

Mercer 条件的基本概念及证明

Mercer 条件 是核函数理论中的一个重要概念&#xff0c;它确保了一个给定的对称函数可以表示为某个高维特征空间中的内积。这个条件在支持向量机&#xff08;SVM&#xff09;和其他基于核方法的机器学习算法中非常重要。 文章目录 基本介绍Mercer 条件的定义Mercer 定理实际应用…

Kafka(三)Producer第二篇

一&#xff0c;生产者架构 生产者客户端由两个线程协调运行&#xff0c;分别为主线程和Sender线程&#xff08;发送线程&#xff09;。 主线程&#xff1a;KafkaProducer创建消息&#xff0c;通过拦截器、序列化器和分区器之后缓存到消息收集器RecordAccumulator中&#xff1b;…

Redis 中的跳跃表(Skiplist)基本介绍

Redis 中的跳跃表&#xff08;Skiplist&#xff09;是一种用于有序元素集合的快速查找数据结构。它通过一个多级索引来提高搜索效率&#xff0c;能够在对数时间复杂度内完成查找、插入和删除操作。跳跃表特别适用于实现有序集合&#xff08;sorted set&#xff09;的功能&#…

大语言模型的直接偏好优化(DPO)对齐在PAI-QuickStart实践

直接偏好优化&#xff08;Direct Preference Optimization&#xff0c;DPO)算法是大语言模型对齐的经典算法之一&#xff0c;它巧妙地将奖励模型&#xff08;Reward Model&#xff09;训练和强化学习&#xff08;RL&#xff09;两个步骤合并成了一个&#xff0c;使得训练更加快…

MySQL 给数据表增加一列,一定会锁表吗?

在 MySQL 中&#xff0c;给数据表增加一列&#xff0c;是否会锁表取决于使用的存储引擎以及 MySQL 的版本。 InnoDB 存储引擎在 MySQL 之前的行为 之前版本的 MySQL 中&#xff0c;如果你使用 ALTER TABLE 命令来增加一列&#xff0c;对于使用 InnoDB 存储引擎的表&#xff0…

【算法】单调队列单调栈

一、单调队列 用来维护一段区间内的最大值或最小值&#xff0c;例如滑动窗口、区间最值等问题。 基本概念 单调队列是一种存储数据的队列&#xff0c;其中元素的顺序是单调递增或单调递减的。在算法竞赛中&#xff0c;我们一般使用两个单调队列&#xff0c;一个维护单调递增序…

【版面费优惠丨ACM独立出版丨接受全文摘要投稿】2024年生物医药和智能技术国际学术会议(ICBIT 2024,8月23-25)

“2024年生物医药和智能技术国际学术会议&#xff08;ICBIT 2024&#xff09;”拟定于2024年8月23-25日于珠海召开。近年来&#xff0c;智能技术已经逐渐走入生物医药领域&#xff0c;并在与生物医药领域的融合创新中凸显出巨大的发展潜力和社会价值。人工智能技术在生物医药领…

水处理基本知识

RO反渗透程序设计软件下载 水处理基本知识 纯水制备的核心工艺 核心工艺&#xff1a;纯水&#xff08;超纯水&#xff09;制备的主要处理工艺&#xff0c;结合前处理&#xff08;预处理&#xff09;工艺&#xff0c;辅助工艺及特殊工艺&#xff0c;组成完整的纯水制备工艺。结…

优质作品集秘诀:8个技巧让你的作品脱颖而出

制作一个高质量的投资组合不仅可以展示你的技能和创造力&#xff0c;还可以帮助你在求职和职业发展中脱颖而出。如何制作高质量的投资组合&#xff1f;今天给大家讲述作品集的 8 个实用技能&#xff0c;帮助你制作出令人印象深刻的作品集&#xff01; 1、精选作品 并不是所有…

飞睿智能会议室静止雷达人体检测传感器,实时监测使用状态,有人、无人智能感应节能减

在这个科技日新月异的时代&#xff0c;每一个细微的创新都可能成为推动行业创新的关键力量。今天&#xff0c;让我们聚焦于一项看似不起眼却实则潜力无限的技术——飞睿智能静止雷达人体检测传感器&#xff0c;以及它在会议室这一商务交流核心区域中的巧妙应用。想象一下&#…

前端Canvas入门——怎么用Canvas画一些简单的图案

Canvas作为前端的画图工具&#xff0c;其实用途还是蛮广泛的&#xff0c;但是很多前端学习课程其实都很少涉及到这块内容。 于是乎&#xff0c;就写下这个了。 当然啦&#xff0c;目前还在学习摸索中。 一些实战代码&#xff0c;仅供参考&#xff1a; <canvasid"ctx&…

EtherCAT总线冗余让制造更安全更可靠更智能

冗余定义 什么是总线冗余功能&#xff1f;我们都知道&#xff0c;EtherCAT现场总线具有灵活的拓扑结构&#xff0c;设备间支持线型、星型、树型的连接方式&#xff0c;其中线型结构简单、传输效率高&#xff0c;大多数的现场应用中也是使用这种连接方式&#xff0c;如下图所示…

【Qt课设】基于Qt实现的中国象棋

一、摘 要 本报告讨论了中国象棋程序设计的关键技术和方法。首先介绍了中国象棋的棋盘制作&#xff0c;利用Qt中的一些绘画类的函数来进行绘制。在创作中国象棋棋子方面&#xff0c;首先&#xff0c;我们先定义一下棋子类&#xff0c;将棋子中相同的部分进行打包&#xff0c;使…

idea推送到gitee 401错误

在idea上推送时遇到这样的问题&#xff0c;解决方法如下&#xff1a; 在https://的后面加上 用户名:密码 然后再提交就ok啦&#xff01;

三、SpringMVC

三、SpringMVC 1、SpringMVC简介 1.1、什么是MVC MVC是一种软件架构的思想&#xff0c;将软件按照模型、视图、控制器来划分 M&#xff1a;Model&#xff0c;模型层&#xff0c;指工程中的JavaBean&#xff0c;作用是处理数据 JavaBean分为两类&#xff1a; 一类称为实体…

c语言实战-极简扫雷

C语言/c写的C语言实战项目扫雷 结构比较清晰&#xff0c;仅供参考&#xff1a; 核心是扫雷的递归算法实现 上代码: #include <stdio.h> #include <stdlib.h> #include <time.h>#define SIZE 10 #define MINES 15char board[SIZE][SIZE]; // 游戏棋盘// 初…

Oracle的主要特点是什么?应用场景有哪些?

主要特点&#xff1a; 高可靠性&#xff1a;Oracle数据库具有高度的可靠性&#xff0c;能够确保数据的安全和稳定性。 高性能&#xff1a;提供高性能的数据处理和查询能力&#xff0c;可以处理大规模的数据量。 良好的扩展性&#xff1a;支持水平和垂直的扩展&#xff0c;可以轻…

CloudWatch Logs Insights 详解

CloudWatch Logs Insights 是 AWS 提供的强大日志分析工具,允许您快速、交互式地搜索和分析日志数据。本文将详细介绍使用 CloudWatch Logs Insights 所需的权限、常用查询方法,以及一些实用的查询示例。 1. 所需权限 要使用 CloudWatch Logs Insights,用户需要具备以下 I…

代码随想录-Day55

42. 接雨水 给定 n 个非负整数表示每个宽度为 1 的柱子的高度图&#xff0c;计算按此排列的柱子&#xff0c;下雨之后能接多少雨水。 输入&#xff1a;height [0,1,0,2,1,0,1,3,2,1,2,1] 输出&#xff1a;6 解释&#xff1a;上面是由数组 [0,1,0,2,1,0,1,3,2,1,2,1] 表示的高…

CentOS7二进制安装和YUM安装mongodb,服务器无法安装5.0以上的 mongodb 数据库报错 Illegal instruction

文章目录 MongoDB 安装二进制安装YUM 安装 Tips:1、MongoDB安装问题2、MongoDB登录3、MongoDB排序时内存大小限制和创建索引4、创建用户5、Java yaml使用密码连接mongodb6、MongoDB增删改查 MongoDB 安装 二进制安装 [rootmysql5-7 mongodb-6.0.4]# cat start.sh #!/bin/bash…