当前位置: 首页 > news >正文

QGraphicsView实现简易地图4『局部加载-地图漫游』

前文链接:QGraphicsView实现简易地图3『局部加载-地图缩放』
当鼠标拖动地图移动时,需要实时增补和删减瓦片地图,大致思路是计算地图从各方向移动时进出视口的瓦片坐标值,根据变化后的瓦片坐标值来增减地图瓦片,以下将提供实现此需求的核心代码。
1、动态演示效果


2、静态展示图片
在这里插入图片描述

核心代码

void MapView::moveScene()
{QString appPath = QApplication::applicationDirPath();QString dirPath = QString("%1/MapData/GaoDeMap/Map/MapPng/L0%2").arg(appPath).arg(m_curLevel + 1);// 视口宽度和高度int w = viewport()->width();int h = viewport()->height();// 计算呈现的瓦片地图左上角的场景坐标和视口坐标、呈现的瓦片地图右下角的场景坐标和视口坐标QPoint topLeftScenePos(m_topLeftTileCoord.x * PIXMAP_SIZE, m_topLeftTileCoord.y * PIXMAP_SIZE);QPointF topLeftViewPos = mapFromScene(topLeftScenePos);QPoint bottomRightScenePos(m_bottomRightTileCoord.x * PIXMAP_SIZE, m_bottomRightTileCoord.y * PIXMAP_SIZE);QPointF bottomRightViewPos = mapFromScene(bottomRightScenePos);// 1、水平瓦片坐标控制:判断最左侧瓦片是否完全进入视口、最右侧瓦片是否完全离开视口if (topLeftViewPos.x() > 0){int count = qCeil(topLeftViewPos.x() / PIXMAP_SIZE);	// 左侧进入视口瓦片数量int oldLeftTileCoordX = m_topLeftTileCoord.x;			// 保存原左侧瓦片坐标Xm_topLeftTileCoord.x -= count;							// 更新现左侧瓦片坐标X// 增加从左侧进入视口的图片for (int row = m_topLeftTileCoord.y; row <= m_bottomRightTileCoord.y; ++row){for (int col = m_topLeftTileCoord.x; col < oldLeftTileCoordX; ++col){QString fileName = QString("%1/Map_%2-%3.png").arg(dirPath).arg(QString::number(row + 1).rightJustified(2, '0')).arg(QString::number(col + 1).rightJustified(2, '0'));QPixmap pixmap(fileName);QGraphicsPixmapItem *item = new QGraphicsPixmapItem(pixmap);item->setPos(PIXMAP_SIZE * col, PIXMAP_SIZE * row);m_scene->addItem(item);m_mapItems[row][col] = item;}}}if (bottomRightViewPos.x() > w){int count = qFloor((bottomRightViewPos.x() - w) / PIXMAP_SIZE) + 1;	// 右侧离开视口瓦片数量int oldRightTileCoordX = m_bottomRightTileCoord.x;					// 保存原右侧瓦片坐标Xm_bottomRightTileCoord.x -= count;									// 更新现右侧瓦片坐标X// 删除从右侧离开视口的图片for (int row = m_topLeftTileCoord.y; row <= m_bottomRightTileCoord.y; ++row){for (int col = oldRightTileCoordX; col > m_bottomRightTileCoord.x; --col){QGraphicsPixmapItem *item = m_mapItems[row][col];m_scene->removeItem(item);m_mapItems[row].remove(col);delete item;}}}// 2、水平瓦片坐标控制:判断最右侧瓦片是否完全进入视口、最左侧瓦片是否完全离开视口if (bottomRightViewPos.x() + 255 < w){int count = qCeil((w - (bottomRightViewPos.x() + 255)) / PIXMAP_SIZE);	// 右侧进入视口瓦片数量int oldRightTileCoordX = m_bottomRightTileCoord.x;						// 保存原右侧瓦片坐标Xm_bottomRightTileCoord.x += count;										// 保存现右侧瓦片坐标X// 增加从右侧进入视口的图片for (int row = m_topLeftTileCoord.y; row <= m_bottomRightTileCoord.y; ++row){for (int col = m_bottomRightTileCoord.x; col > oldRightTileCoordX; --col){QString fileName = QString("%1/Map_%2-%3.png").arg(dirPath).arg(QString::number(row + 1).rightJustified(2, '0')).arg(QString::number(col + 1).rightJustified(2, '0'));QPixmap pixmap(fileName);QGraphicsPixmapItem *item = new QGraphicsPixmapItem(pixmap);item->setPos(PIXMAP_SIZE * col, PIXMAP_SIZE * row);m_scene->addItem(item);m_mapItems[row][col] = item;}}}if (topLeftViewPos.x() + 255 < 0){int count = qFloor(fabs(topLeftViewPos.x()) / PIXMAP_SIZE);	// 左侧离开视口瓦片数量int oldLeftTileCoordX = m_topLeftTileCoord.x;				// 保存原左侧瓦片坐标Xm_topLeftTileCoord.x += count;								// 保存现左侧瓦片坐标X// 删除从左侧离开视口的图片for (int row = m_topLeftTileCoord.y; row <= m_bottomRightTileCoord.y; ++row){for (int col = oldLeftTileCoordX; col < m_topLeftTileCoord.x; ++col){QGraphicsPixmapItem *item = m_mapItems[row][col];m_scene->removeItem(item);m_mapItems[row].remove(col);delete item;}}}// 3、垂直瓦片坐标控制:判断最上侧瓦片是否完全进入视口,最下侧瓦片是否完全离开视口if (topLeftViewPos.y() > 0){int count = qCeil(topLeftViewPos.y() / PIXMAP_SIZE);	// 上侧进入视口瓦片数量int oldTopTileCoordY = m_topLeftTileCoord.y;			// 保存原上侧瓦片坐标Ym_topLeftTileCoord.y -= count;							// 保存现上侧瓦片坐标Y// 增加从上侧进入视口的图片for (int row = m_topLeftTileCoord.y; row < oldTopTileCoordY; ++row){for (int col = m_topLeftTileCoord.x; col <= m_bottomRightTileCoord.x; ++col){QString fileName = QString("%1/Map_%2-%3.png").arg(dirPath).arg(QString::number(row + 1).rightJustified(2, '0')).arg(QString::number(col + 1).rightJustified(2, '0'));QPixmap pixmap(fileName);QGraphicsPixmapItem *item = new QGraphicsPixmapItem(pixmap);item->setPos(PIXMAP_SIZE * col, PIXMAP_SIZE * row);m_scene->addItem(item);m_mapItems[row][col] = item;}}}if (bottomRightViewPos.y() > h){int count = qFloor((bottomRightViewPos.y() - h) / PIXMAP_SIZE) + 1;	// 下侧离开视口瓦片数量int oldBottomTileCoordY = m_bottomRightTileCoord.y;					// 保存原下侧瓦片坐标Ym_bottomRightTileCoord.y -= count;									// 保存现下侧瓦片坐标Y// 删除从下侧离开视口的图片for (int row = oldBottomTileCoordY; row > m_bottomRightTileCoord.y; --row){for (int col = m_topLeftTileCoord.x; col <= m_bottomRightTileCoord.x; ++col){QGraphicsPixmapItem *item = m_mapItems[row][col];m_scene->removeItem(item);m_mapItems[row].remove(col);delete item;}}}// 4、垂直瓦片坐标控制:判断最下侧瓦片是否完全进入视口,最上侧瓦片是否完全离开视口if (bottomRightViewPos.y() + 255 < h){int count = qCeil((h - (bottomRightViewPos.y() + 255)) / PIXMAP_SIZE);	// 下侧进入视口瓦片数量int oldBottomTileCoordY = m_bottomRightTileCoord.y;						// 保存原下侧瓦片坐标Ym_bottomRightTileCoord.y += count;										// 保存现下侧瓦片坐标Y// 增加从下侧进入视口的图片for (int row = m_bottomRightTileCoord.y; row > oldBottomTileCoordY; --row){for (int col = m_topLeftTileCoord.x; col <= m_bottomRightTileCoord.x; ++col){QString fileName = QString("%1/Map_%2-%3.png").arg(dirPath).arg(QString::number(row + 1).rightJustified(2, '0')).arg(QString::number(col + 1).rightJustified(2, '0'));QPixmap pixmap(fileName);QGraphicsPixmapItem *item = new QGraphicsPixmapItem(pixmap);item->setPos(PIXMAP_SIZE * col, PIXMAP_SIZE * row);m_scene->addItem(item);m_mapItems[row][col] = item;}}}if (topLeftViewPos.y() + 255 < 0){int count = qFloor(fabs(topLeftViewPos.y()) / PIXMAP_SIZE);	// 上侧离开视口瓦片数量int oldTopTileCoordY = m_topLeftTileCoord.y;				// 保存原上侧瓦片坐标Ym_topLeftTileCoord.y += count;								// 保存现上侧瓦片坐标Y// 删除从上侧离开视口的图片for (int row = oldTopTileCoordY; row < m_topLeftTileCoord.y; ++row){for (int col = m_topLeftTileCoord.x; col <= m_bottomRightTileCoord.x; ++col){QGraphicsPixmapItem *item = m_mapItems[row][col];m_scene->removeItem(item);m_mapItems[row].remove(col);delete item;}}}
}

