天地图实现标注用户当前坐标位置

最新推荐文章于 2024-06-13 10:55:23 发布

趁早--我是认真的

最新推荐文章于 2024-06-13 10:55:23 发布

阅读量1w

点赞数 4

分类专栏：天地图文章标签：前端地图 geolocation

本文链接：https://blog.csdn.net/Mark_JF00/article/details/53440589

版权

要想获取用户的位置就必须要知道用户设备所在的经纬度，而设备获取经纬度一般采用以下方法

1、IP地址

2、GPS全球定位系统（较准确）

3、WIFI无线网络

4、基站3G4G网络（较准确）

获取用户坐标我采用的是H5的Geolocation地理位置对象

navigataor.geolocation

方法：

》经度：coords.longitude

》维度：coords.latitude

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <meta name="keywords" content="天地图"/>
    <title>天地图&#x

最低0.47元/天解锁文章

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

趁早--我是认真的

关注关注

4
点赞
踩
10

收藏

觉得还不错? 一键收藏
9
评论
天地图实现标注用户当前坐标位置

前端地图引用调用方法
复制链接

扫一扫

专栏目录

uniapp - [微信小程序 | 安卓苹果app] 详细实现接入天地图完整流程，提供显示地图、IP 属地定位 / 用户定位的城市名称、用户定位的经纬度超多功能（复制运行示例代码，详细注释及常见问题）

王佳斌

05-02

4759

uni-app，微信小程序，安卓app，苹果app，App端，支付宝小程序，nvue，天地图，国家天地图api，接入使用天地图，uniApp小程序端接入天地图，uniapp安卓苹果app端接入天地图，微信小程序平台如何引入天地图，天地图Api使用教程，如何在uniapp里集成天地图，使用天地图获取当前定位，天地图api教程，天地图官方文档，天地图详细使用教程，Uniapp项目如何使用天地图，项目引入天地图配置及使用教程，使用天地图获取用户定位，天地图获取用户当前位置信息(经纬度)，如何通过天地图拿到用户定位

Vue - 【支持Nuxt.js】超详细网站接入国家 “天地图“ 完整流程，提供显示地图、IP 属地定位 / 用户定位的城市名称、用户定位的经纬度等超多功能（可复制运行示例代码，详细注释及常见问题）

王佳斌

04-18

2314

vue 使用天地图获取当前定位，vue 天地图 API，vue中使用天地图api教程，vue nuxt 天地图使用教程，nuxt项目如何使用天地图，nuxt 使用国家天地图详细教程，vue nuxt 项目引入天地图配置及使用教程，vue使用天地图获取用户定位，nuxt vue网页用天地图获取用户当前位置信息(经纬度)，vue nuxt 公众号H5网页项目如何通过天地图拿到用户定位数据，vue nuxt 天地图服务拿到客户ip地址定位城市名称，在vue H5项目中使用天地图sdk，vue nuxt 中使用天地

9 条评论您还未登录，请先登录后发表或查看评论

天地图之定位信息详解

躬行之

08-15

9557

最近的项目涉及到百度地图的使用，项目组通知使用天地图替代百度地图，一个原因是天地图是国家测绘地理信息局建设的，企业可以使用其公众版本进行开发以提供相关的地图信息服务，较其他地图具有权威性，当然天地图提供的服务是否较其他地图更具有权威性和实时性，这个作为普通开发者是不能确定的，另一个原因是减少运用成本，我觉得是否真能达到这样的目标真不一定，毕竟商业地图输出能力还是较免费版本更强。还是先来开始天地图 ...

vue 实现天地图，集合数据坐标显示，坐标图片自定义，事件指定位置，地图类型切换

hui_54520的博客

07-11

5721

vue 实现天地图，集合数据坐标显示，坐标图片自定义，事件指定位置，地图类型切换

天地图h5定位

sunyanchun的专栏

02-08

874

天地图h5定位

天地图(二)引入地图

热门推荐

josiecici的博客

06-08

1万+

需求：在地图上点选或搜索选中后将经纬度和详细地址传给表单

