topic Re: onClick on ArcGISDynamicMapServiceLayer in ArcGIS JavaScript Maps SDK Questions

onClick on ArcGISDynamicMapServiceLayer

christianromero — Thu, 17 Sep 2015 21:25:09 GMT

Hi, I'm trying to replicate this Onclick event for a sublayer in a ArcGISDynamicMapServiceLayer sample but i hadn't success.

Mine scenario are: I've a menu each action can show a different view of data (layers) one of those are a time TimeSlider, the time slider works fine but a need to add a function for display some data after doing a click on certain point on the map.

function inittimeSlider() {

try{

var opLayer = new esri.layers.ArcGISDynamicMapServiceLayer(document.getElementById('hUrl').value);

opLayer.setVisibleLayers([CapaPosicion.FALLAS.value]);

opLayer.id = 'timeSlider';

opLayer.opacity = 0.6;

var component = dijit.registry.byId("timeSliderDiv");

if (component) {

//destroy it

dojo.domConstruct.destroy(component);

dijit.registry.remove(timeSlider)

timeSlider.destroy()

}

timeSlider = new esri.dijit.TimeSlider({

style: "width: 100%;"

}, dojo.dom.byId("timeSliderDiv"));

map.setTimeSlider(timeSlider);

var timeExtent = new esri.TimeExtent();

timeExtent.startTime = new Date("01/01/2015 UTC");

timeExtent.endTime = new Date("08/31/2015 UTC");

timeSlider.setThumbCount(2);

timeSlider.createTimeStopsByTimeInterval(timeExtent, 1, "esriTimeUnitsMonths");

timeSlider.setThumbIndexes([0, 1]);

timeSlider.setThumbMovingRate(2000);

timeSlider.startup();

//add labels for every other time stop

var labels = dojo._base.array.map(timeSlider.timeStops, function (timeStop, i) {

//if ( i % 2 === 0 ) {

return timeStop.getUTCFullYear();

//} else {

return "";

//}

});

timeSlider.setLabels(labels);

timeSlider.on("time-extent-change", function (evt) {

var startValString = Meses(evt.startTime.getUTCMonth());

var endValString = Meses(evt.endTime.getUTCMonth());

dojo.dom.byId("daterange").innerHTML = "<i>" + startValString + " a " + endValString + " " + "<\/i>";

});

map.addLayers([opLayer]);

map.on("load", initFunctionality);

function initFunctionality() {

map.on("click", doIdentify);

var identifyTask = new esri.tasks.IdentifyTask(document.getElementById('hUrl').value);

var identifyParams = new esri.tasks.IdentifyParameters();

identifyParams.tolerance = 3;

identifyParams.returnGeometry = true;

identifyParams.layerIds = [CapaPosicion.FALLAS.value];

identifyParams.layerOption = esri.tasks.IdentifyParameters.LAYER_OPTION_ALL;

dojo.on(identifyTask, "complete", function (event) {

array.forEach(event.results, function (feature) {

if (feature.layerName == "timeSlider") {

alert('123456789');

}

});

}

function doIdentify(event) {

map.graphics.clear();

identifyParams.geometry = event.mapPoint;

identifyParams.mapExtent = map.extent;

identifyTask.execute(identifyParams)

}

catch (e) {

console.log("Error : " + e);

HideProgress();

}

at first I thought it was the same way to what is done in the onclick of esri.layers.FeatureLayer,

exist another way ? or I have something wrong that can not see ?

Re: onClick on ArcGISDynamicMapServiceLayer

RobertScheitlin__GISP — Fri, 18 Sep 2015 12:51:38 GMT

Christian,

So do you get to the identify on complete function at all when you click on the map?

Re: onClick on ArcGISDynamicMapServiceLayer

christianromero — Fri, 18 Sep 2015 17:35:21 GMT

yes, is what i did?

Re: onClick on ArcGISDynamicMapServiceLayer

RobertScheitlin__GISP — Fri, 18 Sep 2015 17:40:19 GMT

Christian,

No, I mean when you are debugging do you actually get to the identify on complete function. Maybe add a console.info('Identify Reults:',event.results);

Re: onClick on ArcGISDynamicMapServiceLayer

christianromero — Fri, 18 Sep 2015 19:26:09 GMT

I realized that the map.on("load", initFunctionality) does not load the initFunctionality. So what i did was commenting map.on("load", initFunctionality) and header/end of initFunctionality. Like

function inittimeSlider() {

try{

var opLayer = new esri.layers.ArcGISDynamicMapServiceLayer(document.getElementById('hUrl').value);

opLayer.setVisibleLayers([CapaPosicion.FALLAS.value]);

opLayer.id = 'timeSlider';

opLayer.opacity = 0.6;

var component = dijit.registry.byId("timeSliderDiv");

if (component) {

//destroy it

dojo.domConstruct.destroy(component);

dijit.registry.remove(timeSlider)

timeSlider.destroy()

}

timeSlider = new esri.dijit.TimeSlider({

style: "width: 100%;"

}, dojo.dom.byId("timeSliderDiv"));

map.setTimeSlider(timeSlider);

var timeExtent = new esri.TimeExtent();

timeExtent.startTime = new Date("01/01/2015 UTC");

timeExtent.endTime = new Date("08/31/2015 UTC");

timeSlider.setThumbCount(2);

timeSlider.createTimeStopsByTimeInterval(timeExtent, 1, "esriTimeUnitsMonths");

timeSlider.setThumbIndexes([0, 1]);

timeSlider.setThumbMovingRate(2000);

timeSlider.startup();

//add labels for every other time stop

var labels = dojo._base.array.map(timeSlider.timeStops, function (timeStop, i) {

//if ( i % 2 === 0 ) {

return timeStop.getUTCFullYear();

//} else {

return "";

//}

});

timeSlider.setLabels(labels);

timeSlider.on("time-extent-change", function (evt) {

var startValString = Meses(evt.startTime.getUTCMonth());

var endValString = Meses(evt.endTime.getUTCMonth());

dojo.dom.byId("daterange").innerHTML = "<i>" + startValString + " a " + endValString + " " + "<\/i>";

});

map.addLayers([opLayer]);

map.on("load", initFunctionality);

function initFunctionality() {

map.on("click", doIdentify);

var identifyTask = new esri.tasks.IdentifyTask(document.getElementById('hUrl').value);

var identifyParams = new esri.tasks.IdentifyParameters();

identifyParams.tolerance = 3;

identifyParams.returnGeometry = true;

identifyParams.layerIds = [CapaPosicion.FALLAS.value];

identifyParams.layerOption = esri.tasks.IdentifyParameters.LAYER_OPTION_ALL;

dojo.on(identifyTask, "complete", function (event) {

array.forEach(event.results, function (feature) {

if (feature.layerName == "timeSlider") {

alert('123456789');

}

});

}

function doIdentify(event) {

map.graphics.clear();

identifyParams.geometry = event.mapPoint;

identifyParams.mapExtent = map.extent;

identifyTask.execute(identifyParams)

}

catch (e) {

console.log("Error : " + e);

HideProgress();

}

i do not know why the map.on("load", initFunctionality); it does not work but the map.on("click", doIdentify); works well .

Maybe i not using the proper method or something else.

by the way, following the advice to add console.info('Identify Reults:', event.results); in the original code did not work, only if i remove the lines that i said before.

Re: onClick on ArcGISDynamicMapServiceLayer

RobertScheitlin__GISP — Fri, 18 Sep 2015 19:43:46 GMT

Christian,

It is likely that map is already loaded before you get to running this portion of code. Seems like you need to be listening for the "layer-add" event and check if the layer added is your opLayer and if so execute you initFunctionality function.

Re: onClick on ArcGISDynamicMapServiceLayer

christianromero — Fri, 18 Sep 2015 22:25:04 GMT

Thank you for the advice. in the class map you can find the "layers-add-result" event , that fires after all layer were added

so i just change this line map.on("load", initFunctionality);

for this one

map.on("layers-add-result", initFunctionality);

u can see the reference Map (legacy) | API Reference | ArcGIS API for JavaScript .