maptalks点聚合切换坐标系后点聚合消失

原因:因为坐标系投影问题

解决方法:切换坐标系后,重新把请求到的点位数据插入到的图层删除掉,重新插入图层就可以解决了

      // 先移除已存在的同名图层 this.map.removeLayer('cluster');// 然后添加新的图层this.map.addLayer(this.clusterLayer);
    // 绘制风险点async addMarker() {try {let markerMap = []// let layer2 = this.map.getLayer("layer2"); //风险点图层const { data } = await allRiskPoint();// this.datas = data// console.log("绘制风险点", this.datas);let arr1 = [];let arr2 = [];let arr3 = [];let arr4 = [];if (data && data.length > 0) {data.forEach((item) => {let { name, id, riskPointNumber, riskLevelText, riskTypeText, locationVo, riskLevel } = item;let file = require(`@/assets/compartment/images/FX${riskLevel}.png`);let marker = new maptalks.Marker([locationVo.lngWgs, locationVo.latWgs], {visible: true,editable: false,cursor: "pointer",setZIndex: 9,properties: {id: item.id,},symbol: [{markerType: "path",markerFile: file,markerWidth: {stops: [[3, 5],[7, 10],[15, 22],[18, 32],],},markerHeight: {stops: [[3, 5],[7, 10],[15, 22],[18, 32],],},markerDx: 0,markerDy: 0,markerOpacity: 1,},],});markerMap.push(marker);// layer2.addGeometry(marker);if (riskLevel === 0) {arr1.push(marker);} else if (riskLevel === 1) {arr2.push(marker);} else if (riskLevel === 2) {arr3.push(marker);} else if (riskLevel === 3) {arr4.push(marker);}let that = this// 添加点击事件marker.on('click', function (e) {// console.log("点击的点位id", e.target.properties.id);that.form = {}const id = e.target.properties.idgetCourseDetail(id).then((res) => {// console.log("弹框数据", res.data)that.form = res.data;that.open = true;});});// marker.on("click", async () => {//   this.markerActive = marker;//   this.markerName = name;//   try {//     const { data } = await riskPointDetail({ riskPointId: id });//     console.log("风险点", data);//     this.$eventBus.$emit("markerDetail", {//       data,//       riskTypeText,//       riskLevelText,//       riskPointNumber,//       riskLevel,//     });//   } catch (error) {//     console.log(error);//   }//   //    this.$parent.showRightdialog = false//   marker.setInfoWindow({//     content: this.$refs["infowindow_content"],//     custom: true,//     autoPan: false,//   });//   marker.openInfoWindow();// });})};this.riskPointMap.set(0, arr1);this.riskPointMap.set(1, arr2);this.riskPointMap.set(2, arr3);this.riskPointMap.set(3, arr4);// 点聚合this.clusterLayer = new ClusterLayer('cluster', markerMap, {noClusterWithOneMarker: true,noClusterWithHowMany: 8, // 聚合的最小个数maxClusterZoom: 17,symbol: {markerType: 'ellipse',markerFill: { property: 'count', type: 'interval', stops: [[0, 'rgb(40, 187, 201)'], [6, 'rgb(40, 187, 201)'], [12, 'rgb(40, 187, 201)']] },markerFillOpacity: 0.7,markerLineOpacity: 1,markerLineWidth: 5,markerLineColor: 'rgb(40, 187, 201)',markerWidth: { property: 'count', type: 'interval', stops: [[0, 40], [9, 50], [99, 60]] },markerHeight: { property: 'count', type: 'interval', stops: [[0, 40], [9, 50], [99, 60]] }},textSymbol: {textFill: '#fff', // 设置数字的颜色为红色textSize: 24, // 设置字体大小为 14textFaceName: "sans-serif",// 其他选项...},drawClusterText: true,geometryEvents: true,single: true,})this.clusterLayer.setZIndex(999)// this.map.addLayer(this.clusterLayer)// // 先移除已存在的同名图层 // this.map.removeLayer('cluster');// 然后添加新的图层this.map.addLayer(this.clusterLayer);// let projection = "EPSG:4326";// this.map.config("spatialReference", { projection })this.map.refresh()} catch (error) {console.log(error);}},

 

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

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

相关文章

装饰模式:动态扩展对象的功能

在软件设计中,我们常常需要在不改变现有代码的基础上,给对象添加新的功能或责任。装饰模式(Decorator Pattern)是一种常用的设计模式,它允许我们在运行时动态地给对象添加新的行为,而无需修改原有的类结构。…

Linux/C++:Json--网络编程中的奇妙小工具

目录 一、什么是Json 二、Josn基本结构 2.1Josn对象 2.2C使用Josn 2.3.1解析Josn格式的数据 2.4Linux编程(vscode)使用Josn 一、什么是Json JSON (JavaScript Object Notation) 是一种轻量级的数据交换格式,它是基于JavaScript语言的子集,但是独立于…

PyCharm软件初始化配置

安装完pycharm后,需要对其进行个性化设置,分别设置方法如下 目录 一、修改主题二、修改默认字体和大小三、设置拖动滚轮改变字体大小四、常见快捷键 一、修改主题 1、界面右上角点击红框的内容 2、选择Theme选项 3、选择对应的主题 第一二个是白色主题…

树莓派配置vsftpd被动模式使用frp外网端口映射实现外网连接ftp

