分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 软件开发

html5——地理位置

发布时间:2023-09-06 01:32责任编辑:沈小雨关键词:暂无标签

获取地理位置

<!DOCTYPE html><html lang="en"><head> ???<meta charset="UTF-8"> ???<title>Title</title></head><body><script> ???//兼容处理 ???if (navigator.geolocation) { ???????// successCallback 当获取用户位置成功的回调函数 ???????// errorCallback 当获取用户位置失败的回调函数 ???????navigator.geolocation.getCurrentPosition(successCallback, errorCallback); ???} else { ???????console.log(‘sorry,你的浏览器不支持地理定位‘); ???} ???// 获取地理位置成功的回调函数 ???function successCallback(position) { ???????// 获取用户当前的经纬度 ???????// coords坐标 ???????// 纬度latitude ???????var wd = position.coords.latitude; ???????// 经度longitude ???????var jd = position.coords.longitude; ???????console.log("获取用户位置成功!"); ???????console.log(wd + ‘----------------‘ + jd); ???} ???// 获取地理位置失败的回调函数 ???function errorCallback(error) { ???????console.log(error); ???????console.log(‘获取用户位置失败!‘) ???}</script></body></html>

地理坐标抓取

http://api.map.baidu.com/lbsapi/getpoint/index.html

百度API展示

<html><head> ???<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> ???<meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> ???<style type="text/css"> ???????body, html{width: 100%;height: 100%; margin:0;font-family:"微软雅黑";} ???????#l-map{height:300px;width:100%;} ???????#r-result{width:100%;} ???</style> ???<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=您的密钥"></script> ???<title>本地搜索的结果面板</title></head><body><div id="l-map"></div><div id="r-result"></div></body></html><script type="text/javascript"> ???// 百度地图API功能 ???var map = new BMap.Map("l-map"); ???????????// 创建Map实例 ???map.centerAndZoom(new BMap.Point(116, 39.915), 16); ???var local = new BMap.LocalSearch(map, { ???????renderOptions: {map: map, panel: "r-result"} ???}); ???local.search("餐饮");</script>

html5——地理位置

原文地址:https://www.cnblogs.com/wuqiuxue/p/8116719.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved