I am building a dashboard app in WAB Dev Ed. (v2.12) for a customer. The app's web map contains customer hosted feature layers from AGOL. A point feature layer in the web map has a picture marker symbol with height and width values set, this symbology is set in ArcGIS Pro before publishing.
The app is embedded within a page in the customers Content Management System (CMS) within an iframe. The customer has a requirement that the dasboard app is not visible until the user chooses an option from the CMS page, but once selected, the dashboard should be displayed immediately. Therefore we have preloaded the dashboard app in the iframe and a div containing the iframe is set to display:hidden until the user selects the option.
The issue is that when the dashboard is displayed, the point layer cannot be seen, the legend widget also shows the layer name but no symbol. Some examination of the browser elements indicates that the point features are there, with the correct symbols but the symbol height and width is 0.
Other tests have shown that if the parent div is left visible prior to the user selecting the option, the map displays the point layer with correct symbol size (no change to the dashboard app).
Is anyone able to explain why the point feature layer symbology's size is 0 when the app is loaded into a hidden iframe or how I might go about solving this issue?
Solved! Go to Solution.
Hi, I am not sure what is the cause but possible workaround might be to either change opacity instead or to give the div absolute positioning and move it off screen to hide. Please do keep us up to date if you do find the cause.
Hi, I am not sure what is the cause but possible workaround might be to either change opacity instead or to give the div absolute positioning and move it off screen to hide. Please do keep us up to date if you do find the cause.
Hi Victor
This seems to have worked, we are having some minor issues with the page scrolling down to a nominal location but we are working through that.
Thanks for your suggestion.