HOW TO
In a web map, a pop-up is associated with the infoWindow class and is often used to display information about a selected feature. Often, the pop-up has no distinct size, as this property is not initially programmed within the script. For more information on pop-ups, refer to ArcGIS API for JavaScript: Class: Popup
The instructions provided describe how to change the size of a pop-up in ArcGIS API for JavaScript.
There are two ways to customize the size of a pop-up window in a web map. Choose one of the following methods to customize or set the pop-up window to a definite size.
Set the pop-up window to a definite size
Edit the MapManager.js file in the user app folder (install DIR\server\apps\userApp\jimu.js), by inserting the following line at the end of the resetInfoWindow: function() of the script.
this.map.infoWindow.resize(360,280);
Note: Refresh the web app to save the changes.
The following images illustrate the different sizes of the default and customized pop-up windows.
Image of the default pop-up window.
Image of the customized pop-up window.
Set the pop-up window to fit the size of the content automatically
Edit the jimu.css file in the app folder (install DIR\server\apps\userApp\jimu.js\css), and add the .esriPopup function in the styles pane, as shown in the following code snippet.
.esriPopup.light .esriPopupWrapper { position: initial!important; } .esriPopup .sizer { position: initial !important; width: 100% !important; }
The following image illustrates the effect of the code on the size of the pop-up window.
Article ID: 000014327
Get help from ArcGIS experts
Download the Esri Support App