webGIS使用JS,高德API完成智慧校园项目打卡功能

代码实现:

        var map =new AMap.Map('container',{center:[],//目标点的中心位置zoom:16,viewMode:'3D',pitch:45,})//使用控件AMap.plugin(['AMap.ToolBar','AMap.Scale','AMap.ControlBar','AMap.HawkEye','AMap.MoveAnimation'],function(){map.addControl(new AMap.ToolBar({ position:{top:'100px',right:'30px',},}))map.addControl(new AMap.Scale())map.addControl(new AMap.ControlBar())map.addControl(new AMap.HawkEye(  { position:{top:'163px',right:'5px',},}))})//定义全局变量保存geojsonvar geojson = new AMap.GeoJSON({geoJSON:null,})//导入数据if(JSON.stringify(getData())!='[]'){geojson.importData(getData())//恢复旧数据的点击事件geojson.eachOverlay(function(item){item.on('click',function(e){//console.log(e.lnglat,'old')//让点击的marker对象的click属性+1var ext =item.getExtData()var click = ++ext._geoJsonProperties.clicksaveData(geojson.toGeoJSON())//使用消息提示框显示var infowindow = new AMap.InfoWindow({anchor:'top-center',content:`<div>打卡了${click}次</div>`,})//显示(打卡信息窗口)infowindow.open(map,item.getPosition())})})}map.add(geojson)//监听地图的点击事件map.on('click',function(e){var marker =new AMap.Marker({position:e.lnglat,extData:{_geoJsonProperties:{gid:geojson.getOverlays().length+1,click:0,}}})//使用覆盖物的点击事件marker.on('click',function(e){// console.log('new')//让点击的marker对象的click属性+1var ext =marker.getExtData()var click = ++ext._geoJsonProperties.clicksaveData(geojson.toGeoJSON())//使用消息提示框显示var infowindow = new AMap.InfoWindow({anchor:'top-center',content:`<div>打卡了${click}次</div>`,})//显示(打卡信息窗口)infowindow.open(map,marker.getPosition())})

注意:此段为调用高德API 的script代码,其中坐标需填写自己所需的,可使用坐标拾取器获得

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

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

相关文章

【Java面试——JUC全局观、原子类、锁、集合类、线程池、工具类】

目录 3.3 JUC全局观 JUC框架包含几个部分? Lock框架和Tools哪些核心的类? JUC并发集合哪些核心的类? JUC原子类哪些核心的类? JUC线程池哪些核心的类? 3.4 JUC原子类 线程安全的实现方法有哪些? 什么是CAS? CAS使用示例&#xff0c;结合AtomicInteger给出示例? CAS会有…

Python遥感开发之快速判断TIF数据为空

Python遥感开发之快速判断TIF数据为空 前言&#xff1a;介绍一下如何使用python下的gdal读取tif数据的时候&#xff0c;快速判断该tif数据是否为空&#xff0c;如果为空的话就把当前的tif删掉。 如图所示&#xff0c;通过arcgis查看箭头指向的为空值。 仅通过文件的大小无法判…

NVMe Over Fabrics with iRDMA总结 - 1

1.0 Introduction简介 NVM Express* (NVMe*) drives are high-speed, low-latency, solid-state drives (SSDs), that connect over the server Peripheral Component Interconnect Express* (PCIe*) bus. NVM Express* (NVMe*) 硬盘是高速、低延迟的固态硬盘 (SSD),通过服务…

人工智能中的模型评估

1 概述 1.1 定义 人工智能&#xff08;AI&#xff09;模型评估是一个关键的过程&#xff0c;用于确定模型在特定任务上的性能和有效性。这个过程涉及使用各种技术和指标来衡量模型的准确度、可靠性、泛化能力以及其他重要特性。在不同的应用场景中&#xff0c;模型评估的具体…

Qt Creator 11.0.3同时使用Qt6.5和Qt5.14.2

Qt Creator 11.0.3同时使用Qt6.5和Qt5.14.2 概要方法1.打开Qt Creator中的Kit&#xff0c;这里我直接附上几张截图&#xff0c;不同的版本打开位置可能有所不同&#xff0c;总之最终目的是要打开构建套件&#xff08;Kit&#xff09;2.可以看到构建套件里面有包含了“构建套件K…

深度学习记录--计算图(前向后向传播)

什么是计算图&#xff1f; 从一个例子入手&#xff1a; 将函数J的计算用流程图表示出来&#xff0c;这样的流程图被称为计算图 简单来说&#xff0c;计算图是用来显示每个变量间的关系的一种图 两种传播方式 计算图有两种传播方式&#xff1a;前向传播 和 后向传播 什么是前…

使用dirmap命令行时报错,提示缺少gevent模块

记得以前是可以的&#xff0c;可能是时间长了重装了系统&#xff0c;引起的。 修复方法。升级pip&#xff0c;然后重新下载安装gevent模块。 具体&#xff1a; python -m pip install --upgrade pip 使用下面命令解决下载慢的问题。 pip config set global.index-url http…

Drools 7 ObjectDataCompiler

ObjectDataCompiler 是用于将一个java 对象填充到template 内生成drl。 实际是转为String对象&#xff0c;父类为DataProviderCompiler要注意对象值为空的处理&#xff0c;如果填充遇到null&#xff0c;会导致rule很奇怪。 测试java 代码如下 public class ObjectDataCompil…

【WPF.NET开发】WPF.NET桌面应用开发概述

本文内容 为何从 .NET Framework 升级使用 WPF 进行编程标记和代码隐藏输入和命令控件布局数据绑定图形和动画文本和版式自定义 WPF 应用 Windows Presentation Foundation (WPF) 是一个与分辨率无关的 UI 框架&#xff0c;使用基于矢量的呈现引擎&#xff0c;构建用于利用现…

LeetCode [中等] 二叉树中序—二叉搜索树中第K小的元素

二叉搜索树中第K小的元素 二叉搜索树具有如下性质&#xff1a; 结点的左子树只包含小于当前结点的数。 结点的右子树只包含大于当前结点的数。 所有左子树和右子树自身必须也是二叉搜索树。 二叉树的中序遍历即按照访问左子树——根结点——右子树的方式遍历二叉树&#x…

图片处理OpenCV IMDecode模式说明【生产问题处理】

OpenCV IMDecode模式说明【生产问题处理】 1 前言 今天售后同事反馈说客户使用我们的图片处理&#xff0c;将PNG图片处理为JPG图片之后&#xff0c;变为了白板。 我们图片处理使用的是openCV来进行处理 2 分析 2.1 图片是否损坏&#xff1a;非标准PNG头部 于是&#xff0c;马…

SHAP(六):使用 XGBoost 和 HyperOpt 进行信用卡欺诈检测

SHAP&#xff08;六&#xff09;&#xff1a;使用 XGBoost 和 HyperOpt 进行信用卡欺诈检测 本笔记本介绍了 XGBoost Classifier 在金融行业中的实现&#xff0c;特别是在信用卡欺诈检测方面。 构建 XGBoost 分类器后&#xff0c;它将使用 HyperOpt 库&#xff08;sklearn 的 …

【U8+】用友U8删除固定资产卡片,提示:当前卡片不是本月录入的卡片,不能删除。

【问题描述】 用友U8软件&#xff0c;参照已有账套新建账套的时候&#xff0c;选择结转期初余额。 例如&#xff1a;参照已有账套的2022年新建2023年的账套。 结转期初的时候勾选了固定资产模块&#xff0c; 建立成功后登录23年新的账套后&#xff0c;删除固定资产卡片&#xf…

基于Eclipse+SDK+ADT+DDMS的安卓开发环境完整搭建过程

基于EclipseSDKADTDDMS的安卓开发环境完整搭建过程 1 基本概念2 SDK安装3 Eclipse安装4 ADT插件安装4.1 在线安装&#xff08;太慢不建议选择&#xff09;4.2 离线安装&#xff08;建议选择&#xff09; 5 配置SDK6 集成安装7 创建安卓虚拟设备8 创建并启动安卓虚拟机8 关于DDM…

node.js出现version `GLIBC_2.27‘ not found的解决方案

大家好,我是爱编程的喵喵。双985硕士毕业,现担任全栈工程师一职,热衷于将数据思维应用到工作与生活中。从事机器学习以及相关的前后端开发工作。曾在阿里云、科大讯飞、CCF等比赛获得多次Top名次。现为CSDN博客专家、人工智能领域优质创作者。喜欢通过博客创作的方式对所学的…

nextjs入门

创建项目 npx create-next-app 项目名 体验文件路由 nextjs提供了文件路由的功能, 根据文件系统的目录结构, 可以识别为对应的页面路由 创建页面 首先, 在src下创建pages目录, 然后创建一个about文件(对应about页面)和main/index.js文件(对应首页) pages/main/index con…

c语言:整数与浮点数在内存中的存储方式

整数在内存中的存储&#xff1a; 在计算机内存中&#xff0c;整数通常以二进制形式存储。计算机使用一定数量的比特&#xff08;bit&#xff09;来表示整数&#xff0c;比如32位或64位。在存储整数时&#xff0c;计算机使用补码形式来表示负数&#xff0c;而使用原码形式来表示…

【计算机网络学习之路】URL概念及组成

目录 一. URL是什么 二. URL的组成 三. encode和decode 前言 本系列文章是计算机网络学习的笔记&#xff0c;欢迎大佬们阅读&#xff0c;纠错&#xff0c;分享相关知识。希望可以与你共同进步。 本篇讲解使用浏览器不可或缺的部分——URL 一. URL是什么 域名及DNS 我们在…

43 - 什么是数据的强、弱一致性?

说到一致性&#xff0c;其实在系统的很多地方都存在数据一致性的相关问题。除了在并发编程中保证共享变量数据的一致性之外&#xff0c;还有数据库的 ACID 中的 C&#xff08;Consistency 一致性&#xff09;、分布式系统的 CAP 理论中的 C&#xff08;Consistency 一致性&…

Android studio Load error:undefined path variables

android stuido 报错 Load error&#xff1a;undefined path variables Gson is undefined 处理方法&#xff1a; 点击进行Sync Project with Gradle Files