Mapbox GL-我的基本默认标记不会显示在地图上 [英] Mapbox GL - my basic, default marker won´t show up on the map
问题描述
最近,我开始摆弄MapBox,现在,我正在尝试将标记添加到地图.并不像看起来那么容易.我正在尝试添加基本的默认标记,并直接从"Mapbox GL"参考指南.不过,它不会显示.
lately, I started fiddling with MapBox and right now, I am trying to add the marker to the map. Not as easy as it seems. I am trying to add basic, default marker with code copypasted straight out of "Mapbox GL" reference guide. Still, it won´t show up.
这是我使用的代码,这简直无法实现...
This is the code I use, it cant get simpler that this...
var marker = new mapboxgl.Marker().setLngLat([45.702117, 42.395926]).addTo(map);
有人知道为什么它不起作用吗?整个不可行方案"可以在 http://www.caucasus-trekking.com/上看到地图/地图
Does anybody have an idea why it doesnt work? Whole "not working scenario" can be seen at http://www.caucasus-trekking.com/Maps/map
具体来说,我想使用该经典标记,其顶部为圆形,底部为尖头.这样的代码- https://www.mapbox.com/help/img/android/marker-example.png
Specifically, I would like to use that classic marker, round at the top and pointy at the bottom. Somjething like this - https://www.mapbox.com/help/img/android/marker-example.png
Mapbox中是否存在一些默认形状,还是应该由我自己的CSS文件创建它?
Wasnt there some default shape in Mapbox or should I create it by my own css file?
非常感谢
推荐答案
有些奇怪,似乎答案是正在绘制标记,但mapbox-gl.css中没有包含任何样式以使其实际可见.这只是一个看不见的div.
Somewhat strangely, it appears that the answer is that the Marker is being drawn, but there is no styling included in mapbox-gl.css to actually make it visible. It's just an invisible div.
因此您需要添加一些CSS:
So you need to add some CSS:
.mapboxgl-marker {
width: 25px;
height: 25px;
border-radius: 50%;
border:1px solid gray;
background-color:lightblue;
}
请参阅codepen: https://codepen.io/stevebennett/pen/VpPbbM
See codepen: https://codepen.io/stevebennett/pen/VpPbbM
这篇关于Mapbox GL-我的基本默认标记不会显示在地图上的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!