相关文章:

QGraphicsView实现简易地图4『局部加载-地图漫游』

前文链接&#xff1a;QGraphicsView实现简易地图3『局部加载-地图缩放』 当鼠标拖动地图移动时&#xff0c;需要实时增补和删减瓦片地图&#xff0c;大致思路是计算地图从各方向移动时进出视口的瓦片坐标值&#xff0c;根据变化后的瓦片坐标值来增减地图瓦片&#xff0c;以下将…...

ubuntu 安装 nvidia 驱动

ubuntu 安装 nvidia 驱动 初环境与设备查询型号查询对应的驱动版本安装驱动验证驱动安装结果 本篇文章将介绍ubuntu 安装 nvidia 驱动 初 希望能写一些简单的教程和案例分享给需要的人 环境与设备 系统&#xff1a;ubuntu 设备&#xff1a;Nvidia GeForce RTX 4090 查询型…...

探索APP界面布局的艺术与技巧:从入门到精通

引言 在当今数字化时代&#xff0c;移动应用程序&#xff08;APP&#xff09;成为人们生活中不可或缺的一部分。而一个成功的APP界面布局是吸引用户、提升用户体验的关键因素之一。本文将带您深入探索APP界面布局的艺术与技巧&#xff0c;从入门到精通&#xff0c;让您能够轻松…...

