FeatureLayer setSelection puts outline underneath feature layer?

Anonymous User

Original User: sarahclark

I am working with dgrid to show attributes for a polygon feature layer, and when a row is clicked, highlight that polygon (from this sample). I want to mimic the style of ArcMap where an aqua-colored outline highlights the selected feature.

symbol:

fl = new FeatureLayer(...);

fl.on("load", function() {
         aqua = "00FFFF";
          lineAqua = new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID,aqua,3);
          fl.setSelectionSymbol(new SimpleFillSymbol().setOutline(lineAqua).setStyle(SimpleFillSymbol.STYLE_NULL));
          });

Selection function:

// fires when a row in the dgrid is clicked
          function selectState(e) {
            // select the feature
            var fl = map.getLayer("land");
            var query = new Query();
            query.objectIds = [parseInt(e.target.innerHTML)];
            fl.selectFeatures(query, FeatureLayer.SELECTION_NEW, function(result) {
              if ( result.length ) {
                // re-center the map to the selected feature
                map.centerAt(result[0].geometry.getExtent().getCenter());
              } else {
                console.log("Feature Layer query returned no features... ", result);
              }
            });
          }

However sometimes it is putting the SimpleFillSymbol below the feature layer, so that when a polygon is selected the outline is hidden... if I click a different  row, then click the same one, sometimes it draws one edge above the feature layer and the other 3 below...is there a way to force the order?

[ATTACH=CONFIG]33823[/ATTACH]

Capture.PNG

86276Capture.PNG

DavidWilton

I just ran across the same issue. The problem with feature layer selections is that the don't add a new graphic, but change the symbology of the actual feature layer. Therefore the order is the same as the underlying feature layer. This is the same reason you can't do an arcMap style highlight the outline in cyan. Here is some pseudo code which shows how you could do it:

//don't do this. leave it is blank

//this.featureLayer().setSelectionSymbol(fmySelectionSymbol);

//do this instead

this.featureLayer.on('selection-complete', lang.hitch(this, this.featureLayerHighlightSelectedFeatures))

//mouse over event of grid row

onMouseOver(evt){

//get the oid From the row

var queryTask = new QueryTask(window.location.protocol + this.config.fieldsLayerUrl);

var query = new Query();

query.objectIds = oid;

this.featureLayer.selectFeatures(query, FeatureLayer.SELECTION_NEW);

}

featureLayerHighlightSelectedFeatures: function(evt){

   //clear map graphics

   //loop through the graphics in the evt and add to map

}