4

I'm trying to zoom to layer automatically as soon as the map finishes loading using the guide here. To be clear, I'm only loading one layer and just want to zoom in on one of the layers provided by the service.

js script

dojo.require("dijit.layout.BorderContainer");
dojo.require("dijit.layout.ContentPane");
dojo.require("esri.map");
dojo.require("esri.renderer");
dojo.require("esri.graphic");
dojo.require("esri.dijit.Legend");
dojo.require("esri.utils");

dojo.require("dijit.layout.AccordionContainer");
dojo.require("esri.layers.FeatureLayer");

var map;
var basemap;
var trafficmap;
var basemapServiceSource;
var featuremapServiceSource;
var trafficServiceSource;
var renderer;
var loading;

function init() {

    // for now, these are referring to a single source
    basemapServiceSource = "http://co-gis-01/ArcGIS/rest/services/dev_RTIA/rtia/MapServer";

    //Add the topographic layer to the map. View the ArcGIS Online site for services http://arcgisonline/home/search.html?t=content&f=typekeywords:service          
    basemap = new esri.layers.ArcGISDynamicMapServiceLayer(basemapServiceSource);
    basemap.setVisibleLayers([0, 1, 2, 4, 5, 6]);

    map = new esri.Map("map", {

            // remove logo
            logo:false
        });

    //loading image. id
    loading = dojo.byId("loadingImg");
    dojo.connect(map,"onUpdateStart",showLoading);
    dojo.connect(map,"onUpdateEnd",hideLoading);

    /*
        IDs of Layers for http://co-gis-01/ArcGIS/rest/services/dev_ExIS/exis/MapServer
            Site Name (0)
            Section ID (1)
            AADT some (2)
            AADT all (3)
            AdministrativeAreas_CongressionalDistricts (4)
            AdministrativeAreas_Provinces (5)
            AdministrativeAreas_Regions (6)
    */
    map.addLayer(basemap);

    // executes function on onLoad event
    dojo.connect(map, 'onLoad', function(theMap) { 

        dojo.connect(dijit.byId('map'), 'resize', map,map.resize);
        zoomToLayer();
    });
}


function zoomToLayer() {

    var requestHandle = esri.request({
        url: "http://co-gis-01/ArcGIS/rest/services/dev_RTIA/rtia/MapServer/2",
        content: { f:"json" },
        callbackParamName: "callback"
    });

    requestHandle.then(requestSucceeded, requestFailed);
}

function requestSucceeded(response, io) {

    var extent = new esri.geometry.Extent(response.extent);
    dojo.byId("extent").innerHTML = dojo.toJson(extent.toJson());
    map.setExtent(extent);
}

function requestFailed()    {

    alert("requestFailed");
}

function showLoading()  {

    esri.show(loading);
    map.disableMapNavigation();
    map.hideZoomSlider();
}

function hideLoading(error) {

    esri.hide(loading);
    map.enableMapNavigation();
    map.showZoomSlider();       
}

dojo.addOnLoad(init);

html code

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
  <head>
    <title>RTIA Map</title>
    <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8" >

    <link rel="stylesheet" type="text/css" href="gis.css" />

    <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=2.8"></script>
    <script type="text/javascript" src="rtia_culled.js"></script>


  </head>

<body>

    <div id="map" class="mainmap">
        <img id="loadingImg" src="images/loading.gif" class="loadimage"/>
    </div>
    <!--div id="legendDiv" style="width:600px; height:600px; border:1px solid #000"-->
    </div>

    <span id="extent"></span>
</body>

</html>

The problem is that the outputs of dojo.toJson(extent.toJson()) show the same extent, which is the full extent, no matter the layer. This particular layer that I would like to zoom to, http://co-gis-01/ArcGIS/rest/service...ia/MapServer/2, is just a filtered version of one of the "full-extent" layers. The filter is defined in the mapservice.

How do I correctly do this function?

Improve this question
3
  • I tried setting only the layer of interest as visible, and then setting the map extent to full extent. Still, only the whole full extent is displayed instead of the extent that can only be shown by the layer.
    – NeoJigglypuff
    Commented Jun 28, 2012 at 1:45
  • I tried exporting the filtered layer and importing it, resulting in a layer whose content is only those originally defined by the definition query. I published the service and was finally able to automatically zoom to the desired extent. The definition query seems to be ignored when getting the full extent of the layer, in other words, the full extent still considers all features, even those that fails the definition query. is there a way to circumvent this in the api?
    – NeoJigglypuff
    Commented Jun 28, 2012 at 6:05
  • I have the doubt if featureLayer.fullExtend () works, in my case, my service has another SpatialReference, and I do not know if it can be changed, if it could, I suppose it would work only with that line.
    – carlosaar22
    Commented May 4, 2017 at 15:38

1 Answer 1

Reset to default
7

I've managed to solve this problem using this as a reference. Basically, I looped all of the Polyline graphics (that's the only type the application is interested in) included in the FeatureLayer and do a union operation on each of the graphic's extent. Below is my version.

function featureUpdateEnd(error, info)  {

    var localExtent;
    if (featuremap.graphics.length > 0) {

        for (var i = 0; i < featuremap.graphics.length; i++)    {

            if (featuremap.graphics[i].geometry instanceof esri.geometry.Polyline)  {

                try {

                    if (i == 0) {

                        localExtent = new esri.geometry.Extent(featuremap.graphics[i].geometry.getExtent().toJson());
                    }
                    else    {

                        localExtent = localExtent.union(featuremap.graphics[i].geometry.getExtent());
                    }
                }
                catch (err) {

                    //alert(String(i) + " is caught: " + err.message);
                }
            }
        }

        localExtent = localExtent.expand(1.25);
        map.setExtent(localExtent.getExtent());
    }
}

featuremap is the FeatureLayer. featureUpdateEnd is a function that is called by FeatureLayer's onUpdateEnd event. I did not use onLoad because the event fires even if the FeatureLayer hasn't finished loading yet, giving me a zero-length array to loop on. I had to enclose part of it in a try-catch statement because of an undefined instance is encountered (but this is probably only due to my data).

Improve this answer
2
  • @Sam007. I Want to show concurrently all the features of various map layers (featureLayer, graphicsLayers , etc). Would I have to iterate over all the graphics so as to find a proper extent ? isnt there a more clever way to tell the map to zoom automatically to all the visible/loaded features ?
    – Smalis
    Commented Dec 30, 2014 at 18:51
  • half a decade later and esri still hasn't created this functionality.... thanks for the answer, helped
    – I wrestled a bear once.
    Commented Jan 3, 2017 at 16:16

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.