topic Re: Buffer with different colored rings in ArcGIS JavaScript Maps SDK Questions

Buffer with different colored rings

GraySanders — Tue, 25 Mar 2014 01:43:01 GMT

Hello, i need a little help. I created a web map that uses the buffer tool with 7 different rings. I want to change the color of each ring. Does anyone know how to do this?

Thanks, Gray

<script>
    dojo.require("esri.map");
    dojo.require("esri.tasks.geometry");

    var map = null;
    var gsvc = null;

    function initialize() {
      gsvc = new esri.tasks.GeometryService("http://tasks.arcgisonline.com/ArcGIS/rest/services/Geometry/GeometryServer");
      map.on("click", doBuffer);}

    function doBuffer(evt) {

      map.graphics.clear();
      var params = new esri.tasks.BufferParameters();
      params.geometries = [ evt.mapPoint ];

      //buffer in linear units such as meters, km, miles etc.
      params.distances = [ 100, 200, 300, 350, 400, 500, 540 ];
      params.unit = esri.tasks.GeometryService.UNIT_YARDS;
      params.outSpatialReference = map.spatialReference;

      gsvc.buffer(params, showBuffer);
    }

    function showBuffer(geometries) {
      var symbol = new esri.symbol.SimpleFillSymbol(
        esri.symbol.SimpleFillSymbol.STYLE_SOLID,
        new esri.symbol.SimpleLineSymbol(
          esri.symbol.SimpleLineSymbol.STYLE_SOLID,
          new dojo.Color([255,0,0,0.85]), 2
        ),
        new dojo.Color([0,0,0,0.06])
      );

      dojo.forEach(geometries, function(geometry) {
        var graphic = new esri.Graphic(geometry,symbol);
        map.graphics.add(graphic);
      });
    }

    dojo.ready(initialize);
</script>

[ATTACH=CONFIG]32460[/ATTACH]

Re: Buffer with different colored rings

JakeSkinner — Tue, 25 Mar 2014 12:14:47 GMT

Hi Gary,

You could add the buffer graphics to a GraphicsLayer and then symbolize the graphics layer using the UniqueValueRenderer class.

Here is an example. In the example, I added an attribute called 'ID' to each graphic and set the value to it's index value. This attribute is then used to display each buffer ring with the unique value renderer.

Re: Buffer with different colored rings

GraySanders — Tue, 25 Mar 2014 12:36:06 GMT

JSkinn3, Thank you it works great. I still have a lot to learn.

Gray

Re: Buffer with different colored rings

GraySanders — Mon, 31 Mar 2014 18:44:37 GMT

JSkinn3, could you please explain how to remove the renderer rings and draw a new set when the map is clicked a second time. I have tried a few different things, but i think this is what I should use - map.removeLayer(graphicsLayer);. This however returns an error (graphicsLayer is not defined).

Thanks,
Gray

Re: Buffer with different colored rings

JakeSkinner — Mon, 31 Mar 2014 19:20:49 GMT

Hi Gray,

Instead of creating the GraphicsLayer each time the showBuffer function is run, you can create it when the map is loaded. You can then use the GraphicsLayer clear method. Here is an example.

If this resolves your issue, don't forget to mark this thread as resolved/answered to help other users in the community.

Re: Buffer with different colored rings

GraySanders — Mon, 31 Mar 2014 19:56:11 GMT

JSkinn3, that was it.

Thanks
Gray