js批量输入地址获取经纬度
使用js调用高德地图的接口批量输入地址获取经纬度。
以下的请求接口的key请换成你的key。
创建key:我的应用 | 高德控制台 ,服务平台选择《Web服务》。
<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8" /><meta http-equiv="X-UA-Compatible" content="IE=edge" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><title>js批量输入地址获取经纬度</title><script src="https://unpkg.com/axios/dist/axios.min.js"></script>
</head><body>获取经纬度<button id="btn">开始</button>
</body><script>var pi = 3.1415926535897932384626var a = 6378245.0var ee = 0.00669342162296594323var x_pi = (pi * 3000.0) / 180.0var R = 6378137function transform(lng, lat) {var dLat = transformLat(lng - 105.0, lat - 35.0)var dLng = transformLng(lng - 105.0, lat - 35.0)var radLat = (lat / 180.0) * pivar magic = Math.sin(radLat)magic = 1 - ee * magic * magicvar sqrtMagic = Math.sqrt(magic)dLat = (dLat * 180.0) / (((a * (1 - ee)) / (magic * sqrtMagic)) * pi)dLng = (dLng * 180.0) / ((a / sqrtMagic) * Math.cos(radLat) * pi)var mgLat = lat + dLatvar mgLng = lng + dLngvar newCoord = {lng: mgLng,lat: mgLat,}return newCoord}function transformLat(x, y) {var ret =-100.0 +2.0 * x +3.0 * y +0.2 * y * y +0.1 * x * y +0.2 * Math.sqrt(Math.abs(x))ret +=((20.0 * Math.sin(6.0 * x * pi) + 20.0 * Math.sin(2.0 * x * pi)) *2.0) /3.0ret +=((20.0 * Math.sin(y * pi) + 40.0 * Math.sin((y / 3.0) * pi)) * 2.0) /3.0ret +=((160.0 * Math.sin((y / 12.0) * pi) + 320 * Math.sin((y * pi) / 30.0)) *2.0) /3.0return ret}function transformLng(x, y) {var ret =300.0 +x +2.0 * y +0.1 * x * x +0.1 * x * y +0.1 * Math.sqrt(Math.abs(x))ret +=((20.0 * Math.sin(6.0 * x * pi) + 20.0 * Math.sin(2.0 * x * pi)) *2.0) /3.0ret +=((20.0 * Math.sin(x * pi) + 40.0 * Math.sin((x / 3.0) * pi)) * 2.0) /3.0ret +=((150.0 * Math.sin((x / 12.0) * pi) +300.0 * Math.sin((x / 30.0) * pi)) *2.0) /3.0return ret}/**火星转84*/this.gcj02_To_gps84 = function (lng, lat) {var coord = transform(lng, lat)var lontitude = lng * 2 - coord.lngvar latitude = lat * 2 - coord.latvar newCoord = {lng: lontitude,lat: latitude,}return newCoord}async function getData(txxt, index) {await axios({method: 'get',url: `https://restapi.amap.com/v3/assistant/inputtips`,params: {output: 'json',location: '101,25',keywords: txxt,key: 'f70fac306fbbe36ec9a8e059ec689214h',},}).then(function (res) {console.log("res.data===", res.data);let tips = res.data.tipslet lnglatArr, adcodefor (let i = 0; i < tips.length; i++) {const item = tips[i];if (item.location.length > 0) {lnglatArr = item.location.split(',')adcode = item.adcodebreak}}console.log("lnglatArr--", lnglatArr);let lng = gcj02_To_gps84(Number(lnglatArr[0]), Number(lnglatArr[1])).lng.toFixed(6)let lat = gcj02_To_gps84(Number(lnglatArr[0]), Number(lnglatArr[1])).lat.toFixed(6)myData[index].push(`经纬度:${lng},${lat}`)myData[index].push(`行政区划:${adcode}`)}).catch(function (err) {console.log(err)})}let btn = document.getElementById('btn')btn.onclick = async function (e) {// getData('楚雄市文化市场综合行政执法大队')initData()}function saveJSON(data, filename) {if (!data) {alert('保存的数据为空')return}if (!filename) filename = 'json.json'if (typeof data === 'object') {data = JSON.stringify(data, undefined, 4)}// 要创建一个 blob 数据var blob = new Blob([data], {type: 'text/json',}),// 添加鼠标事件e = document.createEvent('MouseEvents'),a = document.createElement('a')a.download = filename// 将blob转换为地址// 创建 URL 的 Blob 对象a.href = window.URL.createObjectURL(blob)a.dataset.downloadurl = ['text/json', a.download, a.href].join(':')// web 标准中已废弃// 用以在鼠标事件创建时初始化其属性的值e.initMouseEvent('click',true, // 是否可以冒泡false, // 是否可以阻止事件默认行为window, // 指向window对象0, // 事件的鼠标点击数量0, // 事件的屏幕的x坐标0,0, // 事件的客户端x坐标0,false, // 事件发生时 control 键是否被按下false, // 事件发生时 alt 键是否被按下false, // 事件发生时 shift 键是否被按下false, // 事件发生时 meta 键是否被按下0, // 鼠标按键值null)// 向一个指定的事件目标派发一个事件a.dispatchEvent(e)}
</script><script>let myData = [['名字:甘棠村'],['名字:蔡一村'],['名字:蔡二村'],['名字:蔡三村'],['名字:龙美村'],['名字:东沙村'],['名字:榄塘村'],['名字:东环社区'],['名字:江南社区'],['名字:富豪社区'],['名字:东环社区'],['名字:江南社区'],['名字:富豪社区'],]async function initData(params) {for (let index = 0; index < myData.length; index++) {const element = myData[index]let txt = element[0].split(':')[1]await getData('广州市番禺区市桥街道' + txt, index)}saveJSON(myData)}// initData()
</script></html>
效果图
相关文章:
js批量输入地址获取经纬度
使用js调用高德地图的接口批量输入地址获取经纬度。 以下的请求接口的key请换成你的key。 创建key:我的应用 | 高德控制台 ,服务平台选择《Web服务》。 <!DOCTYPE html> <html lang"en"><head><meta charset"UTF-…...
Python自动化测试实践中pytest用到的功能dependency和parametrize
Python自动化测试中pytest用到的功能 1、pytest之@pytest.mark.dependency装饰器设置测试用例之间的依赖关系 1.1说明: 1、这是一个pytest第三方插件,主要解决用例之间的依赖关系。如果依赖的上下文测试用例失败后续的用例会被标识为跳过执行,相当于执行了 pytest.mark.s…...
json-bigint处理前端精度丢失问题
问题描述:前后端调试过程中,有时候会遇到精度丢失的问题,比如后端给过来的id超过16位,就会出现精度丢失的情况,前端拿到的id与后端给过来的不一致。 解决方案: 1、安装 npm i json-bigint 2、在axios中配置…...
神经网络10-Temporal Fusion Transformer (TFT)
Temporal Fusion Transformer (TFT) 是一种专为时序数据建模而设计的深度学习模型,它结合了Transformer架构和其他技术,旨在有效地处理和预测时序数据中的复杂模式。TFT 于 2020 年由 Google Research 提出,旨在解决传统模型在时序预测中的一…...
django基于django的民族服饰数据分析系统的设计与实现
摘 要 随着网络科技的发展,利用大数据分析对民族服饰进行管理已势在必行;该平台将帮助企业更好地理解服饰市场的趋势,优化服装款式,提高服装的质量。 本文讲述了基于python语言开发,后台数据库选择MySQL进行数据的存储…...
html数据类型
数据类型是字面含义,表示各种数据的类型。在任何语言中都存在数据类型,因为数据是各式各样。 1.数值类型 number let a 1; let num 1.1; // 整数小数都是数字值 // 数字肯定有个范围 正无穷大和负无穷大 // Infinity 正无穷大 // -Infinity 负…...
Springboot启动异常 错误: 找不到或无法加载主类 xxx.Application异常
Springboot启动异常 错误: 找不到或无法加载主类 xxx.Application异常 报错提示 Connected to the target VM, address: 127.0.0.1:57210, transport: socket 错误:找不到或无法加载主类 global.hh.manage.HHMicroCloudProviderApplication Disconnected from the target VM, …...
哋它亢SEO技术分析:如何提升网站在搜索引擎中的可见性
文章目录 哋它亢SEO技术分析:如何提升网站在搜索引擎中的可见性网站的基本情况SEO优化分析与建议1. 元数据优化2. 关键词优化3. URL结构4. 图像优化5. 移动端优化6. 网站速度7. 结构化数据(Schema Markup)8. 内链与外链9. 社交分享 哋它亢SEO…...
web——upload-labs——第十一关——黑名单验证,双写绕过
还是查看源码, $file_name str_ireplace($deny_ext,"", $file_name); 该语句的作用是:从 $file_name 中去除所有出现在 $deny_ext 数组中的元素,替换为空字符串(即删除这些元素)。str_ireplace() 在处理时…...
ElasticSearch7.x入门教程之中文分词器 IK(二)
文章目录 前言一、内置分词器二、中文IK分词器(第三方)三、本地自定义四、远程词库总结 前言 ElasticSearch 核心功能就是数据检索,首先通过索引将文档写入 es。 查询分析则主要分为两个步骤: 1、词条化:分词器将输入…...
体积全息及平面全息图的衍射效率
一、体积全息 当记录材料的厚度是条纹间距的若干倍时,则在记录材料体积内将记录下干涉全息图的三维空间分布,就形成了体积全息。 按物光和参考光入射方向和再现方式的不同体积全息可以分为两种。 一种是物光和参考光在记录介质的同一侧入射,得…...
【常用组件整理】
xgplayer 字节开发的前端视频播放器 xgplayer是一个由字节跳动开发的强大的前端视频播放器,具有稳定性高、文档清晰、支持弹幕和移动端优化 等特点。相较于VideoJs,xgplayer的文档更简洁,自定义插件更为便捷。xgplayer还提供了丰富的插件来扩…...
用指针函数寻找数组中的最大值与次大值
#include <stdio.h>// 函数用于找出数组中的最大值和次大值 void LargestTow(int a[], int n, int *pfirst, int *psecond) {*pfirst a[0];*psecond a[1];if (*psecond > *pfirst) {// 如果初始的次大值大于最大值,交换它们int temp *pfirst;*pfirst *…...
原生微信小程序在顶部胶囊左侧水平设置自定义导航兼容各种手机模型
无论是在什么手机机型下,自定义的导航都和右侧的胶囊水平一条线上。如图下 以上图iphone12,13PRo 以上图是没有带黑色扇帘的机型 以下是调试器看的wxml的代码展示 注意:红色阔里的是自定义导航(或者其他的logo啊,返回之…...
Android Gradle自定义任务在打包任务执行完成后执行cmd命令
背景 在每次打包之后需要做某事,例如每次打包后我都会安装某个目录下的一个apk。这个apk是通过一堆shell命令过滤得到一个apk的地址,然后把执行的几个shell命令何必成一个alias指令,在打包后只需要执行alias指令实现功能。当然也可以直接写在…...
http自动发送请求工具(自动化测试http请求)
点击下载《http自动发送请求工具(自动化测试http请求)》 前言 在现代软件开发过程中,HTTP 请求的自动化测试是确保应用程序稳定性和可靠性的关键环节。为了满足这一需求,我开发了一款功能强大且易于使用的自动化 HTTP 请求发送工具。该工具基于 C# 开发…...
解决Docker环境变量的配置的通用方法
我们部署的很多服务都是以Docker容器的形式存在的。 在运行Docker容器前,除了设置网络、数据卷之外,还需要设置各种各样的环境变量。 有时候,由于容器版本的问题,一些文档没有及时更新,可能同时存在多个新旧版本的环…...
SpringBoot3整合Hutool-captcha实现图形验证码
文章目录 验证码需求分析:项目创建import方式的使用说明exclude方式定义接口:接口定义定义 CaptchaController前端代码在整合技术框架的时候,想找一个图形验证码相关的框架,看到很多验证码不在更新了或者是在中央仓库下载不下来,还需要多引入依赖。后面看到了Hutool **图形…...
Spring Boot核心概念:日志管理
日志记录是软件开发的重要组成部分,它帮助开发人员了解应用程序运行时的状态,以及在故障排查和性能监控时提供关键信息。Spring Boot通过提供默认的日志配置,简化了日志管理。 Spring Boot默认日志框架 Spring Boot默认使用Logback作为日志…...
selenium grid 远程webdriver添加上网代理
################## selenium grid config start ####################### # UI自动化测试策略 Grid/Local UIAutomation_TestStrategy Grid selenium_grid_url http://172.16.99.131:4444/wd/hub # Windows XP / linux grid_platformName linux # windows capabilities win…...
Flutter踩坑记录(一)debug运行生成的项目,不能手动点击运行
问题 IOS14设备,切后台划掉,二次启动崩溃。 原因 IOS14以上 flutter 不支持debugger模式下的二次启动 。 要二次启动需要以release方式编译工程安装至手机。 操作步骤 清理项目:在命令行中运行flutter clean来清理之前的构建文件。重新构…...
Spring Boot 项目 myblog 整理
myblog 项目是一个典型的 Spring Boot 项目,主要包括用户注册、登录、文章管理(创建、查询、更新、删除)等功能。 1. 项目结构与依赖设置 项目初始化与依赖 使用 Spring Initializr 创建项目。引入必要的依赖包: Spring Boot W…...
【前端知识】nodejs项目配置package.json深入解读
package.json详细解读 文件解读一、文件结构二、字段详解三、使用场景四、注意事项 组件版本匹配规则 文件解读 package.json 文件是 Node.js 项目中的一个核心配置文件,它位于项目的根目录下,并包含项目的基本信息、依赖关系、脚本、版本等内容。以下是…...
51c嵌入式~IO合集2
我自己的原文哦~ https://blog.51cto.com/whaosoft/11697814 一、STM32串口通信基本原理 通信接口背景知识 设备之间通信的方式 一般情况下,设备之间的通信方式可以分成并行通信和串行通信两种。并行与串行通信的区别如下表所示。 串行通信的分类 1、按照数据传…...
在应用启动时,使用 UniApp 提供的 API 检查和请求权限。
在使用 UniApp 开发 App 时,如果你需要在应用启动时提示用户获取本地媒体权限,可以按照以下步骤操作: 1. 明确需要的权限 要访问本地媒体(如相机、麦克风或文件存储),需要申请以下权限: Andr…...
前端知识点---伪数组是什么 , 伪数组如何转换为真数组(Javascript)
伪数组是什么 , 伪数组如何转换为真数组(Javascript) 在 JavaScript 中,伪数组对象是具有类似数组特性的对象,但并不是数组(即不继承 Array.prototype)。这些对象通常有一个 length 属性以及以数字索引为键的属性,但不…...
嵌入式 UI 开发的开源项目推荐
嵌入式开发 UI 难吗?你的痛点我懂!作为嵌入式开发者,你是否也有以下困扰?设备资源太少,功能和美观只能二选一?调试效率低,每次调整都要反复烧录和测试?开发周期太长,让你…...
《智能指针频繁创建销毁:程序性能的“隐形杀手”》
在 C编程的世界里,智能指针无疑是管理内存资源的得力助手。它们为我们自动处理内存的分配与释放,极大地减少了因手动管理内存而可能引发的诸如内存泄漏、悬空指针等棘手问题。然而,就像任何工具都有其两面性一样,智能指针在带来便…...
28.<Spring博客系统⑤(部署的整个过程(CentOS))>
引入依赖 Spring-boot-maven-plugin 用maven进行打包的时候必须用到这个插件。看看自己pom.xml中有没有这个插件 并且看看配置正确不正常。 注:我们这个项目打的jar包在30MB左右。 <plugin><groupId>org.springframework.boot</groupId><artif…...
mongodb多表查询,五个表查询
需求是这样的,而数据是从mysql导入进来的,由于mysql不支持数组类型的数据,所以有很多关联表。药剂里找药物,需要药剂与药物的关联表,然后再找药物表。从药物表里再找药物与成分关联表,最后再找成分表。 这里…...
服务器端渲染 (SSR) 与客户端渲染 (CSR)
嘿程序员!我们都知道,新时代的 Javascript 已经彻底改变了现代网站的结构和用户体验。如今,网站的构建更像是一个应用程序,伪装成一个能够发送电子邮件、通知、聊天、购物、支付等的网站。今天的网站是如此先进、互动,…...
【已解决】“EndNote could not connect to the online sync service”问题的解决
本人不止一次在使用EndNote软件时遇到过“EndNote could not connect to the online sync service”这个问题。 过去遇到这个问题都是用这个方法来解决: 这个方法虽然能解决,但工程量太大,每次做完得歇半天身体才能缓过来。 后来再遇到该问…...
HTML5拖拽API学习 托拽排序和可托拽课程表
文章目录 前言拖拽API核心概念拖拽式使用流程例子注意事项综合例子🌰 可拖拽课程表拖拽排序 前言 前端拖拽功能让网页元素可以通过鼠标或触摸操作移动。HTML5 提供了标准的拖拽API,简化了拖放操作的实现。以下是拖拽API的基本使用指南: 拖拽…...
sed使用扩展正则表达式时, -i 要写在 -r 或 -E 的后面
sed使用扩展正则表达式时, -i 要写在 -r 或 -E 的后面 前言 -r 等效 -E , 启用扩展正则表达式 -E是新叫法,更统一,能增强可移植性 , 但老系统,比如 CentOS-7 的 sed 只能用 -r ### Ubuntu24.04-E, -r, --regexp-extendeduse extended regular expressions in the script(fo…...
CSS中Flex布局应用实践总结
① 两端对齐 比如 要求ul下的li每行四个,中间间隔但是需要两段对齐,如下图所示: 这是除了基本的flex布局外,还需要用到:nth-of-type伪类来控制每行第一个与第四个的padding。 .hl_list{width: 100%;display: flex;align-items…...
【前端】CSS修改div滚动条样式
示例 分别是滚动条默认样式和修改后的样式 代码 <div class"video-list"><div class"list-item" onclick"videoinfo(100)"><img src"/index/images/coverimg/方和谦.png"><div class"txt">国医大…...
鸿蒙多线程开发——线程间数据通信对象02
1、前 言 本文的讨论是接续鸿蒙多线程开发——线程间数据通信对象01的讨论。在上一篇文章中,我们讨论了常规的JS对象(普通JSON对象、Object、Map、Array等)、ArrayBuffer。其中讨论了ArrayBuffer的复制传输和转移传输方式。 下面,我们将讨论SharedArra…...
Kotlin的data class
在 Kotlin 中,data class 是一种专门用来存储数据的类。与普通类相比,data class 提供了简化数据存储的语法,并且自动生成了一些常用的方法,例如 toString()、equals()、hashCode() 和 copy()。 1. 定义 data class data class …...
Proxy 在 JavaScript的用法
Proxy 是 JavaScript 提供的一个构造函数,用于创建一个“代理对象”。这个代理对象可以拦截目标对象的基本操作,例如读取属性、赋值、删除、调用函数等。通过它,我们可以修改或扩展对象的默认行为。 Proxy 的基本语法 const proxy = new Proxy(target, handler);target:被…...
vue3的attr透传属性详解和使用法方式。以及在css样式的伪元素中实现
在 Vue 3 和 TypeScript 中,属性透传(attr pass-through)是指将组件的属性传递到其根元素或某个子元素中。这个概念在开发可复用的组件时非常有用,尤其是当你希望将父组件的属性动态地传递给子组件的某个 DOM 元素时。 在 Vue 3 …...
《人工智能深度学习的基本路线图》
《人工智能深度学习的基本路线图》 基础准备阶段 数学基础: 线性代数:深度学习中大量涉及矩阵运算、向量空间等概念,线性代数是理解和处理这些的基础。例如,神经网络中的权重矩阵、输入向量的运算等都依赖于线性代数知识。学习内容…...
Matlab 答题卡方案
在现代教育事业的飞速发展中,考试已经成为现代教育事业中最公平的方式方法,而且也是衡量教与学的唯一方法。通过考试成绩的好与坏,老师和家长可以分析出学生掌握的知识多少和学习情况。从而老师可以了解到自己教学中的不足来改进教学的方式方…...
[Unity]TileMap开发,TileMap地图缝隙问题
环境: windows11 unity 2021.3.14f1c1 tilemap使用的图是美术已经拼接到一起的整图,块与块之间没有留缝隙 问题: TileMap地图直接在Unity中使用时,格子边缘会出现缝隙,移动或缩放地图时较明显。 解决方案&#x…...
pnpm : 无法加载文件 D:\Tool\environment\NodeAndNvm\node\pnpm.ps1,因为在此系统上禁止运行脚本。
问题 在终端(cmd)输入 pnpm -v,报错如下 pnpm : 无法加载文件 D:\Tool\environment\NodeAndNvm\node\pnpm.ps1,因为在此系统上禁止运行脚本。解决 1. 在终端输入get-ExecutionPolicy(查看执行策略/权限) 输出如下: # (受限的) Restricte…...
redis的map底层数据结构 分别什么时候使用哈希表(Hash Table)和压缩列表(ZipList)
在Redis中,Hash数据类型的底层数据结构可以是压缩列表(ZipList)或者哈希表(HashTable)。这两种结构的使用取决于特定的条件: 1. **使用ZipList的条件**: - 当Hash中的数据项(即f…...
通达OA前台submenu.php存在SQL注入漏洞(CVE-2024-10600)
通达OA前台submenu.php存在SQL注入漏洞(CVE-2024-10600) pda/appcenter/submenu.php 未包含inc/auth.inc.php且 $appid 参数未用’包裹导致前台SQL注入 影响范围 v2017-v11.6 fofa app"TDXK-通达OA" && icon_hash"-759108386"poc http://url…...
Flutter:photo_view图片预览功能
导入SDK photo_view: ^0.15.0单张图片预览,支持放大缩小 import package:flutter/material.dart; import package:photo_view/photo_view.dart;... ...class _MyHomePageState extends State<MyHomePage>{overrideWidget build(BuildContext context) {return…...
C++结构型设计模式之使用抽象工厂来创建和配置桥接模式的例子
下面是一个使用抽象工厂模式来创建和配置桥接模式的示例,场景是创建不同操作系统的窗口(Window)及其对应的实现(WindowImpl)。我们将通过抽象工厂来创建不同操作系统下的窗口和实现。 代码示例 #include <iostrea…...
智能合约运行原理
点个关注吧!! 用一句话来总结,智能合约就像是一个自动售货机:你投入硬币(触发条件),选择商品(执行合约),然后机器就会自动给你商品(执行结果&…...
Unity3D基于ECS的游戏逻辑线程详解
前言 Unity3D是一款非常流行的游戏开发引擎,其采用的是组件实体系统(ECS)架构,这种架构可以让游戏开发者更加高效地管理游戏逻辑线程。本文将详细介绍Unity3D基于ECS的游戏逻辑线程,并给出技术详解以及代码实现。 对…...