topic Re: Address Locator - what am I doing wrong? in ArcGIS JavaScript Maps SDK Questions

Address Locator - what am I doing wrong?

MatthewGerbrandt — Sun, 12 Dec 2021 05:24:57 GMT

Hello there. I've got an Address Locator set up and it seems to be working. When I go to the service properties and enter the address "202 Birch Loop", it returns results as expected:

http://restdata.umatilla.nsn.us/ArcGIS/rest/services/CTUIRAddressLocator/GeocodeServer/findAddressCandidates?Street=202+Birch+Loop&outFields=&outSR=&f=html

Using code from the JS Samples (http://resources.esri.com/help/9.3/arcgisserver/apis/javascript/arcgis/help/jssamples_start.htm#jssamples/locator_address.html), I tried to create a web page. Unfortunately, when I click the button to execute the search and return results to my map, nothing happens.

If someone could please look at my code and tell me what I'm doing wrong, I'd really, really appreciate it.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=7" />
    <title>Find Address</title>
    <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/1.6/js/dojo/dijit/themes/tundra/tundra.css">
    <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=1.6"></script>
    <script type="text/javascript">
        dojo.require("esri.map");
        dojo.require("esri.tasks.locator");

        var map, locator;

        function init() {
            
            map = new esri.Map("map", { extent: new esri.geometry.Extent(358704.7747, 5019963.41681, 400356.3737, 5074307.67359, new esri.SpatialReference({ wkid: 26911 }))
            });
            var BoundaryLayer = new esri.layers.ArcGISDynamicMapServiceLayer("http://restdata.umatilla.nsn.us/ArcGIS/rest/services/ReservationBoundary/MapServer");
            map.addLayer(BoundaryLayer);

            locator = new esri.tasks.Locator("http://restdata.umatilla.nsn.us/ArcGIS/rest/services/CTUIRAddressLocator/GeocodeServer");
            dojo.connect(locator, "onAddressToLocationsComplete", showResults);
        }

        function locate() {
            map.graphics.clear();
            // this service was published using ArcGIS Server 10, so the following format should work...
            var StreetName = { "SingleLine": "202 Birch Loop" };
            locator.addressToLocations(StreetName);
        }

        function showResults(candidates) {
            var candidate;
            var symbol = new esri.symbol.SimpleMarkerSymbol();
            var infoTemplate = new esri.InfoTemplate("Location", "Address: ${address}<br />Score: ${score}<br />Source locator: ${locatorName}");

            symbol.setStyle(esri.symbol.SimpleMarkerSymbol.STYLE_DIAMOND);
            symbol.setColor(new dojo.Color([255, 0, 0, 0.75]));

            var points = new esri.geometry.Multipoint(map.spatialReference);

            for (var i = 0, il = candidates.length; i < il; i++) {
                candidate = candidates;
                if (candidate.score > 70) {
                    var attributes = { address: candidate.StreetName, score: candidate.score, locatorName: candidate.attributes.StreetName };
                    var graphic = new esri.Graphic(candidate.location, symbol, attributes, infoTemplate);
                    map.graphics.add(graphic);
                    map.graphics.add(new esri.Graphic(candidate.location, new esri.symbol.TextSymbol(attributes.address).setOffset(0, 8)));
                    points.addPoint(candidate.location);
                }
            }
            map.setExtent(points.getExtent().expand(3));
        }

        dojo.addOnLoad(init);
    </script>
  </head>
  <body class="tundra">
    Address : <input type="text" id="address" size="60" value="202 Birch Loop" /> 
    <input type="button" value="Locate" onclick="locate()" /><br /><label id="label1" title="asdf" />
    <br />
    <div id="map" style="width:1200px; height:600px; border:1px solid #000;"></div>
  </body>
</html>

Thank you very, very much in advance for your time and expertise!

Re: Address Locator - what am I doing wrong?

derekswingley1 — Wed, 12 Oct 2011 15:36:03 GMT

Try with the latest version of the API: http://help.arcgis.com/en/webapi/javascript/arcgis/index.html

Let us know if you have any luck using v2.5 and this sample as a template: http://help.arcgis.com/en/webapi/javascript/arcgis/help/jssamples/locator_address.html

Re: Address Locator - what am I doing wrong?

MatthewGerbrandt — Sun, 12 Dec 2021 05:25:00 GMT

Thanks for the heads-up, Derek. I've re-created the web page using the latest API but I'm having the same problem as before - no errors, no results.

The problem may be in the follow assignment:

geom = candidate.location;

My service has no "location" attribute. Then again, I couldn't find one in the ESRI sample, either. I'm totally mystified here, folks. All help is greatly appreciated.

Here's my modified version of the sample code and I've tried to bold all of the changes I made:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
<html> 
  <head> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> 
    <meta http-equiv="X-UA-Compatible" content="IE=7" /> 
    <!--The viewport meta tag is used to improve the presentation and behavior of the samples  
      on iOS devices--> 
    <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"/> 
    <title>Find Address</title> 
    <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/2.5/js/dojo/dijit/themes/claro/claro.css"> 
     
    <style> 
      html, body {  
        height: 100%; width: 100%; 
        margin: 0; padding: 0; 
      }  
      #map{  
        padding:0; 
        border:solid 1px #343642; 
        margin:5px 5px 5px 0px; 
      } 
      .roundedCorners{ 
        -webkit-border-radius: 4px; 
        -moz-border-radius: 4px; 
        border-radius: 4px; 
      } 
      .shadow{ 
         box-shadow: 4px 4px 8px #adadad; 
        -webkit-box-shadow: 4px 4px 8px #adadad; 
        -moz-box-shadow: 4px 4px 8px #adadad; 
        -o-box-shadow: 4px 4px 8px #adadad; 
      }     
      #leftPane{ 
        width:20%; 
        border-top: solid 1px #343642; 
        border-left: solid 1px #343642; 
        border-bottom: solid 1px #343642; 
        background-color:#DCDAC5;  
        margin:5px 0px 5px 5px; 
        color: #343642; 
        font:100% Georgia,"Times New Roman",Times,serif; 
        letter-spacing: 0.05em; 
      } 
     </style> 
 
    <script type="text/javascript">
        var djConfig = {
            parseOnLoad: true
        }; 
    </script> 
     
    <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=2.5"></script> 
    <script type="text/javascript">
        dojo.require("esri.map");
        dojo.require("esri.tasks.locator");
        dojo.require("dojo.number");
        dojo.require("dijit.form.Button");
        dojo.require("dijit.form.Textarea");
        dojo.require("dijit.layout.BorderContainer");
        dojo.require("dijit.layout.ContentPane");


        var map, locator;

        function init() {
            var initExtent = new esri.geometry.Extent({ "xmin": -13343554, "ymin": 2967656, "xmax": -7473190, "ymax": 5902838, "spatialReference": { "wkid": 102100} });
            map = new esri.Map("map", { extent: initExtent });

            var tiledMapServiceLayer = new esri.layers.ArcGISTiledMapServiceLayer("http://server.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer");
            map.addLayer(tiledMapServiceLayer);

            dojo.connect(map, 'onLoad', function(map) {
                //resize the map when the browser resizes 
                dojo.connect(dijit.byId('map'), 'resize', map, map.resize);
            });


            locator = new esri.tasks.Locator("http://restdata.umatilla.nsn.us/ArcGIS/rest/services/CTUIRAddressLocator/GeocodeServer");
            dojo.connect(locator, "onAddressToLocationsComplete", showResults);

            map.infoWindow.resize(200, 125);
        }

        function locate() {
            map.graphics.clear();
            var Street = { "SingleLine": dojo.byId("address").value };
            locator.outSpatialReference = map.spatialReference;
            locator.addressToLocations(Street);
        }

        function showResults(candidates) {
            var candidate;
            var symbol = new esri.symbol.SimpleMarkerSymbol();
            var infoTemplate = new esri.InfoTemplate("Location", "Address: ${address}<br />Score: ${score}<br />Source locator: ${locatorName}");

            symbol.setStyle(esri.symbol.SimpleMarkerSymbol.STYLE_SQUARE);
            symbol.setColor(new dojo.Color([153, 0, 51, 0.75]));

            var geom;

            dojo.every(candidates, function(candidate) {
                console.log(candidate.score);
                if (candidate.score > 80) {
                    console.log(candidate.location);
                    var attributes = { address: candidate.Street, score: candidate.score, locatorName: candidate.attributes.Street };
                    geom = candidate.location;  // this may be my problem
                    var graphic = new esri.Graphic(geom, symbol, attributes, infoTemplate);
                    //add a graphic to the map at the geocoded location 
                    map.graphics.add(graphic);
                    //add a text symbol to the map listing the location of the matched address.
                    var displayText = candidate.Street;
                    var font = new esri.symbol.Font("16pt", esri.symbol.Font.STYLE_NORMAL, esri.symbol.Font.VARIANT_NORMAL, esri.symbol.Font.WEIGHT_BOLD, "Helvetica");

                    var textSymbol = new esri.symbol.TextSymbol(displayText, font, new dojo.Color("#666633"));
                    textSymbol.setOffset(0, 8);
                    map.graphics.add(new esri.Graphic(geom, textSymbol));
                    return false; //break out of loop after one candidate with score greater  than 80 is found. 
                }
            });
            if (geom !== undefined) {
                map.centerAndZoom(geom, 12);
            }

        }

        dojo.addOnLoad(init); 
    </script> 
  </head> 
  <body class="claro"> 
    <div id="mainWindow" dojotype="dijit.layout.BorderContainer" design="sidebar" gutters="false" style="width:100%; height:100%;"> 
      <div id="leftPane" class="roundedCorners" dojotype="dijit.layout.ContentPane" region="left"> 
        Enter an address:  
        <br /> 
        <textarea type="text" id="address"/>202 Birch Loop</textArea> 
        <br /> 
        <button dojotype="dijit.form.Button" onclick="locate()"> Locate</button>  
      </div> 
      <div id="map" class="roundedCorners shadow" dojotype="dijit.layout.ContentPane" region="center"> 
      </div> 
    </div> 
  </body> 
