mapbox blurry popup

Solutions on MaxInterview for mapbox blurry popup by the best coders in the world

showing results for - "mapbox blurry popup"
Esteban
01 Mar 2020
1// Fix blurry mapbox popups due to transforms on non-even height & width element
2// 1. Add class to popup when set with marker
3new mapboxgl.Marker()
4	.setLngLat([obj.lng,obj.lat])
5	.setPopup(new mapboxgl.Popup({ 
6  		offset: 25, maxWidth: '240px', className: 'makeMeEven' 
7	})
8	.setHTML(html)
9	.addTo(map);
10              
11// 2. Using JQuery to make height & width even on map's mouseup event
12map.on('mouseup', function(e) {
13	setTimeout(function(){ // Slight delay to allow popup to be added to DOM
14		$(".makeMeEven").each(function(){
15			$(this).width(Math.round($(this).width()/2)*2);
16			$(this).height(Math.round($(this).height()/2)*2);
17		});
18	}, 1);
19});