0

Using ArcGIS JavaScript API 3.21 and This Demo Fiddle I am trying to create a bufferd area on click event but apparently this is not showing any graphic on bufferLayer graphics Layer

require([
  "esri/map",
  "esri/SpatialReference",
  "esri/graphic",
  "esri/layers/GraphicsLayer",
  "esri/Color", 
  "esri/geometry/Point",
  "esri/geometry/geometryEngine",
  "esri/symbols/SimpleMarkerSymbol",
  "esri/symbols/SimpleLineSymbol", 
  "esri/symbols/SimpleFillSymbol", 
  "esri/renderers/SimpleRenderer",
  "dojo/domReady!"
], function(
  Map,
  SpatialReference,
  Graphic,
  GraphicsLayer,
  Color,
  Point,
  geometryEngine,
  SimpleMarkerSymbol,  
  SimpleLineSymbol, 
  SimpleFillSymbol, 
  SimpleRenderer
) {
  var map = new Map("map", {
    basemap: "streets", 
    center: [-122.4, 37.785],
    zoom: 14, 
  });

  var buffSymb = new SimpleFillSymbol(
    SimpleFillSymbol.STYLE_NULL,
    new SimpleLineSymbol(
      SimpleLineSymbol.STYLE_SHORTDASHDOTDOT,
      new Color([105, 105, 105]),
      2
    ), new Color([255, 255, 0, 0.25])
  );

  var graphicsLayer = new GraphicsLayer();
  var bufferLayer = new GraphicsLayer();
  map.addLayer(graphicsLayer);

  map.on("click", function(evt){
    var buffer = geometryEngine.geodesicBuffer(
      new Point(evt.mapPoint.x, evt.mapPoint.y),
      1000,
      "meters"
    );
    bufferLayer.add(new Graphic(buffer, buffSymb));
    map.addLayer(bufferLayer);
  });
});

I am not getting any error message but also no result back! can you please take a look at this and let me know what I am doing wrong?

2

You give to the geodesicBuffer function, a new Point without specifying its spatial reference, while you could just give evt.mapPoint which is already a Point :

var buffer = geometryEngine.geodesicBuffer(
  evt.mapPoint,
  1000,
  "meters"
);

Then, you add the bufferLayer everytime the user clicks on the map, you should add it to the map, at the start of your app :

var graphicsLayer = new GraphicsLayer();
var bufferLayer = new GraphicsLayer();
map.addLayers([graphicsLayer, bufferLayer]);

map.on("click", function(evt) {
  var buffer = geometryEngine.geodesicBuffer(
    evt.mapPoint,
    1000,
    "meters"
  );
  var graphic = new Graphic(buffer, buffSymb);
  bufferLayer.add(graphic);
});

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.