view updating status stuck on true

551
5
10-31-2019 12:41 PM
CalebSchwind
New Contributor II

I'm trying to display a loading spinner over my map by watching the updating status on the view. Sometimes this value is stuck on true, so the loading spinner never goes away. I've also noticed that when this happens the loading bar in the layer list widget never goes away either. The network tab in Chrome doesn't show any pending requests.

I am using version 4.13 of the JavaScript API and the feature layers are on version 10.51.

Below is some pseudo code. I've looked at the updating status of each layer view in the group layer and it is random as to which one gets stuck on true (sometimes it's more than one that gets stuck on true). 

const pointsLayer = new FeatureLayer({

  url: waterbodyService.points,
  definitionExpression: filter,
  outFields: ['*'],
  renderer: pointsRenderer,
  popupTemplate,

});

const linesLayer = new FeatureLayer({

  url: waterbodyService.lines,
  definitionExpression: filter,
  outFields: ['*'],
  renderer: linesRenderer,
  popupTemplate,

});

const areasLayer = new FeatureLayer({

  url: waterbodyService.areas,
  definitionExpression: filter,
  outFields: ['*'],
  renderer: areasRenderer,
  popupTemplate,

});

const waterbodyLayer = new GroupLayer({
id: 'waterbodyLayer',
title: 'Waterbodies',
listMode: 'hide',
visible: false,
});
waterbodyLayer.addMany([areasLayer, linesLayer, pointsLayer]);

var map = new Map({
   basemap: "gray"

   layers: [waterbodyLayer],
});

var mapView = new MapView({
  container: "viewDiv",
  map: map,
  center: [-117.98118, 34.00679],
  zoom: 10
});

watchUtils.whenTrue(mapView , 'updating', (updating) => {
   console.log('whenTrue: ', updating);
   if (!mapView .interacting) setMapLoading(true); // turn off loading spinner
});

watchUtils.whenFalse(mapView , 'updating', (updating) => {
   console.log('whenFalse: ', updating);
   setMapLoading(false); // turn off loading spinner
});

0 Kudos
5 Replies
Noah-Sager
Esri Regular Contributor

Hi Caleb, sorry to hear about the trouble. I tried to make a similar app, but could not reproduce the issue. Is there any commonality, like it only happens at home or at work, or on a certain wifi network, that makes it easier to reproduce? And if you remove the spinner part, do the console.log statements still follow the same pattern?

test app to repro

https://codepen.io/noash/pen/BaaJpNq 

0 Kudos
CalebSchwind
New Contributor II

Hi Noah,

The console.log statements do follow the same pattern. I will get a true saying the layers are loading, but I never get the false saying the layers finished loading. 

I modified your codepen to use feature layers, 4.13 API and added logic for zooming into the extent of the features. It looks like my zoom logic is what is causing the infinite loading spinner issue. This issue is intermittent, so you may need to refresh the page a few times. Is there a better way of zooming to the extent of all of the features that doesn't have this issue?

https://codepen.io/cschwind/pen/LYYQrmE 

0 Kudos
Noah-Sager
Esri Regular Contributor

Looking at the codepen, I see that when the app hangs, there are some requests pending to the firestore.googleapis.com, which may or may not be related to codepen itself.

One idea is to wait for the layer to be ready instead of waiting for the view to be ready, like in this example:

ArcGIS API for JavaScript Sandbox 

featureLayer.when(function() {
   featureLayer.definitionExpression = createDefinitionExpression("");
   zoomToLayer(featureLayer);
});

0 Kudos
CalebSchwind
New Contributor II

I updated my codepen (https://codepen.io/cschwind/pen/LYYQrmE ) to check the layers prior to zooming and I'm still seeing the same issue. 

0 Kudos
Noah-Sager
Esri Regular Contributor

I tried your latest codepen a bunch of times, and it worked fine for me every time. Sorry, not sure what else to suggest. If you have the ability, I would recommend contacting Esri Support and see if they are better able to reproduce the issue.

Esri Support Contact Support 

0 Kudos