I am building a map that you can hover over and click on. I need to access a feature's project number (ProjectNum) when I click on it, but my click event on the layer doesn't seem to be firing. When I click the map, I get all of the feature layer's project numbers, not the one that I want. I've tried using map.on, on(layer, "click"...), layer.on("click"... How do I retrieve the specific project number of the polygon that I click on?
function clickMap(){ layer.on("update-end", function(evt){ console.log(evt); map.on("click", function(e){ console.log(e); console.log("project number: " + layer.graphics[0].attributes.ProjectNum); }); })}
Solved! Go to Solution.
Yes, the hover function interferes with layer click event. What you can do is add a click event to the map's graphics
function clickMap() {
map.graphics.on("click", function (e) {
console.log(e);
console.log(e.graphic.attributes.ProjectNum);
// console.log(evt);
// map.on("click", function(e){
// console.log(e.graphics);
// console.log("project number: " + layer.graphics[0].attributes.ProjectNum);
// });
});
}
You'll also have to add the attributes of the feature to your graphic in your layer mouse-over event
var highlightGraphic = new Graphic(evt.graphic.geometry, highlightSymbol, evt.graphic.attributes);
Is there any reason you have two map load event listeners running?
Make sure you are setting the "outFields" property when creating your FeatureLayer.
var flayer = new FeatureLayer(url, { outFields: ["*"] //make sure field to label is specified here in outFields });
If it's a feature layer, then use its click event (along with Jack's suggestion with the outFields
featureLayer.on('click', function(e){
console.log(e);
console.log(e.graphic.attributes.ProjectNum);
});
Thanks for the advice! I did make sure to include 'ProjectNum' in the outfield. When I updated my code with:
featureLayer.on('click', function(e){
console.log(e);
console.log(e.graphic.attributes.ProjectNum);
});
I get no response. Nothing in the console. I'll attached my js file to my post. Could there be some interference if I also have a hover function? Like maybe I'm clicking the highlighted graphic instead of the polygon?
Cara,
It is highly likely that your other graphic is blocking the click event. You can use the disablemouseevents on the highlight GL to prevent this.
https://developers.arcgis.com/javascript/3/jsapi/graphicslayer-amd.html#disablemouseevents
Yes, the hover function interferes with layer click event. What you can do is add a click event to the map's graphics
function clickMap() {
map.graphics.on("click", function (e) {
console.log(e);
console.log(e.graphic.attributes.ProjectNum);
// console.log(evt);
// map.on("click", function(e){
// console.log(e.graphics);
// console.log("project number: " + layer.graphics[0].attributes.ProjectNum);
// });
});
}
You'll also have to add the attributes of the feature to your graphic in your layer mouse-over event
var highlightGraphic = new Graphic(evt.graphic.geometry, highlightSymbol, evt.graphic.attributes);
Is there any reason you have two map load event listeners running?