百度地图添加坐标点

 ​​​​​​html

<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server"><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>查看签到信息-地图</title><script src='/resources/js/jquery.min.js' type='text/javascript' language='javascript'></script><script src='/resources/js/json2.js' type='text/javascript' language='javascript'></script><script src='/resources/js/app.js?v=202312291520' type='text/javascript' language='javascript'></script><script src='DayAttendanceMap.js?r=202312291520' type='text/javascript' language='javascript'></script><script type="text/javascript" src="https://api.map.baidu.com/api?&v=2.0&ak=用你自己的key"></script><link href="/resources/css/BMapView.css" rel="stylesheet" type="text/css" /><style>html, body, form {height: 100%;margin: 0 auto;}#bdmap {width: 100%;height: 100%;}</style>
</head>
<body><form id="form1" runat="server"><div id="bdmap"></div></form>
</body>
</html>

 js


//重置标点对象
var objMap = null;
var bPoints = new Array();$(function () {loadData();
});function loadData() {var map = new BMap.Map("bdmap");var point = new BMap.Point(120.157956, 30.277439);map.centerAndZoom(point, 11);map.enableScrollWheelZoom(true);objMap = map;var userId = app.getRequest('UserId');var attDay = app.getRequest('AttDay');$.ajax({url: 'Attendance.ashx',type: 'POST',data: {PostType: "get",ActionType: "DayAttendance",UserId: userId,AttDay: attDay,r: Math.random()},dataType: 'json',success: function (data) {if (data && data.success) {$.each(data.rows, function (index) {addPoint(data.rows[index]);});if (bPoints.length > 0) {//重置缩放级别和中心点var view = objMap.getViewport(eval(bPoints));var mapZoom = view.zoom;var centerPoint = view.center;//objMap.centerAndZoom(centerPoint, mapZoom); mapZoom 自适应缩放级别objMap.centerAndZoom(centerPoint, 11);}}}});
}function addPoint(pointData) {if (!pointData.SIGNINCOORDINATE) {return;}var lng = pointData.SIGNINCOORDINATE.split(',')[0];var lat = pointData.SIGNINCOORDINATE.split(',')[1];var icon = new BMap.Icon("/resources/images/location_small.png", new BMap.Size(14, 22));var point = new BMap.Point(parseFloat(lng), parseFloat(lat));bPoints.push(point); // 添加到百度坐标数组 用于自动调整缩放级别var marker = new BMap.Marker(point, {icon: icon}); // 创建标注    objMap.addOverlay(marker); // 将标注添加到地图中var opts = {position: point,    // 指定文本标注所在的地理位置offset: new BMap.Size(6, -20)    //设置文本偏移量}var projectName = '';if (pointData.PROJECTNAME) {projectName = '-' + pointData.PROJECTNAME;}var label = new BMap.Label(app.getTDate(pointData.SIGNINDATE).substring(11, 16) + '-' + pointData.ATTTYPE + projectName, opts);  // 创建文本标注对象label.setStyle({color: "red",fontSize: "12px",height: "20px",lineHeight: "20px",fontFamily: "微软雅黑"});objMap.addOverlay(label);
}

数据格式

{"total":0,"success":true,"msg":"","obj":null,"rows":[{"GUID":"3691515d-269c-4f27-b3c0-4b8fbc4fd8f6","LZYUSERID":"9635727a-027d-4200-89d1-c32be2f3d339","SIGNINDATE":"2023-11-23T08:22:43","SIGNINCOORDINATE":"120.11504470442085,30.347792030190185","ATTTYPE":"项目打卡","PROJECTNAME":"杭州余杭新文服饰有限公司厂房改建项目","SIGNMONTH":"2023-11","SIGNDAY":"2023-11-23"},{"GUID":"8d9af7c8-f72c-486f-889e-348357f7d0df","LZYUSERID":"9635727a-027d-4200-89d1-c32be2f3d339","SIGNINDATE":"2023-11-23T17:49:47","SIGNINCOORDINATE":"120.11098424440662,30.333185555269385","ATTTYPE":"项目打卡","PROJECTNAME":"杭政储出【2021】15号地块商业商务用房","SIGNMONTH":"2023-11","SIGNDAY":"2023-11-23"}],"id":null,"text":null,"status":null,"children":[]
}

最终效果

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

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

相关文章

钡铼技术集IO数据采集可编程逻辑控制PLC无线4G环保物联网关

背景 数据采集传输对于环保企业进行分析和决策是十分重要的&#xff0c;而实时数据采集更能提升环保生产的执行力度&#xff0c;从而采取到更加及时高效的措施。因此实时数据采集RTU成为环保企业的必备产品之一。 产品介绍 在推进环保行业物联网升级过程中&#xff0c;环保RTU在…

楼宇智慧能源消耗监测管理系统,楼宇中的能源“管家”

随着人口的增加&#xff0c;楼宇数据呈上涨趋势&#xff0c;但是楼宇智能建设在我国普及性远远不足&#xff0c;相比传统楼宇控制&#xff0c;智能楼宇控制系统对于楼宇内部的用电设备控制&#xff0c;能够更加的节约能源&#xff0c;降低成本。对于现代化楼宇而言&#xff0c;…

一款超酷的一体化网站测试工具:Web-Check

Web-Check 是一款功能强大的一体化工具&#xff0c;用于发现网站/主机的相关信息。用于检查网页的工具&#xff0c;用于确保网页的正确性和可访问性。它可以帮助开发人员和网站管理员检测网页中的错误和问题&#xff0c;并提供修复建议。 它只需要输入一个网站就可以查看一个网…

什么是爬虫,为什么爬虫会导致服务器负载跑满

在我们日常使用服务器的过程中&#xff0c;经常会有遇到各种各样的问题。今天就有遇到用户来跟德迅云安全反馈自己服务器负载跑满&#xff0c;给用户详细排查后也未发现异常&#xff0c;抓包查看也没有明显攻击特征&#xff0c;后续查看发现是被爬虫爬了&#xff0c;调整处理好…

连理:保险中的实名DID创新应用

2023年12月12日&#xff0c;BSN实名DID服务发布会在北京成功举办&#xff0c;会上正式发布了BSN实名DID服务。这一服务充分融合了BSN区块链服务网络和CTID数字身份链两大基础设施&#xff0c;满足“前台匿名、后台实名”的管理要求&#xff0c;对服务数字经济发展、支撑国家数据…

Springer build pdf乱码

在textstudio中编辑时没有错误&#xff0c;在editor manager生成pdf时报错。 首先不要改源文件&#xff0c;着重看你的上传顺序&#xff1a; 将.tex文件&#xff0c;.bst文件&#xff0c;.cls文件&#xff0c;.bib文件, .bbl文件的类型&#xff0c;在editor manager中是Item。…

archiver error. Connect internal only, until freed.

[64000][257] ORA-00257: archiver error. Connect internal only, until freed.原因 归档日志写满了、闪回日志写满了(根本原因是服务器磁盘写满了) # 切换到oracle服务 su - oracle# 使用sysdba用户登录 解决方案:(https://blog.csdn.net/qq_37635373/article/details/933282…

thinkphp+vue_mysql汽车租赁管理系统1ma2x

运行环境:phpstudy/wamp/xammp等 开发语言&#xff1a;php 后端框架&#xff1a;Thinkphp5 前端框架&#xff1a;vue.js 服务器&#xff1a;apache 数据库&#xff1a;mysql 数据库工具&#xff1a;Navicat/phpmyadmin 课题主要分为三大模块&#xff1a;即管理员模块、用户模块…

利用 PEB_LDR_DATA 结构枚举进程模块信息

1. 引言 我们常常通过很多方法来获取进程的模块信息&#xff0c;例如 EnumProcessModules 函数、CreateToolhelp32Snapshot 函数、WTSEnumerateProcesses 函数、ZwQuerySystemInformation 函数等。但是调用这些接口进行模块枚举的原理是什么我们并不知道。通过学习 PEB 中 PEB…

Stable Diffusion WebUI安装合成面部说话插件SadTalker

SadTalker可以根据一张图片、一段音频&#xff0c;合成面部说这段语音的视频。图片需要真人或者接近真人。 安装ffmpeg 下载地址&#xff1a; https://www.gyan.dev/ffmpeg/builds/ 下载ffmpeg-git-full.7z 后解压&#xff0c;将解压后的目录\bin添加到环境变量的Path中。 在…

出海合规云安全,AWS Landing Zone解决方案建立安全着陆区

在出海的大环境中&#xff0c;企业数字化转型的趋势之一就是上云。然而&#xff0c;上云也带来了新的挑战&#xff0c;特别是对企业的 IT 建设和管理提出了更高的要求。为了构建一个安全合规的云上信息系统环境&#xff0c;满足企业中不同用户的快速增长、资源访问可控、成本可…

Tips:电池电源电压转换为220V

今天在进行操作的时候&#xff0c;看到一个新的东西&#xff0c;就是如何普通的电瓶电压转化为220V交流电。 当在室外或者工作地距离电源比较远的情况下&#xff0c;一般是选取拉线的方式进行采电&#xff0c;但是当距离电源过远&#xff0c;使用拉线的方式就不可用了。如何在…

2023年最后一篇博客!

首先祝大家周末快乐&#xff01;元旦快乐&#xff01; 今天不聊技术哦 01哀叹2023 2023年只剩2天了&#xff01;转眼间又是一年到头了&#xff0c;这一年我做了什么呢&#xff1f;回过头来一想&#xff0c;什么都没有做。也尝试过做不少事情&#xff0c;但都是没有一个好的结…

小程序中拖拽和缩放图片

需求&#xff1a;点击元素后选中&#xff0c;出现缩放按钮&#xff0c;拖动缩放按钮可实现元素的缩放&#xff1b;并且元素本身是可以拖动的。 html&#xff1a; <block wx:for"{{imageControls}}" wx:key"index"><view hidden"{{item.hidd…

对SPI总线上挂接多个X5045的读写操作

#include<reg51.h> //包含单片机寄存器的头文件 #include<intrins.h> //包含_nop_()函数定义的头文件 sbit SCKP3^4; //将SCK位定义为P3.4引脚 sbit SIP3^5; //将SI位定义为P3.5引脚 sbit SOP3^6; //将SO位定义为P3.6引脚 sbit CS1P3^7; …

华为发布的工业软件三大难题:面向CAE分析的高质量曲面贴体网格的生成问题

以下内容转载&#xff1a; 网格生成&#xff0c;是把一个特定的研究区域分割成由许多很小的子区域(元素)&#xff0c;以满足一些特定的要求。在理想的情况下&#xff0c;网格中的每个元素的形状和分布可以通过一种自动的网格生成算法来确定。 结构网格生成的代数网格生成法和…

10.Go 映射

映射&#xff08;map&#xff09;是一种特殊的数据结构&#xff0c;用于存储一系列无序的键值对&#xff0c;映射基于键来存储数据。映射功能强大的地方是&#xff0c;能够基于键快速检索数据。键就像索引一样&#xff0c;指向与该键关联的值。与C、Java中的映射的不同之处在于…

挑战Python100题(7)

100+ Python challenging programming exercises 7 Question 61 Print a unicode string "hello world". Hints: Use ustrings format to define unicode string. 打印一个unicode字符串“helloworld”。 提示:使用u“字符串”格式定义unicode字符串。 Solution…

提升Windows系统安全性的一些有效的策略

假设一个杀猪的机器人感染了病毒&#xff0c;把人识别成了猪&#xff0c;&#xff0c;&#xff0c;&#xff0c;&#xff0c; 1&#xff1a;我偶然发现的&#xff1a;把所有向外的UDP都禁止&#xff0c;但是要开放53号端口&#xff0c;因为这是DNS通讯端口&#xff0c;没有这个…

Vue - 使用Element UI Upload / importExcelJs进行文件导入

1 情景一 需求背景&#xff1a;后端配合&#xff0c;点击"导入"按钮&#xff0c;弹出“导入”弹窗&#xff0c;将电脑本地Excel表格数据导入到页面中表格位置&#xff08;需要调用后端接口&#xff09;&#xff0c;而页面中表格通过后端接口获取最新数据。 实现思路…