-1

Can you please take a look at this demo and let me know why the added graphic to the snapping feature is not exactly added on top of the feature. Please try the fiddle and add a Point to the map by CTL key . after zooming the graphic you will notice the point is added to position of the cursor instead of Snapped point.

var map;

require(["esri/map",
  "esri/SnappingManager",
  "esri/toolbars/draw",
  "esri/layers/FeatureLayer",
  "esri/graphic",
  "esri/Color",
  "esri/symbols/SimpleMarkerSymbol",
  "esri/symbols/SimpleLineSymbol",
  "esri/symbols/SimpleFillSymbol",
  "dojo/keys",
  "dojo/domReady!"
], function(Map, SnappingManager, Draw, FeatureLayer, Graphic, Color, SimpleMarkerSymbol, SimpleLineSymbol, SimpleFillSymbol, keys) {
  map = new Map("map", {
    basemap: "topo",
    center: [-88.158805, 41.786075],
    zoom: 18
  });
  var sms = new SimpleMarkerSymbol(SimpleMarkerSymbol.STYLE_DIAMOND, 12,
    new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID, new Color([70, 0, 130, 1]), 1), new Color([70, 0, 130, 1]));
  var propertyLayer = new FeatureLayer("https://sampleserver6.arcgisonline.com/arcgis/rest/services/CommunityAddressing/FeatureServer/0", {
    mode: FeatureLayer.MODE_ONDEMAND,
    outFields: ["*"]
  });
  map.addLayers([propertyLayer]);

  $("#add").on("click", function() {
    var toolbar = new esri.toolbars.Draw(map);
    toolbar.activate(esri.toolbars.Draw.POINT);
    map.on("click", addGraphic);

    function addGraphic(evt) {
      var graphic = new Graphic(evt.mapPoint, sms);
      map.graphics.add(graphic);
      console.log(evt.mapPoint);
    }

  });


  propertyLayer.on("mouse-over", function(evt) {
    //console.log("Snapped")
  });
  var snapManager = map.enableSnapping({
    snapKey: keys.CTRL,
    tolerance: 50,
  });
  var layerInfos = [{
    layer: propertyLayer
  }];
  snapManager.setLayerInfos(layerInfos);

});
1

The problem was that you were using the mouse point to insert the graphic, instead of the snapping point. Here the code to use the snapping point:

var map;

require(["esri/map",
  "esri/SnappingManager",
  "esri/toolbars/draw",
  "esri/layers/FeatureLayer",
  "esri/graphic",
  "esri/Color",
  "esri/symbols/SimpleMarkerSymbol",
  "esri/symbols/SimpleLineSymbol",
  "esri/symbols/SimpleFillSymbol",
  "dojo/keys",
  "dojo/Deferred",
  "dojo/domReady!"
], function(Map, SnappingManager, Draw, FeatureLayer, Graphic, Color, SimpleMarkerSymbol, SimpleLineSymbol, SimpleFillSymbol, keys, Deferred) {
  map = new Map("map", {
    basemap: "topo",
    center: [-88.158805, 41.786075],
    zoom: 18
  });
  var sms = new SimpleMarkerSymbol(SimpleMarkerSymbol.STYLE_DIAMOND, 12,
    new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID, new Color([70, 0, 130, 1]), 1), new Color([70, 0, 130, 1]));
  var propertyLayer = new FeatureLayer("https://sampleserver6.arcgisonline.com/arcgis/rest/services/CommunityAddressing/FeatureServer/0", {
    mode: FeatureLayer.MODE_ONDEMAND,
    outFields: ["*"]
  });
  map.addLayers([propertyLayer]);

  $("#add").on("click", function() {
    var toolbar = new esri.toolbars.Draw(map);
    toolbar.activate(esri.toolbars.Draw.POINT);
    map.on("click", addGraphic);

    function addGraphic(evt) {      
      var deferred = map.snappingManager.getSnappingPoint(evt.screenPoint);
      deferred.then(function(value){
        var point;
        if(value !== undefined){
          point = value;
        } else {
          point = evt.mapPoint;
        }
        console.log(point);
        var graphic = new Graphic(point, sms);
        map.graphics.add(graphic);
      }, function(error){
        console.log('Error');
      });
    };
  });

  propertyLayer.on("mouse-over", function(evt) {
  //console.log("Snapped")
  });
  var snapManager = map.enableSnapping({
    snapKey: keys.CTRL,
    tolerance: 50,
  });
  var layerInfos = [{
    layer: propertyLayer
  }];
  snapManager.setLayerInfos(layerInfos);
});

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.