专业编程基础技术教程

网站首页 > 基础教程 正文

HTML页面通过高德地图JS API实现高德地图显示 经纬度功能

ccvgpt 2024-11-07 09:51:20 基础教程 7 ℃

各位大家好,我是码农兔今天通过写一个微信公众号的后台页面实现了高德地图的定位、插入控件等功能,下面给各位大家介绍一下具体的实现。

HTML页面通过高德地图JS API实现高德地图显示 经纬度功能

首先我们要在html页面的head部分引入jquery 版本jquery-1.11.1.min.js和高德地图JS api 版本1.4和key(key可以在申请高德地图使用时获取)

在body里面定一个id是container的div,定义宽高。(地图通过这个div显示)

通过高德地图的AMap.map方法初始化地图定义一下基本参数,将div的id放到方法内。初始化地图的时候可以直接初始化3D地图必须是v1.4版本以上

接下来就是在地图内加入控件,高德地图JS api定义了很多控件,可以通过引用实现不同的功能

添加点击事件,加入监听,当我们点击地图时自动获取经纬度并在控制台打印经纬度。

地图展示 当点击地图时可以触发监听获取经纬度

关于高德地图 js api的实现我会持续更新,希望大家多提建议意见,我们共同进步,谢谢大家。

Tags:

最近发表
标签列表