一、前言

在地图应用的相关项目中,在地图上标识一些设备点,并对点进行交互这个功能用的最多的,于是需要一套机制可以动态的添加、删除、清空、重置,重置的意思是将地图中的所有点的经纬度重新设置,其实就是先清空然后挨个重新添加所有点的信息,JS的异步交互功能非常强大,直接执行对应的JS函数就可以,没有必要刷新网页,最开始很多年前做的时候还不会JS,那时候想的最糟糕的办法就是写死在代码中,这样每次变动需要重新加载网页,后面发现那真是糟糕的办法,既然有异步刷新的办法为何不用呢,自从学会了JS异步刷新方法以后,索性将各种方法都改成了JS函数,传入对应的参数即可,参数尽可能的考虑到已知的各种各样的情况,方便用户自己添加。

在学习JS语法的时候发现其实程序都大同小异,正所谓一通百通,熟悉各大概的语法以后基本都可以上手,和C++最大的不同就是他没有数据类型的概念,作为解释性的语言,是在执行的时候自动去转换数据类型,工作都交给解释器做掉了,这样就大大方便了程序员,到处var即可,哪怕是数组啊对象啊,万物皆wav,只有当真正赋值的时候,才知道具体的数据类型。

二、功能特点

  1. 同时支持在线地图和离线地图两种模式。
  2. 同时支持webkit内核、webengine内核、IE内核。
  3. 支持设置多个标注点,信息包括名称、地址、经纬度。
  4. 可设置地图是否可单击、拖动、鼠标滚轮缩放。
  5. 可设置协议版本、秘钥、主题样式、中心坐标、中心城市、地理编码位置等。
  6. 可设置地图缩放比例和级别,缩略图、比例尺、路况信息等控件的可见。
  7. 支持地图交互,比如鼠标按下获取对应位置的经纬度。
  8. 支持查询路线,可设置起点位置、终点位置、路线模式、路线方式、路线方案(最少时间、最少换乘、最少步行、不乘地铁、最短距离、避开高速)。
  9. 可显示点线面工具,可直接在地图上划线、点、矩形、圆形等。
  10. 可设置行政区划,指定某个城市区域绘制图层,在线地图自动输出行政区划边界点集合到js文件给离线地图使用。
  11. 可静态或者动态添加多个覆盖物。支持点、折线、多边形、矩形、圆形、弧线、点聚合等。
  12. 函数接口友好和统一,使用简单方便,就一个类。
  13. 支持js动态交互添加点、删除点、清空点、重置点,不需要刷新页面。
  14. 支持任意Qt版本、任意系统、任意编译器。

三、体验地址

  1. 体验地址:https://pan.baidu.com/s/1ZxG-oyUKe286LPMPxOrO2A 提取码:o05q 名称:bin_map.zip
  2. 国内站点:https://gitee.com/feiyangqingyun
  3. 国际站点:https://github.com/feiyangqingyun
  4. 个人主页:https://blog.csdn.net/feiyangqingyun
  5. 知乎主页:https://www.zhihu.com/people/feiyangqingyun/

四、效果图

五、相关代码

