BritishSteel

Adding a Marker to the Map after Geocoding

Discussion created by BritishSteel on Oct 30, 2013
Latest reply on Nov 5, 2013 by enigma2522
Hi everyone,

I�??ve been struggling with this for hours so I need to ask here. I am trying to search an address in my geocoder and then, after zooming and centering, also add a marker to that place. This seemingly simple task seems to be pretty complicated for a beginner.
It seems like all samples that are doing what I want in AMD are all using the Locator, but not the Geolocator. So, I ended up translating this code, but I get stuck.

First, here is the legacy code, where I took out everything that I do not need (I do not need a pop up, etc.)

        // add a graphics layer for geocoding results
        map.addLayer(new esri.layers.GraphicsLayer({
          id: "results"
        }));

        // create the geocoder
        geocoder = new esri.dijit.Geocoder({ 
          autoNavigate: false, // do not zoom to best result
          maxLocations: 20, // increase number of results returned
          map: map,
          arcgisGeocoder: {
            url: "http://geocode.arcgis.com/arcgis/rest/services/World/GeocodeServer",
            name: "Esri World Geocoder",
            placeholder: "Find a place",
            sourceCountry: "USA" // limit search to the United States
          }
        }, "search");
        geocoder.startup();

        var symbol = new esri.symbol.PictureMarkerSymbol({
          "angle":0,
          "xoffset":0,
          "yoffset":10,
          "type":"esriPMS",
          "url":"http://static.arcgis.com/images/Symbols/Shapes/BluePin1LargeB.png",
          "contentType":"image/png",
          "width":24,
          "height":24
        });


        dojo.connect(geocoder, "onFindResults", function(response) {
          var l = map.getLayer("results");
          l.clear();
          map.infoWindow.hide();
          dojo.forEach(response.results, function(r) {
            r.feature.setSymbol(symbol);
            l.add(r.feature);
          });
        });



And here is my AMD translation:

  // add graphics layer for result
  mainMap.addLayer(new GraphicsLayer({
          id: "results"
        }));  
  
  // create geocoder
  var geocoder = new Geocoder({
   map: mainMap,
   autoComplete: true,
   arcgisGeocoder: {
    suffix: " Long Beach, CA",
    name: "Esri World Geocoder",
    placeholder: "find address within Long Beach"
    },
  }, "addressFindDIV");  // name of the div it is referring to
  geocoder.startup();
  

  // create new PictureMarkerSymbol object using a JSON object
  var symbol = new PictureMarkerSymbol({
          "angle":0,
          "xoffset":0,
          "yoffset":10,
          "type":"esriPMS",
          "url":"http://static.arcgis.com/images/Symbols/Shapes/BluePin1LargeB.png",
          "contentType":"image/png",
          "width":24,
          "height":24
        });
    
  geocoder.on("find-results", function(response){
          var l = mainMap.getLayer("results");
          l.clear();
          mainMap.infoWindow.hide();
          array.forEach(response.results, function(r) {
            r.feature.setSymbol(symbol);
            l.add(r.feature);
  
           });
        });



I am absolutely not sure about the following line:

dojo.forEach(response.results, function(r) {

         

I changed it to

array.forEach(response.results, function(r) {


But that does not work either and I am not sure if it is the right approach.

I am not tied to this sample; if any other approach is recommended or easier, please share it with me. As long as I can see a symbol (a simple point is fine) I would be happy.

Thank you!

Outcomes