AnsweredAssumed Answered

Popup on mouse over on dynamic service

Question asked by endlessdsire on Mar 7, 2017
Latest reply on Mar 7, 2017 by endlessdsire

Hello there,

 

Im wondering if theres a way to handle a popup on a dynamic service when the users put their mouse on a feature (on mouse over event).

I know its possible to do it with featurelayers, but since im working with dynamic service i dont know if this is possible.

I looked into the api for dynamic layers and there is not a event for on mouse over.

 

I share what i have on my code:

 

var mapp = mymap.createMap("map","topo",this.state.country[0].extent[0], this.state.country[0].extent[1],12);

var layerDefinitions = [];
layerDefinitions[0] = "COUNTRY= '"+ this.state.COUNTRY[0].queryName+"'";
layerDefinitions[1] = "COUNTRY= '"+ this.state.COUNTRY[0].queryName+"'";
layerDefinitions[2] = "COUNTRY= '"+ this.state.COUNTRY[0].queryName+"'";
layerDefinitions[4] = "COUNTRY= '"+ this.state.COUNTRY[0].queryName+"'";
var carsLayer = new ArcGISDynamicMapServiceLayer(layers.read_dynamic_ap(),{});
carsLayer .setImageFormat("png32");
carsLayer .setVisibleLayers([0]);
carsLayer .setLayerDefinitions(layerDefinitions);

var streetsLayer = new ArcGISDynamicMapServiceLayer(layers.read_dynamic_ap(),{ minScale: 6000});
streetsLayer .setImageFormat("png32");
streetsLayer .setVisibleLayers([1]);
streetsLayer .setLayerDefinitions(layerDefinitions);

var peopleLayer = new ArcGISDynamicMapServiceLayer(layers.read_dynamic_ap(),{minScale: 6000});
peopleLayer .setImageFormat("png32");
peopleLayer .setVisibleLayers([2]);
peopleLayer .setLayerDefinitions(layerDefinitions);

var countryLayer = new ArcGISDynamicMapServiceLayer(layers.read_dynamic_ap(),{});
countryLayer .setImageFormat("png32");
countryLayer .setVisibleLayers([4]);
countryLayer .setLayerDefinitions(layerDefinitions);
mapp.addLayers([countryLayer , peopleLayer ,streetsLayer , carsLayer]);

this.setState({dynamicService: [countryLayer , peopleLayer , streetsLayer , carsLayer]});

mapp.on('click', (event)=>{
$('.drawer_progressBar2').css('visibility',"visible");

var identifyTask, identifyParams;
identifyTask = new IdentifyTask(layers.read_dynamic_ap());
identifyParams = new IdentifyParameters();
identifyParams.tolerance = 10;
identifyParams.returnGeometry = true;
identifyParams.layerIds = [0, 1];
identifyParams.layerOption = IdentifyParameters.LAYER_OPTION_ALL;
identifyParams.width = mapp.width;
identifyParams.height = mapp.height;
identifyParams.geometry = event.mapPoint;
identifyParams.mapExtent = mapp.extent;

var onlyLum = [];

//Use promisses to get results from identityTask in layers 0 and 1
var deferred = identifyTask.execute(identifyParams, (callback)=>{
if(!callback.length){
console.log("no length", callback);
}else{
let arrResults = callback.map(result => {
let r = {
features: result.feature,
layerName: result.layerName
}
return r;
});
this.setState({allElements: arrResults});
// Show edition window for each street selected.
this.onShowCurrent(arrResults,0);
onlyStreet = arrResults.filter(element =>{ return element.layerName=='Streets' });
//get the first element .
this.setState({counterTotal: onlyLum.length, counter: 1, allElements: onlyLum, currentIndex: 0});
$('.drawer_progressBar2').css('visibility',"hidden");
$('.wrapperTop_midTitle h6').addClass('wrapperTop_midTitle-h6');
$('.muniTitulo').addClass('muniTitulo-40percent');
}
},(errback)=>{
console.log("ee",errback);
});
//add infowindow ----------------------------------------------------
deferred.addCallback(function (response){
//get only the info from streets to generate infowindow .
let res = response.filter((r)=>{return r.layerName=="Streets"});
return arrayUtils.map(res, function (result) {
var feature = result.feature;
var layerName = result.layerName;
var onlyStreets = [];
feature.attributes.layerName = layerName;
if(layerName === 'Streets'){
var streetsTemplate = new InfoTemplate("ID Luminaria: ${ID_STREET}",
"NAME: ${NAME} <br />" +
"CONCURRENT: ${CONCURRENT}<br /> " +
"DANGER: ${DANGER} <br/> ");
feature.setInfoTemplate(streetsTemplate);
onlyStreets .push(feature);
}
return feature;
});
});
mapp.infoWindow.setFeatures([deferred]);
mapp.infoWindow.show(event.mapPoint);
});

Outcomes