</html>

Re: Address Locator - what am I doing wrong?

derekswingley1 — Sun, 12 Dec 2021 05:25:02 GMT

What are you using to debug your app?

I prefer a mix of firefox+firebug and chrome (with its built-in dev tools).

If I take a look at the network section of Chrome dev tools, I see this request being sent when the "Locate" button is clicked: http://restdata.umatilla.nsn.us/ArcGIS/rest/services/CTUIRAddressLocator/GeocodeServer/findAddressCandidates?SingleLine=202%20Birch%20Loop&f=json&outSR={%22wkid%22%3A102100}&callback=dojo.io.script.jsonp_dojoIoScript2._jsonpCallback

So...the street parameter is missing.

Change this:

var Street = { "SingleLine": dojo.byId("address").value };

To this:

var Street = { "Street": dojo.byId("address").value };

Re: Address Locator - what am I doing wrong?

derekswingley1 — Sun, 12 Dec 2021 05:25:05 GMT

Also, for future debugging, it's a good idea to pass an errBack function when calling addressToLocations or connect to your locator's onError event to log events(this applies to all tasks in the JS API). Something like this:

dojo.connect(locator, "onError", errorHandler);

Re: Address Locator - what am I doing wrong?

HemingZhu — Sun, 12 Dec 2021 05:25:08 GMT

