Popup vs PopupMobile

421
6
Jump to solution
02-26-2019 03:45 AM
IanBridger
New Contributor II

Hi

I have a GraphicsLayer, and want the user to click on shapes in that layer to display information that I only hold locally. I am using the Map.infoWindow object for the popup so that it is identical to the ESRI standard infoWindow.

When the size of the map is bigger than the "mobileBreakPoint" URL parameter (default 600px) then Map.infoWIndow is an instance of Popup, and when it's below that threshold then it's a PopupMobile, but the documentation says they share a common API and should therefore be interchangeable as far as my code is concerned.

However the Popup displays my HTML content flawlessly, but the PopupMobile opens with no content, it's empty. This is true even if the content is a simple string, ie "test".

Here's my code:

myLayer.on("click", lang.hitch(this, function (evt) {
  evt.stopPropagation();
  var iw = this.Map.infoWindow;
  iw.setFeatures([evt.graphic]);
  iw.setContent(myHTMLContent);
  iw.show(evt.mapPoint);
}));

I've attached a couple of images, infoWindow01 shows Popup working with "test" for content, and infoWIndow02 shows PopupMobile not working, all I did was shrink the map window between snapshots.

Many thanks!

Tags (2)
0 Kudos
1 Solution

Accepted Solutions
RobertScheitlin__GISP
MVP Esteemed Contributor

Ian,

  Here is what works for both popups:

      myLayer.on("click", lang.hitch(this, function (evt) {
        evt.stopPropagation();
        var iw = this.map.infoWindow;
        var infoTemplate = new InfoTemplate();
        infoTemplate.setTitle("Hello World");
        infoTemplate.setContent("Test");
        evt.graphic.setInfoTemplate(infoTemplate);
        iw.setFeatures([evt.graphic]);
        iw.show(evt.mapPoint);
      }));

for some reason the mobile popup wants the graphic to have an InfoTemplate.

View solution in original post

6 Replies
RobertScheitlin__GISP
MVP Esteemed Contributor

Ian,

   Is this a Web App Builder application?

0 Kudos
IanBridger
New Contributor II

Hi Robert

Yes, I forgot to say, it's Web App Builder. It's an ArcGIS Portal Web App, 10.6.1 with JS 3.27.

Thanks!

Ian

0 Kudos
RobertScheitlin__GISP
MVP Esteemed Contributor

Ian,

  Hmm. Normally you do one or the other. setFeatures or setContent, not both. Set features uses the features (graphics) infoTemplate or popupTemplate to define the content of the popup, where as the setContent does not even need a feature associated with the popup it is just showing some info based on the content provided.

0 Kudos
IanBridger
New Contributor II

Thanks Robert - I did try that, and found that setFeatures connects the popup and layer/features, and then controls highlighting them while it's on the screen, and so on. But I also need to use setContent because the values I need to display inside the popup which are not attributes of the shape or held in the Portal yet, they're local in the browser. In fact, the shapes themselves are local too, someone has drawn them but nothing has been saved yet. If I leave out setContent, the Popup is empty as well as the PopupMobile.

0 Kudos
RobertScheitlin__GISP
MVP Esteemed Contributor

Ian,

  Here is what works for both popups:

      myLayer.on("click", lang.hitch(this, function (evt) {
        evt.stopPropagation();
        var iw = this.map.infoWindow;
        var infoTemplate = new InfoTemplate();
        infoTemplate.setTitle("Hello World");
        infoTemplate.setContent("Test");
        evt.graphic.setInfoTemplate(infoTemplate);
        iw.setFeatures([evt.graphic]);
        iw.show(evt.mapPoint);
      }));

for some reason the mobile popup wants the graphic to have an InfoTemplate.

IanBridger
New Contributor II

Thank you Robert, very much appreciated for the fast response!

0 Kudos