Как получить координаты проецируемого объекта с бесконечным панорамированием (OpenLayers)

Question

Я создаю всплывающий элемент управления для отображения информации, когда пользователь наводит указатель мыши на элемент на определенном слое. Я хочу, чтобы всплывающее окно привязывалось к геометрии (точке) объекта и не использовало координаты положения мыши.

Проблема в том, что это нормально работает с основной функцией, однако при панорамировании одного вращения Земли влево или вправо и при наведении курсора на проектируемую функцию всплывающее окно переходит к основному объекту с исходными координатами, а не к объекту, который находится в расширенный панорамированный вид.

Это мой код:

const container = document.getElementById('popup');
const content = document.getElementById('popup-content');

var popup = new ol.Overlay({
  element: container,
  positioning: "bottom-center",
  stopEvent: false
});

map.addOverlay(popup);

map.on("pointermove", function (e) {
  if (e.dragging) {
    popup.setPosition(undefined);
    return;
  }

  const feature = map.forEachFeatureAtPixel(e.pixel,
    function (feature, layer) {
      if (layer === participantLayer) {
        return feature;
        }
    }, { hitTolerance: 10 });

    if (feature) {
      popup.setPosition(feature.getGeometry().getCoordinates());
      content.innerHTML = "...";
    } else {
       popup.setPosition(undefined);
  }
});

Я считаю, что проблема связана с использованием feature.getGeometry().getCoordinates() поскольку он возвращает только координаты фактического объекта, а не спроецированные. Есть ли способ вернуть пиксельные координаты местоположения геометрии проецируемого объекта?

Answer 1

let featureCoords = feature.getGeometry().getCoordinates();  
const projWidth = ol.extent.getWidth(map.getView().getProjection().getExtent());  
const worldsAway = Math.round(e.coordinate[0] / projWidth);  
featureCoords[0] = featureCoords[0] + worldsAway * projWidth;  
popup.setPosition(featureCoords);   

Дайте это попробовать.