Also, for future debugging, it's a good idea to pass an errBack function when calling addressToLocations or connect to your locator's onError event to log events(this applies to all tasks in the JS API). Something like this:
dojo.connect(locator, "onError", errorHandler);

I remembered a while ago there is similiar issue with locator. The solution will be use javascript Object instead of JSON to specify your address parameter. It's more consistent.
Replace your statement var Street = { "SingleLine": dojo.byId("address").value }; with these:
var Street =new Object();
Street.Street =dojo.byId("address").value;
I am pretty sure it will work.

Re: Address Locator - what am I doing wrong?

derekswingley1 — Wed, 12 Oct 2011 20:22:34 GMT

The solution will be use javascript Object instead of JSON to specify your address parameter. It's more consistent.
Replace your statement var Street = { "SingleLine": dojo.byId("address").value }; with these:
var Street =new Object();
Street.Street =dojo.byId("address").value;
I am pretty sure it will work.

Heming- those two produce the same thing, it's just two different syntactical styles. After all, JSON stands for JavaScript Object Notation. Explicitly creating an object via new Object() or with object literal notation will produce the same thing.

In the case of gis_tech's code, the problem was the name of the property being specified. The locator expected "Streets" and the code was using "SingleLine".

Re: Address Locator - what am I doing wrong?

