性能提升百倍/Qt地图组件纯QWidget绘制/缓存瓦片技术/多线程加载绘制

0 阅读7分钟

一、前言说明

之前web版本的地图组件,有一些用户反馈说加载瓦片的时候,能够看到明显的加载过程,比如先是一个空白的白色正方形区域,然后才是一张瓦片图片加载后绘制在对应区域,在拖动地图的时候,更明显,总体体验不是很好,如果该图片是首次加载,还能够理解,毕竟需要经过下载再绘制,是需要时间的,而当之前已经下载的,如果还出现空白再绘制,就无法接收,是否可以直接从内存中直接取出图片文件绘制,按照这个思路,纯qwidget版本的地图组件,内部维护一个缓存图片队列,当需要绘制的时候,先从缓存队列查询是否存在这个图片,存在则直接取出来,不存在再去下载,这样体验有了很好的提升,只有首次绘制的时候会看到过渡效果。

联网下载瓦片,相比直接从本地硬盘上取出图片,速度更慢,所以后面还加上了缓存文件的功能,也就是将下载的瓦片文件缓存在本地盘符,这样可以省去再去下载的过程,节约流量,于是整个加载流程就变成了下面的。

  1. 第一步,先从内存缓存的pixmap队列中查找对应url地址对应的图片缓存,存在则取出来显示,速度最快。
  2. 第二步,内存缓存没有,则判断是否开启了缓存目录,开启了,则从缓存目录找对应url地址存储的文件,找到了则加载对应文件缓存显示,速度一般,但是比从网络地址下载要快很多。
  3. 第三步,内存缓存和文件缓存都没有,则直接从网络下载,下载后再显示,速度最慢,但是首次加载一般都需要这个步骤。
  4. 第四步,如果是离线地图,则直接取设置的离线路径的瓦片文件,不经过内存缓存。

二、效果图

在这里插入图片描述

三、相关代码

#include "imagedownload.h"

namespace qmapcontrol {
ImageDownload::ImageDownload(QObject *parent) : QObject(parent)
{
    QObject::connect(&m_network_access_manager, SIGNAL(finished(QNetworkReply *)), this, SLOT(downloadFinished(QNetworkReply *)));
}

ImageDownload::~ImageDownload()
{
    this->abortDownloads();
}

void ImageDownload::abortDownloads()
{
    //释放等待中的请求
    QMutexLocker lock(&m_mutex_downloading_image);
    foreach (QNetworkReply *reply, m_downloading_reply) {
        reply->abort();
    }

    //清空下载队列
    m_downloading_url.clear();
    m_downloading_reply.clear();
}

int ImageDownload::downloadQueueSize() const
{
    QMutexLocker lock(&m_mutex_downloading_image);
    return m_downloading_reply.size();
}

bool ImageDownload::isDownloading(const QUrl &url) const
{
    QMutexLocker lock(&m_mutex_downloading_image);
    return m_downloading_url.contains(url);
}

void ImageDownload::downloadImage(const QUrl &url)
{
    //没有处于下载中的则启动下载
    QMutexLocker lock(&m_mutex_downloading_image);
    if (!m_downloading_url.contains(url)) {
        QNetworkRequest request(url);
        QNetworkReply *reply = m_network_access_manager.get(request);
        m_downloading_url << url;
        m_downloading_reply << reply;
    }
}

void ImageDownload::downloadFinished(QNetworkReply *reply)
{
    if (reply->error() != QNetworkReply::NoError) {
        //qDebug() << TIMEMS << "Download faile" << reply->url() << reply->errorString();
    } else {
        QMutexLocker lock(&m_mutex_downloading_image);
        int index = m_downloading_reply.indexOf(reply);
        if (index >= 0) {
            QImageReader image_reader(reply);
            QPixmap pixmap = QPixmap::fromImageReader(&image_reader);
            emit imageDownloaded(reply->url(), pixmap);
            m_downloading_url.removeAt(index);
            m_downloading_reply.removeAt(index);
        }
    }

    //每次判断下是不是全部下载完成了
    if (reply->error() != QNetworkReply::OperationCanceledError) {
        if (downloadQueueSize() == 0) {
            emit downloadingFinished();
        }
    }

    //释放对象
    reply->deleteLater();
}
}

