我用 angular 9 和 mapbox gl 创建了一个项目。我的地理编码器有问题,当我搜索地点时一切正常,但我尝试在地理编码器结果之后设置一个点,如下所示:https ://docs.mapbox.com/mapbox-gl-js/example/point-from- geocoder-result/ 我也这样做,但没有出现标记。
这是我初始化地图并添加地理编码器的代码:
import {Component, OnInit} from '@angular/core';
import {FormBuilder, FormGroup} from '@angular/forms';
import {UserService} from '../../../user/service/user.service';
import * as MapboxGeocoder from '@mapbox/mapbox-gl-geocoder';
import * as mapboxgl from 'mapbox-gl/dist/mapbox-gl';
import {environment} from '../../../../../environments/environment';
@Component({
selector: 'app-add-sport-ad',
templateUrl: './add-sport-ad.component.html',
styleUrls: ['./add-sport-ad.component.scss']
})
export class AddSportAdComponent implements OnInit {
form: FormGroup;
map: mapboxgl.Map;
style = 'mapbox://styles/mapbox/streets-v11';
lat = 37.75;
lng = -122.41;
constructor(private fb: FormBuilder, public userService: UserService) {
}
ngOnInit() {
this.initForm();
mapboxgl.accessToken = environment.mapbox.accessToken;
this.map = new mapboxgl.Map({
container: 'map',
style: this.style,
zoom: 13,
center: [this.lng, this.lat]
});
const geocoder = new MapboxGeocoder({
accessToken: mapboxgl.accessToken,
marker: {
color: 'orange'
},
mapboxgl
});
this.map.addControl(geocoder);
this.map.addControl(new mapboxgl.NavigationControl());
}
}
如果有人可以帮助我,非常感谢:)