自定义标记未在地图上正确设置，请单击“角度”和“地图框”

Question

在此示例中，每次我单击地图时都会创建一个新标记。但是，虽然第一个标记大约在正确的位置，但其他标记似乎偏离（降低）了标记图像的高度。

在下图中，我每次都单击完全相同的位置。

e是事件，似乎每次都返回相同的坐标。当我应用CSS类时，我将位置设置为绝对，但没有成功。

setMarkers（e）{     console.log（e）;

this.markerLat = e.lngLat.lat;
this.markerLng = e.lngLat.lng;

     var el = document.createElement('div');         

     el.style.backgroundImage = 'url("http://localhost:4200/assets/leaflet/images/marker-icon.png")';
     el.style.width = '25px'; 
     el.style.height = '41px'; 

     new mapboxgl.Marker(el)
         .setLngLat([this.markerLng, this.markerLat])
         .addTo(this.map);

}