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 ?
Solved! Go to Solution.
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.
Christian,
So do you get to the identify on complete function at all when you click on the map?
yes, is what i did?
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);
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.
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.
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 .