回归预测 | MATLAB实现POA-CNN-GRU鹈鹕算法优化卷积门控循环单元多输入单输出回归预测

回归预测 | MATLAB实现POA-CNN-GRU鹈鹕算法优化卷积门控循环单元多输入单输出回归预测 目录 回归预测 | MATLAB实现POA-CNN-GRU鹈鹕算法优化卷积门控循环单元多输入单输出回归预测预测效果基本介绍程序设计参考资料 预测效果 基本介绍 MATLAB实现POA-CNN-GRU鹈鹕算法优化卷积门…...

15.3.2 【Linux】系统的配置文件:/etc/crontab,/etc/cron.d/*

这个“ crontab -e ”是针对使用者的 cron 来设计的&#xff0c;如果是“系统的例行性任务”时&#xff0c; 该怎么办呢&#xff1f;是否还是需要以 crontab -e 来管理你的例行性工作调度呢&#xff1f;当然不需要&#xff0c;你只要编辑/etc/crontab 这个文件就可以。有一点需…...

新版PMP考试中,敏捷是怎么考的?

01新版考试中的敏捷是怎么考的&#xff1f; 接下来说一下大家最为关注的敏捷内容。这次改版后&#xff0c;题目中添加了大量的敏捷题型&#xff0c;总体比重还是很高的&#xff0c;主观感觉达到了1/3。但和ACP认证相比&#xff0c;PMP中对敏捷管理技术的考察相对来说比较简单&…...

uniapp-----封装接口

系列文章目录 uniapp-----封装接口 uniapp-----分包 文章目录 系列文章目录 uniapp-----封装接口 uniapp-----分包 文章目录 前言 一、技术 二、封装步骤 1.准备 ​编辑 2.代码填充 request.js&#xff1a; api.js&#xff1a; min.js 页面使用 总结 前言 uniapp的主包要求大…...

[oeasy]python0081_[趣味拓展]ESC键进化历史_键盘演化过程_ANSI_控制序列_转义序列_CSI

光标位置 回忆上次内容 上次了解了 新的转义模式 \033 逃逸控制字符 escape 这个字符 让字符串 退出标准输出流进行控制信息的设置 可以设置 光标输出的位置 ASR33中的ALT MODE 是 今天的ESC键吗&#xff1f;&#xff1f;&#xff1f;&#xff1f;&#x1f914; 查询文档…...

第十六次CCF计算机软件能力认证

第一题&#xff1a;小中大 在数据分析中&#xff0c;最小值最大值以及中位数是常用的统计信息。 老师给了你 n 个整数组成的测量数据&#xff0c;保证有序&#xff08;可能为升序或降序)&#xff0c;可能存在重复的数据。 请统计出这组测量数据中的最大值、中位数以及最小值&am…...

关于Postman如何配置随请求携带token

文章目录 一些吐槽实际应用 一些吐槽 首先吐槽一下 postman官网的文档说明&#xff0c;真是乱七八糟&#xff0c;一点都不清晰&#xff0c;能不能好好写用户手册啊&#xff08;比如把用户都当作初始小白&#xff09; 然后吐槽一下网上铺天盖地让我写js脚本应用全局access toke…...

逆向破解学习-登山赛车

试玩 课程中的内容 Hook代码 import de.robv.android.xposed.XC_MethodHook; import de.robv.android.xposed.XposedHelpers; import de.robv.android.xposed.callbacks.XC_LoadPackage;public class HookComYoDo1SkiSafari2TXYYB_01 extends HookImpl{Overridepublic String p…...

linux下实现生产者和消费者 pv操作

线程同步与线程安全 生产者和消费者特点图示理解编程实现测试结果 生产者和消费者 特点 1.解耦:因为多了一个缓冲区&#xff0c;所以生产者和消费者并不直接相互调用&#xff0c;这样生产者和消费者的代码发生变化&#xff0c;都不会对对方产生影响。这样其实就是把生产者和消…...

十六、遥感影像识别

1、获取遥感影像数据 或用卫星遥感数据,或用无人机低空采集,原始数据加工,最后提供CSV、Excel、GeoTIFF、ENVI等数据文件。 ENVI格式的原始数据文件可以存储多维数据,包括三维数组、二维数组、一维数组甚至标量等。这是因为ENVI格式支持不仅仅是多光谱或高光谱数据…...

源码角度分析@configuration和@component不同

1.configuration是component的内部类&#xff0c;configuration包含component注解。 2.configuration中所有带Bean都会被CGLIB动态代理&#xff0c;调用此配置类中的方法都会返回同一个实例。component不会被代理&#xff0c;调用配置类中的方法都会新建一个实例。 3.configura…...

实现分布式事务:Java与MySQL的XA事务协调

目录 一、什么是XA事务 二、Java中的XA事务支持 三、MySQL的XA事务协调 四、注意事项和最佳实践 五、基于 java 语言的开发工具 六、小结 分布式事务是在跨多个数据库或服务之间保持一致性的重要机制。Java与MySQL的XA&#xff08;eXtended Architecture&#xff09;事务…...

如何通过CRM系统进行成功的客户生命周期管理?

吸引新客户&#xff0c;提供无与伦比的服务或商品&#xff0c;以及建立成功的客户关系&#xff0c;是每个企业努力追求的目标。然而&#xff0c;实现这些目标需要的不仅仅是良好的愿景&#xff0c;还需要实施客户生命周期管理流程。 什么是客户生命周期管理&#xff1f; 客户…...

Leetcode 977. 有序数组的平方

题目&#xff1a; Leetcode 977. 有序数组的平方 描述&#xff1a; 给你一个按 非递减顺序 排序的整数数组 nums&#xff0c;返回 每个数字的平方 组成的新数组&#xff0c;要求也按 非递减顺序 排序 思路&#xff1a; 双指针法 数组其实是有序的&#xff0c; 只不过负数平方之…...

vue3中使用toValue

toValue() 是一个在 3.3 版本中新增的 API。它的设计目的是将 ref 或 getter 规范化为值。如果参数是 ref&#xff0c;它会返回 ref 的值&#xff1b;如果参数是函数&#xff0c;它会调用函数并返回其返回值 示例...

阿里云国际版CDN使用教程!

当网站流量达到一定值后&#xff0c;势必会造成网站访问卡堵&#xff0c;这时候阿里云CDN将会一个很好的选择&#xff0c;阿里云 CDN 是由全球分布式边缘节点组成的虚拟网络。阿里云 CDN 可减少源站负载&#xff0c;防止网络拥塞&#xff0c;使用阿里云 CDN 加速图像、小文件、…...

【docker】Dockerfile构建镜像常用指令:

文章目录 一、常用命令:二、注意事项:三、add和copy的区别:【1】ADD 指令支持自动解压缩功能【2】ADD 指令可以从 URL 复制内容【3】 ADD 指令具有隐式的文件拷贝功能 一、常用命令: Dockerfile是一个文本文件&#xff0c;包含了一条条的指令&#xff0c;在基于指定的镜像上&am…...

<6>-MySQL表的增删查改

目录 一&#xff0c;create&#xff08;创建表&#xff09; 二&#xff0c;retrieve&#xff08;查询表&#xff09; 1&#xff0c;select列 2&#xff0c;where条件 三&#xff0c;update&#xff08;更新表&#xff09; 四&#xff0c;delete&#xff08;删除表&#xf…...

3.3.1_1 检错编码(奇偶校验码)

从这节课开始&#xff0c;我们会探讨数据链路层的差错控制功能&#xff0c;差错控制功能的主要目标是要发现并且解决一个帧内部的位错误&#xff0c;我们需要使用特殊的编码技术去发现帧内部的位错误&#xff0c;当我们发现位错误之后&#xff0c;通常来说有两种解决方案。第一…...

1688商品列表API与其他数据源的对接思路

将1688商品列表API与其他数据源对接时&#xff0c;需结合业务场景设计数据流转链路&#xff0c;重点关注数据格式兼容性、接口调用频率控制及数据一致性维护。以下是具体对接思路及关键技术点&#xff1a; 一、核心对接场景与目标 商品数据同步 场景&#xff1a;将1688商品信息…...

React19源码系列之 事件插件系统

事件类别 事件类型 定义 文档 Event Event 接口表示在 EventTarget 上出现的事件。 Event - Web API | MDN UIEvent UIEvent 接口表示简单的用户界面事件。 UIEvent - Web API | MDN KeyboardEvent KeyboardEvent 对象描述了用户与键盘的交互。 KeyboardEvent - Web…...

优选算法第十二讲:队列 + 宽搜 优先级队列

优选算法第十二讲&#xff1a;队列 宽搜 && 优先级队列 1.N叉树的层序遍历2.二叉树的锯齿型层序遍历3.二叉树最大宽度4.在每个树行中找最大值5.优先级队列 -- 最后一块石头的重量6.数据流中的第K大元素7.前K个高频单词8.数据流的中位数 1.N叉树的层序遍历 2.二叉树的锯…...

在web-view 加载的本地及远程HTML中调用uniapp的API及网页和vue页面是如何通讯的?

uni-app 中 Web-view 与 Vue 页面的通讯机制详解 一、Web-view 简介 Web-view 是 uni-app 提供的一个重要组件&#xff0c;用于在原生应用中加载 HTML 页面&#xff1a; 支持加载本地 HTML 文件支持加载远程 HTML 页面实现 Web 与原生的双向通讯可用于嵌入第三方网页或 H5 应…...

CVE-2020-17519源码分析与漏洞复现(Flink 任意文件读取)

漏洞概览 漏洞名称&#xff1a;Apache Flink REST API 任意文件读取漏洞CVE编号&#xff1a;CVE-2020-17519CVSS评分&#xff1a;7.5影响版本&#xff1a;Apache Flink 1.11.0、1.11.1、1.11.2修复版本&#xff1a;≥ 1.11.3 或 ≥ 1.12.0漏洞类型&#xff1a;路径遍历&#x…...

Chrome 浏览器前端与客户端双向通信实战

Chrome 前端&#xff08;即页面 JS / Web UI&#xff09;与客户端&#xff08;C 后端&#xff09;的交互机制&#xff0c;是 Chromium 架构中非常核心的一环。下面我将按常见场景&#xff0c;从通道、流程、技术栈几个角度做一套完整的分析&#xff0c;特别适合你这种在分析和改…...

nnUNet V2修改网络——暴力替换网络为UNet++

更换前,要用nnUNet V2跑通所用数据集,证明nnUNet V2、数据集、运行环境等没有问题 阅读nnU-Net V2 的 U-Net结构,初步了解要修改的网络,知己知彼,修改起来才能游刃有余。 U-Net存在两个局限,一是网络的最佳深度因应用场景而异,这取决于任务的难度和可用于训练的标注数…...

图解JavaScript原型:原型链及其分析 | JavaScript图解

​​ 忽略该图的细节&#xff08;如内存地址值没有用二进制&#xff09; 以下是对该图进一步的理解和总结 1. JS 对象概念的辨析 对象是什么&#xff1a;保存在堆中一块区域&#xff0c;同时在栈中有一块区域保存其在堆中的地址&#xff08;也就是我们通常说的该变量指向谁&…...