mapbox angular9中的逆向地理编码
mapbox angular9中的逆向地理编码
提问于 2020-05-08 17:20:02
我已经在角度上实现了mapbox的概念，我还在地图中添加了确定当前location.As的标记，现在iam通过json file.Now给出了硬编码的当前位置(以及纬度和经度)我实际上想要确定当前位置，即我想通过给出纬度和经度作为inputs.How来实现反向地理编码概念？
我正在编写的当前代码如下所示：
import { Component, OnDestroy, AfterViewInit, OnInit } from '@angular/core';
import { NavigationControl, Map } from 'mapbox-gl';
import {ActivatedRoute, Router,ParamMap } from '@angular/router';
import { environment } from 'src/environments/environment';
import * as mapbox from 'mapbox-gl';
(mapbox as any).accessToken = environment.mapbox.accessToken
@Component({
selector: 'app-dashboard',
templateUrl: './dashboard.component.html',
styleUrls: ['./dashboard.component.css'],
})
export class DashboardComponent implements OnInit,AfterViewInit {
latlng:any;
constructor(private route:ActivatedRoute,
private router:Router)
{
this.loadMap();
}
ngOnInit() {
}
ngAfterViewInit(){
}
loadMap(){
var latitude=this.latitude;
var longitude=this.longitude;
this.latlng=[longitude,latitude]
var map1=new Map(
{
container:'map',
style: 'mapbox://styles/mapbox/streets-v11',
center: { lng: longitude, lat: latitude },
zoom: 9,
pitch: 20,
attributionControl: false
});
map1.addControl(
new NavigationControl({
showZoom: true,
showCompass: true
}),
'top-right'
);
var el = document.createElement('div');
el.style.backgroundImage = "url('../../assets/images/truck.png')";
el.style.backgroundSize='cover';
el.style.width = '50px';
el.style.height = '50px';
el.style.marginTop='-35px'
el.style.cursor='pointer';
new mapbox.Marker(el)
.setLngLat(this.latlng)
.setPopup(new mapbox.Popup({offset:25})
.setHTML('<p>'+this.orderItem.current_location+'</p>'))
.addTo(map1);
}
}回答 1
Stack Overflow用户
发布于 2020-05-08 17:58:14
您可以使用地理位置控件检索当前位置：
navigator.geolocation.getCurrentPosition(success, error, options);
您必须使用选项调用它，如下所示：
var options = {
enableHighAccuracy: true,
timeout: 5000,
maximumAge: 0
};
您必须实现错误和成功回调：
function error(err) {
console.warn(`ERROR(${err.code}): ${err.message}`);
}
如果成功，您可以使用返回的坐标。例如，您可以在反向地理编码请求中使用它们。
function success(pos) {
var crd = pos.coords;
console.log('Your current position is:');
console.log(`Latitude : ${crd.latitude}`);
console.log(`Longitude: ${crd.longitude}`);
console.log(`More or less ${crd.accuracy} meters.`);
}
另请参阅此文档：
https://developer.mozilla.org/en-US/docs/Web/API/Geolocation/getCurrentPosition
如果有什么不清楚的地方，请告诉我！
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/61675911
复制相关文章
相似问题
腾讯云开发者
