Select to view content in your preferred language

Incorrect popup location when zooming in

817
1
11-24-2020 11:21 PM
ChrisShaw
Emerging Contributor

We have popup precisely tied to feature location by tracking view.on(click) event and setting popup location like so:

this.view.popup.open({
features: response.results[0].graphic,
location: response.results[0].graphic.geometry
});

ChrisShaw_1-1606288666043.png

However, when zooming in manually or clicking Zoom to in the popup the resulting popup drifts to incorrect location.

 

ChrisShaw_0-1606288805126.png

This issue is present in official demos as well (at least when zooming in with scroll wheel). In some demos when clicking Zoom to the popup snaps back to correct location.

We are using version 4.16

0 Kudos
1 Reply
bmanghi
Occasional Contributor

I've had initial success with using a FeatureLayer to query a point's geometry, manually setting the returned geometry as the popup's features. Then watching the view's scale and resetting the popup's location property using the popup's selectedFeature property. I also added a function to offset the popup anchor if you're using a symbol with a yoffset.

const createOffsetGeom = (args) => {
  const { geometry, yoffset = 0, xoffset = 0 } = args;
  const screenPoint = view.toScreen(geometry);
  let offsetGeom = {};
  screenPoint.y = screenPoint.y + yoffset;
  screenPoint.x = screenPoint.x + xoffset;
  offsetGeom = view.toMap(screenPoint)
  return { latitude: offsetGeom.latitude, longitude: offsetGeom.longitude };
};
view.watch("scale", (scale) => {
  if (view.popup.visible) {
    view.popup.location = createOffsetGeom({ geometry: 
    view.popup.selectedFeature.geometry, yoffset: -18 });
  }
});

It seems the geometry returned with hitTest is more generalized when you click on the map at smaller scale.

 

0 Kudos