topic Re: Popup focus in ArcGIS JavaScript Maps SDK Questions

Popup focus

MathewSuran — Fri, 10 Mar 2017 14:46:06 GMT

I have a point feature that when clicked on, generates a popup with a graphic. The graphic is rather large so the whole popup is always cut off. I looked through the documentation and I am not really sure on what to call it so I don't really know what I am looking for, but I am looking to have the map resize to automatically when a popup is active to be able to refocus on the popup to show the whole thing. Anyone have any idea?

Re: Popup focus

RobertScheitlin__GISP — Fri, 10 Mar 2017 15:48:04 GMT

Mathew,

You can use the Popup objects reposition method that is specifically designed for that:

https://developers.arcgis.com/javascript/3/jsapi/popup-amd.html#reposition

Re: Popup focus

MathewSuran — Sat, 11 Dec 2021 17:14:31 GMT

Ok, thanks. How would this work for a PopupTemplate? See example below:

currentLayer.on("click", function(evt) {

console.log(evt);
 featureId= evt.graphic.attributes.OBJECTID;
 currentLayer.queryAttachmentInfos(featureId, function(attach) {
 featureUrl=attach[0].url;
 currenttemplate = new PopupTemplate({
 title: "Current",
 fieldInfos: [{
 fieldName: "Name",
 label: "Name: ",
 visible: true
 },{
 fieldName: "X",
 label: "X: ",
 visible: true
 },{
 fieldName: "Y",
 label: "Y: ",
 visible: true
 }],
 mediaInfos:[{ //define the image
 "title": "",
 "caption": "",
 "type":"image",
 "value":{
 "sourceURL": featureUrl
 }
 }]
 });
 currentLayer.infoTemplate=currenttemplate;
 },
 function(errback) {
 console.log(errback);
 });
 });‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Re: Popup focus

RobertScheitlin__GISP — Fri, 10 Mar 2017 16:14:06 GMT

Mathew,

For that you will have to attach and event to the Popups show event and then call the repostion method.

Re: Popup focus

MathewSuran — Fri, 10 Mar 2017 16:23:43 GMT

Would you be able to provide an example?

Re: Popup focus

RobertScheitlin__GISP — Sat, 11 Dec 2021 17:14:33 GMT

Mathew,

Something like:

map.infoWindow.on("show", function(){
  setTimeout(function(){
    map.infoWindow.reposition();
  }, 500);
});‍‍‍‍‍

Re: Popup focus

MathewSuran — Fri, 10 Mar 2017 21:23:23 GMT

Maybe I am not placing it in the correct position, but it is not working. I would want to place this after the layers and templates get loaded, correct?

Re: Popup focus

JimNoel — Wed, 26 Apr 2017 02:22:31 GMT

Can you give an example for how to do the same in 4.3? There doesn't seem to be a "show" event for the 4.3 Popup class. Is this accessed in a different way?

Re: Popup focus

RobertScheitlin__GISP — Wed, 26 Apr 2017 02:43:34 GMT

Jim,

In 4.x API you would watch the view.popup.visible property

Re: Popup focus

ThomasSolow — Wed, 26 Apr 2017 12:53:26 GMT

If you want to resize the map when the popup is opened, watching the visible property and manually resizing the map div sounds like a good bet.

Another thing to look at would be modifying the pop-up's size via CSS. You can use dev tools to inspect the pop-up and see what classes are on it and then add some CSS to your project targeting those classes to override the esri CSS file.

Docking the popup might also help in 4.XX.

Re: Popup focus

JimNoel — Fri, 28 Apr 2017 19:56:23 GMT

So my problem is actually a little different from Mathew's. If the point feature is close to the edge of the display so that the popup in its original position extends beyond the display, the map pans to fit the popup. I want to keep the original map extent, and move the popup to fit the current extent. (If it makes a difference, the popup is triggered by a mouseover rather than a mouse click, using MapView.hitTest)

I tried watching the view.popup.visible property and using the reposition method in the callback, but that didn't work.

Question: Will the callback function for view.popup.visible come up before the map extent changes?

Alternatively, is there some other setting I can use to prevent the map extent from changing? Thanks.