void MapBaiDu::addMarker(QStringList &list)
{
//动态添加点
//name 表示文本文字
//addr 表示地址
//point 表示经纬度坐标
//action 表示单击以后触发什么动作 0-不处理 1-自己弹框 2-发送信号
//animation 表示是否设置动画效果 0-不处理 1-跳动 2-坠落
//iconfile 表示图标文件路径,不设置则采用默认图标,注意图片的尺寸
//iconindex 表示图标对应在图片中的索引
list << QString(" function addMarker(name, addr, point, action, animation, iconfile, iconindex) {");
list << QString(" var list = point.split(',');");
//设置点经纬度坐标
list << QString(" var pot = new BMap.Point(list[0], list[1]);");
//设置文本文字 offset为对应标签显示的位置偏移值
list << QString(" var label = new BMap.Label(name, {\"offset\":new BMap.Size(20, -10)});"); //设置图标,不设置则采用默认图标
list << QString(" if (!iconfile) {");
list << QString(" var marker = new BMap.Marker(pot);");
list << QString(" } else if (iconfile == 'http://lbsyun.baidu.com/jsdemo/img/fox.gif') {");
list << QString(" var icon = new BMap.Icon(iconfile, new BMap.Size(300, 157));");
list << QString(" var marker = new BMap.Marker(pot, {icon: icon});");
list << QString(" } else if (iconfile == 'http://api.map.baidu.com/img/markers.png') {");
list << QString(" var icon = new BMap.Icon(iconfile, new BMap.Size(23, 25), {offset: new BMap.Size(10, 25), imageOffset: new BMap.Size(0, 0 - iconindex * 25)});");
list << QString(" var marker = new BMap.Marker(pot, {icon: icon});");
list << QString(" }"); list << QString(" map.addOverlay(marker);");
list << QString(" marker.setLabel(label);");
list << QString(" addClick(marker, name, addr, action);"); //弹跳效果-BMAP_ANIMATION_BOUNCE 坠落效果-BMAP_ANIMATION_DROP
list << QString(" if (animation == 1) {");
list << QString(" marker.setAnimation(BMAP_ANIMATION_BOUNCE);");
list << QString(" } else if (animation == 2) {");
list << QString(" marker.setAnimation(BMAP_ANIMATION_DROP);");
list << QString(" }"); list << QString(" }");
} void MapBaiDu::deleteMarker(QStringList &list)
{
//动态删除点,如果name为空则删除所有
list << QString(" function deleteMarker(name) {");
list << QString(" var allOverlay = map.getOverlays();");
list << QString(" var len = allOverlay.length;");
list << QString(" for (var i = 0; i < len; i++) {");
list << QString(" if (name.length == 0) {");
list << QString(" map.removeOverlay(allOverlay[i]);");
list << QString(" } else if (allOverlay[i].getLabel().content == name) {");
list << QString(" map.removeOverlay(allOverlay[i]);");
list << QString(" break;");
list << QString(" }");
list << QString(" }");
list << QString(" }");
}

Qt编写地图综合应用15-添加删除清空重置点的更多相关文章

  1. JS-DOM 综合练习-动态添加删除班级成绩表

    费了2个小时,才把原理弄懂,把问题逐个解决,当你发现你最后栽的那个点,是一个小石头拌的你,你起来是该哭还是该笑呢?只怪自己习武不精吧. 虽然问题都解决了,但是还有一个余留的问题就是鼠标经过input时 ...

  2. 百度地图API示例之添加/删除工具条、比例尺控件

    代码 <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" cont ...

  3. 高德地图——控件的添加&删除

    控件属性 visible //bool 默认true ov=new AMap.OverView(); ov.hide(); //ov.show(); 显示/隐藏---表示控件的添加与删除 <!D ...

  4. Qt编写安防视频监控系统17-在线地图

    一.前言 在线地图模块在一开始设计整个系统的时候就考虑进去了,主要功能就是在摄像机管理中,提供经纬度信息,然后加载百度地图在浏览器中显示,根据摄像机信息表中的每个摄像机的经纬度信息,自动生成设备点在地 ...

  5. Qt编写项目作品大全(自定义控件+输入法+大屏电子看板+视频监控+楼宇对讲+气体安全等)

    一.自定义控件大全 (一).控件介绍 超过160个精美控件,涵盖了各种仪表盘.进度条.进度球.指南针.曲线图.标尺.温度计.导航条.导航栏,flatui.高亮按钮.滑动选择器.农历等.远超qwt集成的 ...

  6. Qt编写安防视频监控系统12-异形布局

    一.前言 视频监控系统中,除了常规的1画面.4画面.9画面.16画面以外,还有几个布局比较另类,比如6画面.8画面.13画面,有些通道需要占据不同的行列,4画面.9画面.16画面都是非常对称的布局,行 ...

  7. Qt编写安防视频监控系统5-视频回放

    一.前言 一般视频回放都会采用GB28181国标来处理,这样可以保证兼容国内各大厂家的NVR,毕竟在同一的国家标准下,大家都会统一支持国标的,就不需要根据各个厂家的SDK来做兼容处理,烦得很,厂家越来 ...

  8. Qt编写安防视频监控系统1-通道切换

    一.前言 通道切换在视频监控系统中是最基础的必备功能,一般都会提供1通道+4通道+6通道+8通道+9通道+16通道这几个通道切换,可能做得比较好的还会提供24通道+32通道的,这个可能对电脑的配置就有 ...

  9. Qt编写安防视频监控系统(界面很漂亮)

    一.前言 视频监控系统在整个安防领域,已经做到了烂大街的程序,全国起码几百家公司做过类似的系统,当然这一方面的需求量也是非常旺盛的,各种定制化的需求越来越多,尤其是这几年借着人脸识别的东风,发展更加迅 ...

  10. Qt编写安防视频监控系统16-设备播放

    一.前言 设备播放模块是后面增加的,核心就是通过组合rtsp视频流地址来播放实时视频和历史视频,目前市面上很多厂家比如排第一的海康都是支持直接rtsp通过NVR来播放某个通道视频流和回放某个通道的视频 ...

