Change symbols for Feature Layer hosted on external server

Question

I am attempting to modify a FeatureLayer's symbology on the client side and having some issues.  Because I do not have access to the hosted feature service and the symbology returned is incorrect, I am wondering if this can be done after the FeatureLayer is created.

The reason I cannot assign the symbol at creation time is because there are 9 unique features.  Each feature has a graphic as SimpleFillSymbol with the same outline color.  Is it possible to correct the outline colors for each of the 9 returned features when I query the feature layer in mode_ondemand?

Code Snippet:

-Kate

KDeVogelaere · Answer

Worked like magic. Great examples, thank you both for sharing this!

-K

evtguy · Answer

You should be able to do this- you just need to apply a new renderer to the featureLayer after you create it. I have done this with a feature service from the USGS of earthquakes. Here's my snippit that changes the symbology from its default service symbology to what I wanted:

var theUsgsEarthquakeLayer = new FeatureLayer("http://igems.doi.gov/arcgis/rest/services/igems_haz/MapServer/3", {
          id: "quakes",
          mode: FeatureLayer.MODE_ONDEMAND,
          refreshInterval: 5,
          autoGeneralize: false,
          outFields: ["*"]
        });
                
        if (theUsgsEarthquakeLayer != null) {
            //define a popup template 
            var usgsQuakeTemplate = new InfoTemplate();
            usgsQuakeTemplate.setContent(formatQuakeContent);
            usgsQuakeTemplate.setTitle("Magnitude ${magnitude} Earthquake");
            theUsgsEarthquakeLayer.setInfoTemplate(usgsQuakeTemplate);
            theUsgsEarthquakeLayer.setAutoGeneralize(false);
            //Create a different renderer with new symbols            
            var renderer = new ClassBreaksRenderer(null, "magnitude");
            renderer.addBreak(0, 3, blueMarkerSymb);
            renderer.addBreak(3, 5, greenMarkerSymb);
            renderer.addBreak(5, 7, orangeMarkerSymb);
            renderer.addBreak(7, 9, redMarkerSymb);
            renderer.addBreak(9, Infinity, purpleMarkerSymb);

theUsgsEarthquakeLayer.setRenderer(renderer);
        } else {
            // Define the USGS Earthquake layer retrieved from a KML file instead
            theUsgsEarthquakeLayer = new KMLLayer("http://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/1.0_week_age_link.kml", {
                id: 'quakes',
                refreshInterval: 5,
                visible: true
            });
        }

RobertScheitlin__GISP · Answer

Kate,

have you looked into UniqueValueRenderer?

UniqueValueRenderer | API Reference | ArcGIS API for JavaScript

Unique value renderer | ArcGIS API for JavaScript