MAPBOX导航控制缩放进出



我已成功地将导航控件添加到我的地图中,但是这些按钮是空白的,没有任何一个。我可以使用另一种选择将" "或" - "放在它们上。这是我用来创建导航控件的代码。

this.map = new MapboxGL.Map(mapOptions);
var nav = new mapboxgl.NavigationControl();
map.addControl(nav, 'top-right');

我使用Mapbox传单的Zoomintext和Zoomintitle看到了类似的示例。我可以在Mapbox GL中使用类似的东西吗?

您可以提供任何错误或其他代码,以帮助我们确定问题到底是什么。

导航控制通常非常简单,如下所示

当您检查元素时,您会看到课程吗?

.mapboxgl-ctrl-icon.mapboxgl-ctrl-zoom-in

该类应具有" "的背景图像。

如果您看不到它,则必须包括CSS。

我在Angular2实施时面临类似的问题,但是正如Lucas-Wojciechowski指出的那样,包括Mapbox-Gl.css将解决该问题。

<link href='https://api.tiles.mapbox.com/mapbox-gl-js/v0.32.1/mapbox-gl.css' rel='stylesheet' />

在我的情况下,导航控件和北箭头按钮为空白,全屏按钮仅以错误的颜色部分可见。问题是一个旧的CSS文件。通过将版本编号从1.4.1更改。到1.7.0一切都已纠正!

<link href="https://api.mapbox.com/mapbox-gl-js/v1.7.0/mapbox-gl.css" rel="stylesheet" />

最新更新