HemingZhu — Thu, 13 Oct 2011 12:24:08 GMT

Heming- those two produce the same thing, it's just two different syntactical styles. After all, JSON stands for JavaScript Object Notation. Explicitly creating an object via new Object() or with object literal notation will produce the same thing.

In the case of gis_tech's code, the problem was the name of the property being specified. The locator expected "Streets" and the code was using "SingleLine".

I would not say JSON and Javascript Object is the same thing. JSON is subset of the Object (it only specifies properties not the methods, you can say JSON is Object, not the way around). The reason i answer this poster is that me and someone else had the similiar issues before http://forums.arcgis.com/threads/23457-Geocoding-Service-Not-returning-Candidates-to-quot-Application-quot?p=77315#post77315 . Using new Object() is the solution i found. Since Javascript is dynamic, weakly typed script language, so specifing new object let Javascript runtime deal with it. Quite frankly it works great for me dealing with all the JSON input and do not have to warry about the formats such as single quote or double quotes and orders (like in geoprocessing parameters).

Re: Address Locator - what am I doing wrong?

derekswingley1 — Thu, 13 Oct 2011 14:25:22 GMT

True, JSON is a subset of object literal notation. But functionally, using a JSON object or creating an object via the new keyword will produce the same result. JSON does have more constraints but in the specific case outlined by gis_tech, the problem was the property name, not the syntax used to create the object.

Re: Address Locator - what am I doing wrong?

HemingZhu — Thu, 13 Oct 2011 14:48:40 GMT

True, JSON is a subset of object literal notation. But functionally, using a JSON object or creating an object via the new keyword will produce the same result. JSON does have more constraints but in the specific case outlined by gis_tech, the problem was the property name, not the syntax used to create the object.

Me and someone else had the same issue before. I am pretty sure the problem was not the property names and it is the syntax that i used that made the difference. Obviously there is something that did not produce the same result. If ESRI really wants to help guys that post the problems and seek help, should tackle the issue (such as var Street = { "Single Line Input": dojo.byId("address").value}; -why it doesn't work). I think 22 years of education plus 12 years of programming definitely help me understand the difference between JSON data object and Javascript Object.

Re: Address Locator - what am I doing wrong?

derekswingley1 — Thu, 13 Oct 2011 14:56:29 GMT

If ESRI really wants to help guys that post the problems and seek help, should tackle the issue (such as var Street = { "Single Line Input": dojo.byId("address").value}; -why it doesn't work).

I'm not sure I understand. Isn't my second post in this thread outlining the specific problem and describing how to fix it? Using anything other than "Street" for the address property name will not work because the locator expects a parameter named "Street".

Maybe gis_tech could provide some feedback on the answers provided in this thread?

Re: Address Locator - what am I doing wrong?

MatthewGerbrandt — Thu, 13 Oct 2011 15:43:48 GMT

swingley - Thank you very much for your reply - you've solved my problem!

Re: Address Locator - what am I doing wrong?

derekswingley1 — Thu, 13 Oct 2011 15:46:31 GMT

Glad to help!