How do you get renderer from a feature layer?

5432
13
Jump to solution
03-11-2015 03:35 PM
MorganEverett
New Contributor III

How do you get the renderer from a feature layer? 

I want to get the current rendered from a feature layer, and then set the RotationInfo on it so I can rotate my graphics that are in that feature service.

0 Kudos
1 Solution

Accepted Solutions
RobertScheitlin__GISP
MVP Esteemed Contributor

Morgan,

  Here is a simple sample.

<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
    <title>Feature Layer Only Map</title>
    <link rel="stylesheet" href="http://js.arcgis.com/3.13/esri/css/esri.css">
    <style>
      html, body, #map {
        height: 100%;
        width: 100%;
        margin: 0;
        padding: 0;
      }
    </style>
    <script src="http://js.arcgis.com/3.13/"></script>
    <script>
      require([
        "dojo/dom-construct",
        "esri/map",
        "esri/layers/FeatureLayer",
        "esri/geometry/Extent",
        "esri/InfoTemplate",
        "dojo/domReady!"
      ], function(
          domConstruct,
          Map,
          FeatureLayer,
          Extent,
          InfoTemplate
        ) {
          var bounds = new Extent({
            "xmin":-16045622,
            "ymin":-811556,
            "xmax":7297718,
            "ymax":11142818,
            "spatialReference":{"wkid":102100}
          });

          var map = new Map("map", {
            extent: bounds
          });

          var url = "http://sampleserver6.arcgisonline.com/arcgis/rest/services/WorldTimeZones/MapServer/2";

          var template = new InfoTemplate("World Regions", "Region: ${REGION}");

          var fl = new FeatureLayer(url, {
            id: "world-regions",
            infoTemplate: template
          });
          fl.on('load', function(evt){
            console.info(evt.target.renderer);
          });

          map.addLayer(fl);
        }
      );
    </script>
  </head>
  <body>
    <div id="map"></div>
  </body>
</html>

View solution in original post

13 Replies
SteveCole
Frequent Contributor

The renderer is a property of the featureLayer so:

var theRenderer = theLayer.renderer;

MorganEverett
New Contributor III

I've tried that, it is null every time.  Or am I looking at it at the wrong time?

0 Kudos
KenBuja
MVP Honored Contributor

When are you trying to get the renderer? You're probably trying to access it before it's ready. Try setting that after the FeatureLayer's load event fires.

RobertScheitlin__GISP
MVP Esteemed Contributor

Morgan,

  Here is a simple sample.

<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
    <title>Feature Layer Only Map</title>
    <link rel="stylesheet" href="http://js.arcgis.com/3.13/esri/css/esri.css">
    <style>
      html, body, #map {
        height: 100%;
        width: 100%;
        margin: 0;
        padding: 0;
      }
    </style>
    <script src="http://js.arcgis.com/3.13/"></script>
    <script>
      require([
        "dojo/dom-construct",
        "esri/map",
        "esri/layers/FeatureLayer",
        "esri/geometry/Extent",
        "esri/InfoTemplate",
        "dojo/domReady!"
      ], function(
          domConstruct,
          Map,
          FeatureLayer,
          Extent,
          InfoTemplate
        ) {
          var bounds = new Extent({
            "xmin":-16045622,
            "ymin":-811556,
            "xmax":7297718,
            "ymax":11142818,
            "spatialReference":{"wkid":102100}
          });

          var map = new Map("map", {
            extent: bounds
          });

          var url = "http://sampleserver6.arcgisonline.com/arcgis/rest/services/WorldTimeZones/MapServer/2";

          var template = new InfoTemplate("World Regions", "Region: ${REGION}");

          var fl = new FeatureLayer(url, {
            id: "world-regions",
            infoTemplate: template
          });
          fl.on('load', function(evt){
            console.info(evt.target.renderer);
          });

          map.addLayer(fl);
        }
      );
    </script>
  </head>
  <body>
    <div id="map"></div>
  </body>
</html>
MorganEverett
New Contributor III

Robert, that worked perfectly.

Thanks.

0 Kudos
deleted-user-wcpelUUf_XXx
New Contributor III

Robert,

does this solution works only with simple symbology?

I tried this with my current code and it returned the same result i have here:

renderer from an existing service fails to return the full symbology 

with the symbology as you can see in the pictures not fully operational when its "complicated".

any ideas?

0 Kudos
RobertScheitlin__GISP
MVP Esteemed Contributor

No it should work with any renderer.

deleted-user-wcpelUUf_XXx
New Contributor III

im trying to do the same with a uniqeValue renderer from a public service, and the code seems to get me the renderer and the attribute field, but on rendering i get a bad result.

this is the code:

		  var serviceUrl = "https://ags.iplan.gov.il/arcgisiplan/rest/services/PlanningPublic/Xplan_2039/MapServer/1";
		  var layer = new FeatureLayer(serviceUrl);
 
          if (featureLayer.graphics) { 
			layer.on('load', function(evt){  
            console.info(evt.target.renderer);
			featureLayer.setRenderer(evt.target.renderer)
          }); 

it gets me:

renderer on webapp

instead of:im trying to get why the original service im taking the renderer from has a different symbology than mine,

from service:

from the code:

0 Kudos
RobertScheitlin__GISP
MVP Esteemed Contributor

Segev,

   There is some hatching symbology that is not supported on ArcGIS server services and normally you are warned of this when you publish the service.

0 Kudos