Как в Leaflet убрать автофокус на отрисовываемые элементы?

Question

[survivalsuit]

Добрый день, у меня есть non-geographic карта (как пример с доков). Я с помощью promise беру с сервиса координаты полилиний в JSON и отрисовываю их. но почему-то карта делает какой-то автофокус на последнем отрисованном элементе.
Я почитал что есть некий autoPan, но это у popup-ов, так что не про мой случай. Да, я раздаю popup-ы на полилинии и полигоны которые рисую - делаю bindPopup и специально расставил везде autoPan: false. Однако это не помогает, поскольку, скорее всего, дело в другом.
Если я отрисую полилинии, потом начну рисовать полигоны-та же история, будет фокус на последнем отрисованном. Нужно как-то от этого избавиться.
Кто имел опыт?
Помогите кто чем сможет.

Comments

[freeExec]

Если просто добавить полилинию на карту, карта никуда не двигается. Или вы чего-то не договариваете или выкладывайте пример своего кода куда-то в песочницу.

[survivalsuit]

freeExec, говорю как оно есть

window.onload = function()
                    {		
			window.addEventListener('resize',function()
			{
                            map.width  = window.innerWidth;
                            map.canvas.height = window.innerHeight;                       
                        },false);  
                    };
		    var stationId = 1;                                 
                    var mapWith = 6594;
                    var mapLength = 10000; 
                    var mapMaxBounds = L.latLng(mapWith, mapLength);
                    var mapCenter = L.latLng(mapWith/2, mapLength/2);
                    var map = L.map('map', 
                                    {
                                     crs: L.CRS.Simple, 
                                     minZoom: -5, 
                                     maxZoom: 3, 
                                     zoomDelta: 0.25, 
                                     maxBounds: [[0,0], mapMaxBounds], 
                                     center: mapCenter, 
                                     zoomControl: true, 
                                     attributionControl: false
                                    }
                                   ); //renderer: L.canvas(),                    
                    var lineGroup = L.featureGroup();   
                    var lineGroupMas = [];
                    var carGroupCircle = L.featureGroup(); 
                    var carGroup = L.featureGroup(); 
                    var stationPolygonGroup = L.featureGroup();
                    var bounds = [[0,0], [mapWith, mapLength]];//границы		
                    var image = L.imageOverlay('map/electrostal10000x6594.jpg', bounds).addTo(map); //подгрузка имейджа		
                    map.fitBounds(bounds); 

                            const promiseStat = getStationPolygon();                    
                            promiseStat.then((value) => 
                                {
                                    stationPolygonGroup.addTo(map);//добавляем слой полигонов на карту
                                    if(stationId == 1)
                                        {setInterval(() => getTrInfo(lineGroupMas), 15000);};
                                    
                                });                                                    
                        });

функция getTrInfo:

async function getTrainInfo(polylinesMass){	
									let xhr = new XMLHttpRequest(); 
									xhr.open("GET", 'http://localhost:8080/DispProj/getTrInfoServlet', true);									
									xhr.responseType = "json"; 
									xhr.send();		
									xhr.onload = () => 
										{    
										if (xhr.status === 200) 
											{												
											let paths = xhr.response;
											for(var i=0; i < paths.length; i++)
												{ 	
											    carGroup.clearLayers();
												if(paths[i].locoTr.length == 0) 
													{														
													drawLocoClosestWay(
																		paths[i].locoPixelX, 
																		paths[i].locoPixelY, 
																		8, 
																		16, 
																		paths[i].locoNum, 
																		paths[i].locoID, 
																		paths[i].locoColor, 
																		paths[i].locoFillColor, 
																		paths[i].locoFillOpacity, 
																		polylinesMass
																		);	
													}
												else
													drawLocoClosestWay(
																		paths[i].locoPixelX, 
																		paths[i].locoPixelY, 
																		8, 
																		16, 
																		paths[i].locoNum, 
																		paths[i].locoID, 
																		paths[i].locoColor, 
																		paths[i].locoFillColor, 
																		paths[i].locoFillOpacity, 
																		polylinesMass
																		);	
												
												};					
											}
										else alert(`${xhr.status}: ${xhr.statusText}`);
										};
										xhr.onerror = () => {alert(`Ошибка сети. Сервер не отдал код ошибки.`);};
									}

фуцнкция drawLocoClosestWay:

function drawLocoClosestWay(x, y, carWidth, carLength, carNum, carID, colorObj, colorFillObj, colorFillOpacity, polylineMass)
	{
		let closestDotPathMas = getClosestWay(x, y, polylineMass);
        let closestLatLng = closestDotPathMas[0];
        makeCarPolygon(closestLatLng.lat, closestLatLng.lng, carWidth, carLength, carNum, carID, colorObj, colorFillObj, colorFillOpacity);
		
		return closestDotPathMas[3]; 	 	
	}

ф-я makeCarPolygon:

function makeCarPolygon(x, y, carWidth, carLangth, carNum, carID, colorObj, colorFillObj, colorFillOpacity)
	{
		let halfWidth = carWidth/2;
		let halfLangth = carLangth/2;
		var polygon = L.polygon([[x+halfWidth, y+halfLangth], 
							     [x+halfWidth, y-halfLangth], 
								 [x-halfWidth, y-halfLangth], 
								 [x-halfWidth, y+halfLangth]], 
                                {color: colorObj, fillColor: '#006400', autoPan: false, fillOpacity: 0.5}
                                       );//.addTo(map)	
		map.fitBounds(polygon.getBounds());	
		polygon.bindPopup(carNum+'', {autoPan: false}); 	
		carGroup.addLayer(polygon);
		carGroup.addTo(map);	
		carGroup.bringToFront();		
		/*polygon5.bindPopup('<p><a href="https://unpkg.com/leaflet@1.6.0/dist/leaflet.js" target="_blank"> Hello world!<br />This is a nice popup.</a></p>');*/	
	};

[survivalsuit]

Загвоздка может быть в последних двух функциях? там соответственно все прорисовывается

[survivalsuit]

Я все скинуть не могу, поскольку там данные из базы берутся, потом в java на серваке приводятся к классам, дальше сериализация в JSON, в принципе все это не надо для поиска проблемы связанной с leaflet, просто даже элементарно на песочницу не кинуть

Answer 1

[freeExec]

Ну то есть, не "оно само", а вы собственноручно
map.fitBounds(polygon.getBounds());

Comments

[survivalsuit]

Спасибо огромное! Точно! Совсем глаз замылился у меня.