topic Re: Trouble Getting setExtent to work in ArcGIS JavaScript Maps SDK Questions

Trouble Getting setExtent to work

SteveSmith1 — Fri, 01 May 2015 14:56:13 GMT

I am trying to set my map extent to the last place it was located when a user comes back to the page. When I use setExtent, the page comes up blank without showing the map at all. I think it may have to do with the spatialReference, but I am not sure. Any help would be appreciated.

require([

"dojo/dom-construct",

"esri/Color",

"esri/dijit/Geocoder",

"esri/dijit/Popup",

"esri/InfoTemplate",

"esri/layers/ArcGISDynamicMapServiceLayer",

"esri/map",

"esri/symbols/SimpleFillSymbol",

"esri/symbols/SimpleLineSymbol", "dojo/domReady!",

"dijit/layout/BorderContainer", "dijit/layout/ContentPane"

], function (

domConstruct, Color, Geocoder, Popup, InfoTemplate,

ArcGISDynamicMapServiceLayer, Map, SimpleFillSymbol, SimpleLineSymbol

) {

try {

var sls = new SimpleLineSymbol("solid", new Color("#444444"), 3);

var sfs = new SimpleFillSymbol("solid", sls, new Color([68, 68, 68, 0.25]));

var popup = new Popup({

fillSymbol: sfs,

lineSymbol: null,

markerSymbol: null

}, domConstruct.create("div"));

map = new Map("ui-esri-map", {

basemap: "streets",

center: [-76.347304, 39.533987], // long, lat

zoom: 11,

sliderStyle: "small"

});

pathArray = location.href.split('/');

protocol = pathArray[0];

host = pathArray[2];

var appFolder = '<%=PavementManagement.Properties.Settings.Default.appFolder %>';

url = protocol + '//' + host;

var _pavementInfoTemplate = new InfoTemplate();

_pavementInfoTemplate.setTitle("Road Condition Information");

_pavementInfoTemplate.setContent("Road Name: ${NAME} Type: ${SURFDESC} From Street: ${FROMSTREET} To Street: ${TOSTREET} Assessed: ${RoadAssessed} <a href='" + url + appFolder.replace("none", "") + "/Assessment/AssessmentEntry.aspx?id=${OBJECTID_1}'>Update Road Assessment</a>");

var pavementLayerURL = "http://gismaps.harfordcountymd.gov/arcgis/rest/services/ICT/PavementManagement/MapServer";

var pavementLayerOptions = {

"id": "pavementlineLayer",

"opacity": .5,

"showAttribution": false

};

var pavementLayer = new ArcGISDynamicMapServiceLayer(pavementLayerURL, pavementLayerOptions);

pavementLayer.setDisableClientCaching(true);

pavementLayer.setInfoTemplates({

0: { infoTemplate: _pavementInfoTemplate }

});

pavementLayer.setVisibleLayers([0, 1, 2]);

map.addLayer(pavementLayer);

updateExtent(map, pavementLayer);

dojo.connect(map, "onExtentChange", showExtent);

geocoder = new Geocoder({

arcgisGeocoder: {

url: "http://gismaps.harfordcountymd.gov/arcgis/rest/services/ICT/OriginalGeoFencesAddress/GeocodeServer",

placeholder: "Enter Address (No Suffix)",

autonavigate: "True"

map: map

}, "ui-esri-dijit-geocoder");

geocoder.startup();

}

catch (err) {

alert('error: ' + err);

}

});

function updateExtent(map, pavementLayer) {

try{

var Xmin = getCookie('Xmin');

var Ymin = getCookie('Ymin');

var Xmax = getCookie('Xmax');

var Ymax = getCookie('Ymax');

if (typeof Xmin !== 'undefined') {

var startExtent = new esri.geometry.Extent();

startExtent.xmin = parseFloat(Xmin);

startExtent.ymin = parseFloat(Ymin);

startExtent.xmax = parseFloat(Xmax);

startExtent.ymax = parseFloat(Ymax);

startExtent.spatialReference = pavementLayer.spatialReference;

map.setExtent(startExtent);

};

}

catch (err) {

alert('error: ' + err);

}

Re: Trouble Getting setExtent to work

KenBuja — Sun, 12 Dec 2021 05:33:48 GMT

What is happening is that the updateExtent function is getting called before the pavementLayer is fully ready. This would mean the spatial reference is incorrect. I would call that function when the "layer-add-result" function fires.

var pavementLayer = new ArcGISDynamicMapServiceLayer(pavementLayerURL, pavementLayerOptions);
pavementLayer.setDisableClientCaching(true);
pavementLayer.setInfoTemplates({
    0: { infoTemplate: _pavementInfoTemplate }
});
pavementLayer.setVisibleLayers([0, 1, 2]);
map.addLayer(pavementLayer);
pavementLayer.on("layer-add-result", function (){
    updateExtent(map, pavementLayer);
});

Re: Trouble Getting setExtent to work

SteveSmith1 — Fri, 01 May 2015 16:16:11 GMT

I moved it to here.

dojo.connect(map, "layer-add-result", updateExtent(map, pavementLayer));

Still get the same result. Can't help but feel I'm missing something small.

Re: Trouble Getting setExtent to work

KenBuja — Fri, 01 May 2015 16:23:15 GMT

I didn't look closely at the URL of the pavementLayer. Its spatial reference is different from that of the map, so you'll have to project that extent to the map's spatial reference. Here's an example of that: JS Bin - Collaborative JavaScript Debugging

Re: Trouble Getting setExtent to work

SteveSmith1 — Fri, 01 May 2015 17:30:43 GMT

I had originally been trying the map, but it seems like I always get a undefined value for the map's.

Re: Trouble Getting setExtent to work

SteveSmith1 — Fri, 01 May 2015 17:31:53 GMT

But now that i have moved it into that function, it works. Thanks a lot.

Re: Trouble Getting setExtent to work

SteveSmith1 — Fri, 01 May 2015 18:10:48 GMT

So it worked when i first tried it, but I had an alert in the function. When I take the alert out, it goes back to the map not showing up, almost like the alert allows it time to catch up. Is there something else that may not be fully loaded?

Re: Trouble Getting setExtent to work

KenBuja — Fri, 01 May 2015 18:22:14 GMT

Can you post your updated code?

Re: Trouble Getting setExtent to work

SteveSmith1 — Fri, 01 May 2015 18:31:00 GMT

require([

"dojo/dom-construct",

"esri/Color",

"esri/dijit/Geocoder",

"esri/dijit/Popup",

"esri/InfoTemplate",

"esri/layers/ArcGISDynamicMapServiceLayer",

"esri/map",

"esri/symbols/SimpleFillSymbol",

"esri/symbols/SimpleLineSymbol", "dojo/domReady!",

"dijit/layout/BorderContainer", "dijit/layout/ContentPane"

], function (

domConstruct, Color, Geocoder, Popup, InfoTemplate,

ArcGISDynamicMapServiceLayer, Map, SimpleFillSymbol, SimpleLineSymbol

) {

try {

var sls = new SimpleLineSymbol("solid", new Color("#444444"), 3);

var sfs = new SimpleFillSymbol("solid", sls, new Color([68, 68, 68, 0.25]));

var popup = new Popup({

fillSymbol: sfs,

lineSymbol: null,

markerSymbol: null

}, domConstruct.create("div"));

map = new Map("ui-esri-map", {

basemap: "streets",

center: [-76.347304, 39.533987], // long, lat

zoom: 11,

sliderStyle: "small"

});

pathArray = location.href.split('/');

protocol = pathArray[0];

host = pathArray[2];

var appFolder = '<%=PavementManagement.Properties.Settings.Default.appFolder %>';

url = protocol + '//' + host;

var _pavementInfoTemplate = new InfoTemplate();

_pavementInfoTemplate.setTitle("Road Condition Information");

var pavementLayerURL = "http://gismaps.harfordcountymd.gov/arcgis/rest/services/ICT/PavementManagement/MapServer";

var pavementLayerOptions = {

"id": "pavementlineLayer",

"opacity": .5,

"showAttribution": false

};

var pavementLayer = new ArcGISDynamicMapServiceLayer(pavementLayerURL, pavementLayerOptions);

pavementLayer.setDisableClientCaching(true);

pavementLayer.setInfoTemplates({

0: { infoTemplate: _pavementInfoTemplate }

});

pavementLayer.setVisibleLayers([0, 1, 2]);

map.addLayer(pavementLayer);

dojo.connect(map, "layer-add-result", updateExtent(map, pavementLayer));

dojo.connect(map, "onExtentChange", showExtent);

geocoder = new Geocoder({

arcgisGeocoder: {

url: "http://gismaps.harfordcountymd.gov/arcgis/rest/services/ICT/OriginalGeoFencesAddress/GeocodeServer",

placeholder: "Enter Address (No Suffix)",

autonavigate: "True"

map: map

}, "ui-esri-dijit-geocoder");

geocoder.startup();

}

catch (err) {

alert('error: ' + err);

}

});

function updateExtent(map, pavementLayer) {

try{

var Xmin = getCookie('Xmin');

var Ymin = getCookie('Ymin');

var Xmax = getCookie('Xmax');

var Ymax = getCookie('Ymax');

if (typeof Xmin !== 'undefined') {

var startExtent = new esri.geometry.Extent();

startExtent.xmin = parseFloat(Xmin);

startExtent.ymin = parseFloat(Ymin);

startExtent.xmax = parseFloat(Xmax);

startExtent.ymax = parseFloat(Ymax);

startExtent.spatialReference = pavementLayer.spatialReference;

map.setExtent(startExtent);

};

}

catch (err) {

alert('error: ' + err);

}

Re: Trouble Getting setExtent to work

KenBuja — Fri, 01 May 2015 18:39:33 GMT

When you use "dojo.connect", you have to use "onLayerAddResult". Is there a reason you're using "dojo.connect" instead of "on"? Take a look at this page.

Re: Trouble Getting setExtent to work

SteveSmith1 — Fri, 01 May 2015 19:00:24 GMT

I had tried switching over to "on" earlier, I keep getting errors though. The page was built on an earlier example I had that was still using the 3.10 script. I am a little rusty on the js side and the mapping stuff is all new to me.

switching to dojo.connect(map, "onLayerAddResult", updateExtent(map, pavementLayer)); seams to have made it worse. Now my layer loads, but the basemap does not...