vue获取当前坐标并通过天地图逆转码为省市区

m0_45857808的博客

07-04

1592

获取当前经纬度转为省市区

Android 通过 Arcgis 加载天地图

11-25

要实现在地图上显示用户当前位置，你需要获取用户的GPS坐标。在Android中，这通常通过LocationManager和LocationListener完成。在获取到位置后，创建一个`Point`对象，并使用`MapView`的`setInitialLocation()`或`...

JS 调用天地图地图服务

07-06

天地图是中国国家基础地理信息中心提供的一项地图服务，它允许开发者通过API接口集成到自己的应用程序中，实现地图的显示、查询、定位等功能。本篇将详细介绍如何使用JS调用天地图地图服务，以及相关的技术要点。 1...

天地图切片调用

03-31

通过深入学习arcGIS Flex API和天地图服务的接口文档，开发者可以创建出功能丰富的地图应用，如标注添加、查询分析、空间操作等功能。同时，天地图还提供了其他接口，如WMS、WFS等，供开发者根据需求选择合适的方式...

天地图显示定位显示图层

11-27

在Android开发领域，"天地图显示定位显示图层"是一个重要的功能实现，它结合了地理信息系统（GIS）和移动应用技术，使得用户可以在移动设备上查看、定位并操作地图图层。下面将详细介绍这一功能的实现及其相关知识点...

leaflet加载百度、高德、谷歌、天地图等在线地图

03-26

本主题聚焦于如何利用Leaflet加载不同地图服务提供商的在线地图，如百度、高德、谷歌和天地图。以下是对这个知识点的详细解释。首先，Leaflet的核心功能之一是能够轻松地添加地图图层。`L.TileLayer`是Leaflet中的...

Vue 3+ts +天地图点击地图获取详细位置

qq_43575827的博客

04-26

2534

天地图点击获取详细地址

天地图获取坐标功能

qq_34568657的博客

12-12

1430

上次发布一个高德地图获取坐标的功能，这次是天地图获取坐标功能。

天地图获取点击位置的经纬度

qq_41117545的博客

10-30

1万+

<!DOCTYPE html> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"/> <meta name="keywords" content="天地图"/> <title>天地图－地图API－范例－地图拾取器</title> <style type="text/css"> .

openlayers 实现根据点击地图得到坐标进行地图标注

06-12

要实现根据点击地图得到坐标进行地图标注，可以使用 OpenLayers 提供的事件监听器来实现。具体步骤如下： 1. 创建一个地图容器 ```html <div id="map" style="width: 100%; height: 500px;"></div> ``` 2. 初始化地图 ```javascript var map = new ol.Map({ target: 'map', layers: [ new ol.layer.Tile({ source: new ol.source.OSM() }) ], view: new ol.View({ center: ol.proj.fromLonLat([120.15, 30.28]), // 设置地图中心点 zoom: 10 // 设置地图缩放级别 }) }); ``` 3. 监听地图的 click 事件 ```javascript map.on('click', function(evt) { var coord = evt.coordinate; // 获取点击的坐标 console.log(coord); // 在控制台输出坐标信息 }); ``` 4. 根据点击的坐标添加标注 ```javascript var layer = new ol.layer.Vector({ source: new ol.source.Vector(), style: new ol.style.Style({ image: new ol.style.Icon({ src: 'https://openlayers.org/en/v4.6.5/examples/data/icon.png' }) }) }); map.addLayer(layer); map.on('click', function(evt) { var coord = evt.coordinate; var feature = new ol.Feature(new ol.geom.Point(coord)); layer.getSource().addFeature(feature); // 添加标注 }); ``` 以上代码实现了在 OpenLayers 中根据点击地图得到坐标进行地图标注的功能。需要注意的是，添加标注时需要先创建一个矢量图层，并将其添加到地图中。同时，需要为标注指定样式，这里使用了一个简单的图标作为标注样式。

“相关推荐”对你有帮助么？

非常没帮助
没帮助
一般
有帮助
非常有帮助

提交