【MAPBOX基础功能】30、mapbox地图基础工具 - 将360度范围内的经纬度转换为180度范围

前言

官网指引，生成accesstoken，下载相关依赖请翻阅[https://blog.csdn.net/weixin_44402694/article/details/125414381?spm=1001.2014.3001.5501](https://blog.csdn.net/weixin_44402694/article/details/125414381?spm=1001.2014.3001.5501)
本文使用官网accesstoken，请自行生成私人token
mapbox地图基础工具 - 将360度范围内的经纬度转换为180度范围

效果

代码实现

<!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>30、地图工具 - 将360度范围的经纬度转为180度范围</title><linkhref="https://api.mapbox.com/mapbox-gl-js/v2.7.0/mapbox-gl.css"rel="stylesheet"/><script src="https://api.mapbox.com/mapbox-gl-js/v2.7.0/mapbox-gl.js"></script><style>* {padding: 0;margin: 0;list-style: none;text-decoration: none;}html,body {width: 100%;height: 100%;}#map {width: 100%;height: 100%;}.btn-list {position: fixed;top: 100px;left: 100px;cursor: pointer;}</style></head><body><div id="map"></div><ul class="btn-list"><li onclick="convert()"><button>将360度范围的经纬度转为180度范围</button></li></ul><script>mapboxgl.accessToken ='pk.eyJ1Ijoid2FuZ3Rvbmd4dWUiLCJhIjoiY2pzY3E2M2k0MDk3NzN5dDA0Nmtia2h0cCJ9.oP9fEJxOgVzm0dWGvL6tGg'const map = new mapboxgl.Map({container: 'map', // 容器 idstyle: 'mapbox://styles/mapbox/streets-v11', // mapbox底图center: [108, 35], // 初始化中心点zoom: 2, // 初始化层级})// 将360度范围的经纬度转为180度范围function convert() {const ll = new mapboxgl.LngLat(286.0251, 40.7736)console.log(ll.wrap());}</script></body>
</html>

【MAPBOX基础功能】30、mapbox地图基础工具 - 将360度范围内的经纬度转换为180度范围相关推荐

PySpark数据分析基础：PySpark基础功能及DataFrame操作基础语法详解
目录前言一.PySpark基础功能 1.Spark SQL 和DataFrame 2.Pandas API on Spark 3.Streaming 4.MLBase/MLlib 5.Spark ...
【MAPBOX基础功能】26、mapbox地图基础工具 -定位到指定的位置
前言官网指引,生成accesstoken,下载相关依赖请翻阅[https://blog.csdn.net/weixin_44402694/article/details/125414381?spm= ...
【MAPBOX基础功能】25、mapbox地图基础工具 - 缩放
前言官网指引,生成accesstoken,下载相关依赖请翻阅[https://blog.csdn.net/weixin_44402694/article/details/125414381?spm= ...
【MAPBOX基础功能】29、mapbox地图基础工具 - 获取当前地图层级
前言官网指引,生成accesstoken,下载相关依赖请翻阅[https://blog.csdn.net/weixin_44402694/article/details/125414381?spm= ...
【MAPBOX基础功能】28、mapbox地图基础工具 -获取当前地图中心点
前言官网指引,生成accesstoken,下载相关依赖请翻阅[https://blog.csdn.net/weixin_44402694/article/details/125414381?spm= ...
【MAPBOX基础功能】16、mapbox叠加图片图层到地图上
前言官网指引,生成accesstoken,下载相关依赖请翻阅[https://blog.csdn.net/weixin_44402694/article/details/125414381?spm= ...
html5地图编辑器,Tiled地图编辑器 Tiled Map Editor 的使用（一）基础功能+地形功能...
看了很久关于 Tiled Map Editor 相关资料,但是网上的东西相对太少了,多日整理之后重新写一份吧一方面是对自己学习的总结另外也是和想入门的人做个分享. 首先是官网下载地址 http:/ ...
谷歌Chrome浏览器开发者工具教程—基础功能篇
Chrome(F12开发者工具)是非常实用的开发辅助工具,对于前端开发者简直就是神器,但苦于开发者工具是英文界面,且没有中文,这让很多朋友都不知道怎么用.下载吧小编为大家带来Chrome开发者工具基础 ...
【sketchup 2021】草图大师的高级工具使用2【材质贴图应用的基础功能和高级使用与实战演练（给地砖调整尺寸、转贴贴图圆柱为例、投影贴图百叶窗为例】
文章目录不透明度.填充材质材质贴图应用基础功能高级技巧别针蓝色别针[平行四边形别针] 红色别针[移动别针] 黄色别针[梯形别针] 绿色别针[旋转缩放别针] 别针位置调整重设镜像设置旋 ...

【MAPBOX基础功能】30、mapbox地图基础工具 - 将360度范围内的经纬度转换为180度范围

前言

效果

代码实现

【MAPBOX基础功能】30、mapbox地图基础工具 - 将360度范围内的经纬度转换为180度范围相关推荐

最新文章

热门文章