【发布时间】:2021-03-10 10:41:23
【问题描述】:
我正在尝试将我上传到工作室的自定义 mapbox 样式加载到我的 Angular 应用程序中。它可以完美地使用另一种风格,即工厂地图框风格(即mapbox://styles/mapbox/streets-v11)和我的另一种自定义风格。但是由于某些原因,在尝试加载this particular style:mapbox://styles/elpierrot/ckl0qlk1q0skq17s0x0hhjli3时,
nothing gets displayed on the map。
尝试加载此样式时,控制台会为我提供those errors,并且在加载任何其他样式时不会出现。
我不明白的是,当我尝试将它加载到 jsfiddle 中时,it displays properly。我也可以毫无问题地在 mapbox studio 中可视化样式。
代码如下:
import { Map, LngLat, Marker } from 'mapbox-gl';
@Component({
selector: 'app-asset-edition',
templateUrl: './asset-edition.component.html',
styleUrls: ['./asset-edition.component.scss']
})
export class AssetEditionComponent implements OnInit {
// Map
map: Map;
mapStyle: string = 'mapbox://styles/elpierrot/ckl0qlk1q0skq17s0x0hhjli3';
mapCenter: LngLat | null;
mapBounds: Array<LngLat> | null;
coords: LngLat | null;
constructor() {}
ngOnInit() {
this.coords = new LngLat(-65.017, -16.457);
this.mapCenter = this.coords;
}
}
<div>
...
<mgl-map [style]="mapStyle" [zoom]="[7]" [center]="mapCenter" [fitBounds]="mapBounds"
(load)="map = $event">
</mgl-map>
...
</div>
这是地图框的问题吗?样式层有问题吗? (如果需要,我可以显示我的确切代码,但由于它适用于另一种风格,所以看起来很奇怪)。
【问题讨论】:
-
您附加的错误图像和控制台中的第一个错误显示您使用了错误的表达式(未知的表达式图像..)。先修好了。
-
嗯,这就是我想做的。问题是错误似乎不是直接源自我的代码,我没有
image表达式,并且堆栈跟踪报告它来自 mapbox,我无法获得任何关于在我的代码中触发它的信息.
标签: angular typescript mapbox mapbox-gl-js mapbox-gl