当前位置: 首页 > article >正文

JavaScript使用地理位置 API

前言

在JavaScript中,Geolocation API 是一种用于访问用户地理位置的接口。这个API允许网页应用程序获取用户的位置并提供基于位置的服务。

if (navigator.geolocation)
  navigator.geolocation.getCurrentPosition(
    function () {},
    function () {}
  );

这个函数中需要传入两个参数,第一个参数就是成功获取位置后返回的结果,第二个参数是获取失败之后返回的结果。

if (navigator.geolocation)
  navigator.geolocation.getCurrentPosition(
    function (position) {
      console.log(position);
    },
    function () {
      alert('无法获取你的位置!');
    }
  );

● 这样当浏览器询问我们是否给与位置权限时候,如果是的话会获取当前位置的坐标,如果否的会话弹窗报错;
在这里插入图片描述
在这里插入图片描述

● 所以我们可以将经度和维度解构出来定义到变量中存储

if (navigator.geolocation)
  navigator.geolocation.getCurrentPosition(
    function (position) {
      const { latitude } = position.coords;
      const { longitude } = position.coords;
      console.log(latitude, longitude);
    },
    function () {
      alert('无法获取你的位置!');
    }
  );

下篇文章来叫位置渲染出来!


http://www.kler.cn/a/302756.html

相关文章:

  • 前端框架大比拼:React.js, Vue.js 及 Angular 的优势与适用场景探讨
  • golang如何实现sse
  • jmeter常用配置元件介绍总结之后置处理器
  • MyBatis CRUD快速入门
  • AtomicInteger 和 AtomicIntegerFieldUpdater的区别
  • gpu-V100显卡相关知识
  • k8s--资源管理
  • js几个常用数组处理函数(或数组对象处理函数)的使用方法
  • 内存分配形式介绍,你知道哪些?
  • proteus+51单片机+AD/DA学习5
  • 性能测试有哪些典型问题?怎样去定位具体原因?
  • numpy03:numpy广播机制,花式索引取值,统计方法,数组的拆分与合并,线性代数方法
  • C++ 左值与右值浅谈
  • 每天一道面试题(9):lock 和 synchronized 区别
  • C# WPF中实现图表生成的五种方式
  • 【SpringCloud】微服务架构演进与Spring Cloud简介
  • 基于spring的博客系统(二)
  • Go Playground 在线编程环境
  • 优购电商小程序的设计与实现+ssm(lw+演示+源码+运行)
  • MySql8.x---开窗函数
  • HTTP 协议介绍
  • JS手写实现深拷贝
  • mysql性能优化-云服务与数据库即服务(DBaaS)优化
  • [论文笔记] LLM大模型剪枝篇——2、剪枝总体方案
  • 【JAVA入门】Day34 - Stream流
  • facebook广告和谷歌广告如何选择效果最大化?