javascript map periodically fails to load

1240
8
Jump to solution
07-30-2014 06:22 AM
SandraDema
New Contributor

I am using asp.net along with JavaScript to develop a webpage that will display a map,

Basically, I am loading an image service and a map service, selecting a feature and zooming to that feature.  The code works about 90% of the time. When it does fail, it will load the map service and zoom to the proper extent, but it DOES NOT load the image service or select a feature.

It appears the instigator either the query or the or the feature selection - if I remove the call to doMaps(), the code never fails.

Does anyone have any experience in this area?

I have attached two images as examples.  This is the code I am using:          

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head >

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">

    <title></title>

    <script src="http://js.arcgis.com/3.7/" type="text/javascript"></script>

   <script>

       var MN, ParcelMap, sfs, queryTask;

       var featurelayer;

        require(["esri/map","dojo/on","dojo/parser","esri/layers/ArcGISDynamicMapServiceLayer","esri/layers/ArcGISImageServiceLayer","esri/renderers/SimpleRenderer","dojo/_base/connect","dojo/dom","dojo/query","esri/graphic","esri/layers/FeatureLayer","dojo/domReady!"],

        function (Map, on, parser, ArcGISDynamicMapServiceLayer, ArcGISImageServiceLayer, SimpleRenderer, connect, dom, query, Graphic, FeatureLayer) {

                 

            parser.parse();

          

            queryTask = new esri.tasks.QueryTask("http://MapServer/2");

            MN = "5"

            //define maps

            ParcelMap = new esri.Map("ParcelMap");

            var layer1 = new esri.layers.ArcGISImageServiceLayer("http://ImageServer");

            ParcelMap.addLayer(layer1);

            var layer2 = new esri.layers.ArcGISDynamicMapServiceLayer("http:///MapServer");

            ParcelMap.addLayer(layer2);

            ParcelMap.on("load", doMaps());

          

            function doMaps() {

                sfs = new esri.symbol.SimpleFillSymbol(esri.symbol.SimpleFillSymbol.STYLE_NULL, new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID, new dojo.Color([0, 255, 255]), 2));

                //create selection layer

                featureLayer = new esri.layers.FeatureLayer("http://MapServer/2", {

                    mode: esri.layers.FeatureLayer.MODE_SELECTION

                })

                featureLayer.setSelectionSymbol(sfs);

                //add selection layer to map

                ParcelMap.addLayers([featureLayer]);

                //set up query

                query = new esri.tasks.Query();

                query.returnGeometry = true;

                query.where = "MAP_NO = '" + MN + "'";

                //select parcel

                featureLayer.selectFeatures(query, esri.layers.FeatureLayer.SELECTION_NEW, function (features) {

                    if (features.length == 0) {

                        alert("No Parcel Found");

                    }

                    else {

                        //zoom to the selected feature

                        parcelExtent = features[0].geometry.getExtent().expand(1.5);

                        ParcelMap.setExtent(parcelExtent);

                   }

                });

            }

        });

    </script>

  </head>

<body class="tundra">

    <form id="form1" runat="server">

        <div id="ParcelMap" style="width:400px; height:400px;runat="server"></div>

    </form>

</body>

</html>

0 Kudos
1 Solution

Accepted Solutions
ReneRubalcava
Frequent Contributor

Instead of waiting for the load event, you may want to try adding both layers with the map.addLayers method and waiting for the layers-add-result event.

So something like:

map.on('layers-add-result', doMaps);

map.addLayers([layer1, layer2]);

If you look at the docs for the load event, it fires when the first basemap is added to the map, so there is no guarantee that those layer1 and layer2 services are ready when doMaps fires using the load event. It may work, it may not, but it's worth a shot.

It looks like you are also using the addLayers in the doMaps method, which you don't really need to, but it would be good practice to use on.once to launch that method only once, so you could do:

on.once(map, 'layers-add-result', doMaps);

If not, you'll probably run into an endless loop since doMaps will fire the event again and launch again, and again, and again, ha.

View solution in original post

8 Replies
RobertScheitlin__GISP
MVP Esteemed Contributor

Sandra,

    Have you used the developer tools in FireFox or Chrome or IE to see with there is some http traffic error that will give you a further clue to this intermittent error?

0 Kudos
SandraDema
New Contributor

Firebug is not showing any errors, so unfortunately no help there.

0 Kudos
RobertScheitlin__GISP
MVP Esteemed Contributor

So there is no 400 type errors in the net traffic? Strange... I would expect to see something in the console.

0 Kudos
SandraDema
New Contributor

No. Everything is either 200 or 304 not modified.

0 Kudos
RobertScheitlin__GISP
MVP Esteemed Contributor

I would try Rene's suggestion as it is likely a timing issue than.

0 Kudos
ReneRubalcava
Frequent Contributor

Instead of waiting for the load event, you may want to try adding both layers with the map.addLayers method and waiting for the layers-add-result event.

So something like:

map.on('layers-add-result', doMaps);

map.addLayers([layer1, layer2]);

If you look at the docs for the load event, it fires when the first basemap is added to the map, so there is no guarantee that those layer1 and layer2 services are ready when doMaps fires using the load event. It may work, it may not, but it's worth a shot.

It looks like you are also using the addLayers in the doMaps method, which you don't really need to, but it would be good practice to use on.once to launch that method only once, so you could do:

on.once(map, 'layers-add-result', doMaps);

If not, you'll probably run into an endless loop since doMaps will fire the event again and launch again, and again, and again, ha.

View solution in original post

KellyHutchins
Esri Frequent Contributor

Along with Rene's suggestion you might also want to try running the code using the latest version of the JSAPI to see if additional error messages are displayed in the console. Starting at version 3.9 of the api we enabled a configuration option called useDeferredInstrumentation so that errors that happen during the lifecycle of a deferred are reported. Prior to 3.9 this option was disabled and these errors were not displayed.

In Firebug you can also try enabling 'Break on All Errors'. Doing on this will cause the app to pause on all errors. This may help you diagnose the issues with your app.

0 Kudos
SandraDema
New Contributor

Rene's suggestion was spot on - it was most definitely a timing issue. I was able to use that code and got everything working again. Thanks so much to all who contributed.

0 Kudos