sudo apt-get install vsftpd /etc/vsftpd.conf anonymous_enableNO # 禁用匿名用户 local_enableYES # 允许本地用户登录 write_enableYES # 允许修改权限 #chroot_local_userYES # 将用户限制在其主目录 百度关键字 frp vsftp 关闭主动模式登录 connect_from_port_…

电池技术的未来:BMS的创新与应用

目录 一、什么是BMS? 二、BMS的核心功能 三、为什么BMS如此重要? 四、应用领域 五、未来展望 随着电动汽车、储能系统以及各种便携式设备的普及,电池技术的发展变得至关重要。而在这一领域中,电池管理系统(BMS&am…

直播美颜工具开发教学:视频美颜SDK集成详解

本篇文章,笔者将详细介绍如何在直播应用中集成视频美颜SDK,让你的直播画面焕然一新。 一、什么是视频美颜SDK? 视频美颜SDK是一种软件开发工具包,提供了视频处理和图像增强功能。通过集成视频美颜SDK,开发者可以轻松…

可视化作品集(14)智慧旅游和智慧景区,洞悉一切。

智慧旅游和智慧景区的可视化大屏可以带来以下几个方面的好处: 1. 提升游客体验: 通过可视化大屏,游客可以方便地获取到景区地图、交通信息、景点介绍、活动安排等信息,帮助游客更好地规划行程,提升游览体验。 2. 提供…

超越99%动画!我测试了Luma AI视频的首尾帧,流畅度NO.1?

关键帧通常用于控制动画中的运动、形状变化、颜色变化、透明度等属性,以及视频和音频编辑中的剪辑、效果和音频级别。 最近一段时间,玩可灵AI玩得比较多(国产免费速度快),luma上回写了一篇文章后就没有接着使用(排队生…

2024年上半年信息系统项目管理师——综合知识真题题目及答案(第1批次)(2)

2024年上半年信息系统项目管理师 ——综合知识真题题目及答案(第1批次)(2) 第21题:在一个大型信息系统项目中,项目经理发现尽管已经建立了沟通机制,但团队间的沟通依然不畅,项目风险…

【python模块】Selenium

声明:本文档或演示材料仅供教育和教学目的使用,任何个人或组织使用本文档中的信息进行非法活动,均与本文档的作者或发布者无关。 文章目录 Selenium库功能介绍环境准备示例代码 Selenium库 Selenium库是一个强大的Web自动化工具,…

堆、栈和队列(数据结构)

堆、栈和队列(数据结构) 这里写目录标题 堆、栈和队列(数据结构)**栈****队列**堆(Heap)()队列(Queue)(FIFO)栈(Stack&…

【Rust】字符串String类型学习

什么是String Rust的核心语言中只有一个String类型,那就是String slice,str通常被当作是&str的借用。String类型是通过标准库提供的,而不是直接编码到核心语言中,它是一个可增长的、可变的、utf-8编码的类型。str和String都是utf-8编码的…

Faiss原理和使用

参考自https://github.com/facebookresearch/faiss/wiki,https://blog.csdn.net/Kaiyuan_sjtu/article/details/121551473 Faiss Faiss是一个用于高效相似性搜索和密集向量聚类的库。它包含搜索任意大小的向量集(大小由RAM决定)的算法。它还…

【vue教程】一. 环境搭建与代码规范配置

目录 引言Vue 框架概述起源与设计理念核心特性优势 Vue 开发环境搭建环境要求安装 Vue CLI创建 Vue 项目项目结构介绍运行与构建 组件实例基础模板响应式更新 代码规范为什么要使用代码规范在 Vue 项目中使用 ESLint 、PrettierESLint配置 ESLintrules 自定义错误级别 Prettier…

推理的判定定理三种验证方式

1. 真值表技术 2. 公式转换法 3. 主析取范式法 参考:离散数学-电子科技大学

数据结构第21节 归并排序以及优化方案

归并排序(Merge Sort)是一种分治策略的排序算法。它将一个大数组分成两个子数组,递归地对它们进行排序,然后将排序后的子数组合并成一个有序数组。 Java代码实现: public class MergeSort {public static void main(…

4.Flink程序编程规范

目录 概述 概述 Flink程序编程规范 官网文档速递 1.Obtain an execution environment 获取执行环境2.Load/create the initial data 加载/创建初始数据 > 数据接入3.Specify transformations on this data 针对数据做处理操作 > 数据处理4.Specify where to put the re…

Java-使用Redisson实现的分布式锁

在使用Redisson实现的分布式锁时,可以很容易地在Java中加入多线程代码来模拟并发环境下 的锁行为。以下是一个使用Redisson的RLock接口创建分布式锁并在多线程环境中使用的示例代 码: 首先,需要在项目中添加Redisson的依赖。如果你使用Mav…

LLM-阿里 DashVector + langchain self-querying retriever 优化 RAG 实践【Query 优化】

文章目录 前言self querying 简介代码实现总结 前言 现在比较流行的 RAG 检索就是通过大模型 embedding 算法将数据嵌入向量数据库中,然后在将用户的查询向量化,从向量数据库中召回相似性数据,构造成 context template, 放到 LLM 中进行查询…

python如何判断变量是否可迭代

python如何判断变量是否可迭代?方法如下: 方法一: 适用于python2和python3 >>> from collections import Iterable >>> isinstance("str", Iterable) True 方法二: 适用于python3 s "hello …