Web AppBuilder, How can I add a loading overlay image?

[joaquinfernandez]

Hello everyone,

Please forgive my newbie question. I am still learning my way around. I've downloaded the developer version of the Web AppBuilder and installed it on my machine. I also was able to add a widget to AppBuilder. Now I would like to be able to modify the code in order to add a loading image over the map area and remove it once the map is ready. I found looking at the DOJO tutorials a possible solution but I am not sure were the CSS or code to change. Can someone point me to where or what files need to change?  I thought it may work in the Layer list widget on show Layers but don’t know if this is where I need to make the change.

Thanks in advance.

[TomSellsted]

Joaquin,

The JavaScript API has a busyIndicator module that will do the work for you.  Here is a link:

esri/dijit/util/busyIndicator | API Reference | ArcGIS API for JavaScript

Regards,

Tom

[StanMcShinsky]

Joaquin,

Are you just trying to change the existing loading gif? if so you can just replace the loading.gif in

\server\apps\<app#>\jimu.js\images

Additional loading parameters can be configured in the index.html in the main-loading div

-Stan

[joaquinfernandez]

Thank you guys for your replies,

The JavaScript API busyIndicator will work, my map has a lot of layers and gives the users the impression that it’s stuck, due to that it takes 5 to 15 seconds to render. Where can I catch any event when the map is rendered and is ready, for example after loading or they have zoomed or panned?

Thanks in advance!

[RobertScheitlin__GISP]

I will be releasing a map progress indicator widget tomorrow or first thing next week.

[RobertScheitlin__GISP · Accepted solution]

All,

   Here a Map Progress Indicator widget:

Map Progress Indicator Widget Version 1.1 - 7/3/15

[joaquinfernandez]

This is a very simple task, but the lack of documentation makes it imposable for a beginner.

Thank you.