AnsweredAssumed Answered

Not Able to Add Breaks For Feature Service Graphics

Question asked by behClevest on May 9, 2018
Latest reply on May 10, 2018 by rscheitlin

Using ArcGIS JavaScript API 3.24, can you please take a look at this snippet and let me know why I am not able to add Symbology to Feature Service out put by using ClassBreaksRenderer

Here is the code

 

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no">
<title>FeatureLayer</title>

<link rel="stylesheet" href="https://js.arcgis.com/3.24/esri/css/esri.css">
<script src="https://js.arcgis.com/3.24/"></script>

<style>
html, body, #map {
  padding: 0;
  margin: 0;
  height: 100%;
  width: 100%;
}
</style>

<script>
require([
    "esri/map",
    "esri/layers/FeatureLayer",
    "esri/renderers/ClassBreaksRenderer",
    "esri/symbols/SimpleMarkerSymbol",
    "esri/symbols/SimpleLineSymbol",
    "esri/symbols/SimpleFillSymbol",
    "esri/Color",
    "dojo/domReady!"
  ],
  function(
    Map,
     FeatureLayer,
     ClassBreaksRenderer,
     SimpleMarkerSymbol,
     SimpleLineSymbol,
     SimpleFillSymbol,
     Color
  ) {

    var map = new Map("map", {
      basemap: "hybrid",
      center: [-82.44109, 35.6122],
      zoom: 17
    });

    var featureLayer = new FeatureLayer("https://services.arcgis.com/V6ZHFr6zdgNZuVG0/arcgis/rest/services/Landscape_Trees/FeatureServer/0",{
            mode: FeatureLayer.MODE_SNAPSHOT,
            outFields: [ "*" ]  
       
    });
   var observationRenderer = new ClassBreaksRenderer(new SimpleMarkerSymbol(), "Ht_DBH_ft");
    observationRenderer.addBreak(3, 6,  new SimpleFillSymbol(SimpleFillSymbol.STYLE_SOLID,
    new SimpleLineSymbol(SimpleLineSymbol.STYLE_DASHDOT,
    new Color([12,255,12]), 2),new Color([12,255,12,1])
  ));
    observationRenderer.addBreak(0, 3,  new SimpleFillSymbol(SimpleFillSymbol.STYLE_SOLID,
    new SimpleLineSymbol(SimpleLineSymbol.STYLE_DASHDOT,
    new Color([255,0,0]), 2),new Color([128,255,128,1])
  ));
 
    map.addLayer(featureLayer);

  });
</script>
</head>

<body>
  <div id="map"></div>
</body>

</html>

Outcomes