四、相关地址

  1. 国内站点:gitee.com/feiyangqing…
  2. 国际站点:github.com/feiyangqing…
  3. 个人作品:blog.csdn.net/feiyangqing…
  4. 文件地址:pan.baidu.com/s/1ZxG-oyUK… 提取码:o05q 文件名:bin_mapwidget.zip

五、功能特点

  1. 支持各种地图源,包括天地图、高德地图、腾讯地图、谷歌地图、微软地图等。
  2. 标准WGS-84地球坐标系,采用默卡托投影,可以拓展其他坐标系和投影规则。
  3. 支持在线和离线两种场景需求,可以自定义在线瓦片地址格式和离线瓦片地址格式。
  4. 多线程下载和加载瓦片图片文件,多线程绘制,自动缓存瓦片文件。
  5. 在线模式下,可以开启是否缓存文件,指定缓存路径,将下载的瓦片文件存放到本地,默认优先从缓存文件查找,如果存在缓存文件则加载缓存文件,不存在则联网下载。
  6. 可以拖动地图,鼠标滚轮放大和缩小地图,以鼠标所在位置作为缩放中心点,提供缩放控件手动单击进行操作。
  7. 多图层机制,支持多个瓦片叠加图层和图形绘制图层,全部采用双缓冲技术,所有的图形和瓦片全部绘制到一个图片文件上,最终再将图片文件绘制到地图控件。不可见区域的图层包括覆盖物不会触发绘制,降低CPU占用。
  8. 预加载机制,默认绘制的图层大小以当前区域往四周放大两倍,这样在鼠标拖动和缩放的时候,不会看到明显的加载过程,体验更佳。
  9. 内置了多种图形覆盖物,包括标注点、折线、多边形、矩形、圆形等,可以设置边框颜色粗细、填充颜色和透明度等参数。
  10. 标注点支持旋转角度和提示文本,其中提示文本可以设置在标注点的相对位置,位置包括左侧、右侧、上侧、下侧、中间、左上角、右上角、左下角、右下角。标注点本身也可以设置相对位置,默认按照底部居中对齐,一般圆形图标可以设置中心点对齐。标注点图片支持gif动图,可以动态切换静态图和动图。
  11. 所有的覆盖物可以动态更新前景色、颜色粗细、背景颜色、颜色透明度等。
  12. 支持删除单个覆盖物、删除一种类型的覆盖物、删除所有覆盖物、隐藏指定覆盖物等。
  13. 可以动态启动禁用比例尺、十字线、缩放控件、地图拖曳、键盘操作、滚轮缩放、双击放大等特性。
  14. 可以任意指定经纬度区域进行瓦片拼接保存成图片文件,也可以直接对整个可视区域或者缓存区域的地图图片文件保存。支持任意多边形轮廓保存成图片,比如某个行政区的瓦片保存。
  15. 覆盖物可以动态设置zindex层叠顺序,值越大,越显示在前面,内部维护着一个zindex表,默认按照添加的先后顺序增加,后面添加的显示在前面,主动设置后,按照设置的zindex来绘制。
  16. 支持将QWidget对象作为覆盖物添加到地图控件中,跟随地图移动位置,极大提高灵活性,比如可以将自定义控件直接作为地图控件的子对象加入进去。
  17. 大量使用按需绘制机制,包括内部提供合理的默认值来触发绘制,也可以手动传入参数指定是否需要立即绘制,比如删除了某个覆盖物,有些频繁的操作可以不指定立即绘制,等操作完成后再统一一起绘制,效率更高。
  18. 默认开启缓存瓦片机制,所有加载过的瓦片文件都存储在内存中,下次再次绘制直接从内存取出来绘制,既不需要从联网获取,也不需要从缓存文件获取,直接内存取出来绘制,响应迅速效率最高体验最佳。
  19. 支持批量添加覆盖物,比如几万个标注点和圆形,都是瞬间完成绘制,相比web网页的方式,性能提升百倍以上。
  20. 支持街道图、卫星图、混合图、路网图等各种图层,可以任意叠加N个图层,甚至杂交不同地图厂家的瓦片文件。
  21. 纯QWidget绘制,非qml也非web,不依赖qml或者浏览器控件,支持极低性能的嵌入式环境。
  22. 支持任意Qt版本、任意系统、任意编译器,包括嵌入式linux和各种国产电脑环境。