随机推荐

  1. 47.vue-router的钩子函数

    钩子函数就是路由导航守卫 : 有 7 个守卫,分为 3 类 : 全局守卫:在全部的组件生效: beforeEach 全局前置守卫 afterEach 全局后置守卫 解析守卫 组件守卫:在某个组件生效  ...

  2. SpringBoot进阶教程(八十一)Spring Security自定义认证

    在上一篇博文<SpringBoot进阶教程(八十)Spring Security>中,已经介绍了在Spring Security中如何基于formLogin认证.基于HttpBasic认证 ...

  3. Linux查看CPU核数

    **方法一:通过proc文件系统 获取cpu总数量 命令如下 ** cat /proc/cpuinfo |grep processor 方法二:nproc命令 nproc 方法三:lscpu 显示CP ...

  4. Python入门:A+B问题

    1. A + B 问题I 前言 本篇作为课程第一篇,主要是对Python基础语法进行扫盲,本节课会学习到下面知识: 输入 本道题目的工作任务很简单,只是计算两个数的和,但是在计算之前,我们首先要明确的 ...

  5. 在 openEuler 22.03 上安装 KubeSphere 实战教程

    作者:老 Z,中电信数智科技有限公司山东分公司运维架构师,云原生爱好者,目前专注于云原生运维,云原生领域技术栈涉及 Kubernetes.KubeSphere.DevOps.OpenStack.Ans ...

  6. Redhat 7.6安装11G RAC GI时遇到此类报错

    环境:Redhat Linux 7.6 + Oracle 11.2.0.4 RAC 现象:图像化安装过程中,按照提示执行root.sh脚本,报错中断. 1. 具体现象 2. 定位问题 3. 解决问题 ...

  7. MindSponge分子动力学模拟——增强采样(2024.11)

    技术背景 关于增强采样(Enhanced Sampling)算法的具体原理,这里暂不做具体介绍,感兴趣的童鞋可以直接参考下这篇综述文章:Enhanced sampling in molecular d ...

  8. Mac安装Docker

    一.下载 从官网下载速度太慢,推荐在阿里云镜像下载. 下载地址:http://mirrors.aliyun.com/docker-toolbox/mac/docker-for-mac/stable/D ...

  9. 2024/9/16 CSP-S模拟赛试题

    A 这题是很有意思的一个题,思路就是你考虑kt的位置只可能在四个角,因为这种情况下,他的距离才会最远对吧,所以你就暴力找另一个人fengwu的点的位置,然后计算他们之间的距离然后你求一个\(\max\ ...

  10. pytest框架之fixture

    1.在进行接口关联时,一般很多个接口共用一个上行接口(例如)登录,可以使用fixture定义一个测试夹具,将登录的接口写在框架的conftest.py文件中: @pytest.fixture(scop ...