topic Re: find sample Reverse geocode | ArcGIS API for JavaScriptfor 4.8 in ArcGIS JavaScript Maps SDK Questions

find sample Reverse geocode | ArcGIS API for JavaScriptfor 4.8

HsuKao-Ming — Tue, 14 Aug 2018 03:45:02 GMT

Hey gutys:

I want to find sample Reverse geocode | ArcGIS API for JavaScriptfor 4.8 than search[ lon, lat] to address(not click map to address).

but I didn't find this

So where can I go to find this

Ask for help

THANKS

Re: find sample Reverse geocode | ArcGIS API for JavaScriptfor 4.8

RobertScheitlin__GISP — Sat, 11 Dec 2021 19:38:36 GMT

Hsu,

Here is the 3.x sample updated to 4.8:

<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">

    <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
    <title>Find Address</title>
    <link rel="stylesheet" href="https://js.arcgis.com/4.8/esri/css/main.css">

    <style>
      html, body { height: 100%; width: 100%; margin: 0; padding: 0; }
      #map {
        padding: 0;
        border: solid 2px #666;
        margin: 0 5px 5px 5px;
      }
      #header {
        border: solid 2px #666;
        color: #666;
        font-family: sans-serif;
        font-size: 1.1em;
        height: auto;
        margin: 5px;
        overflow: hidden;
        padding: 10px 0 10px 20px;
        text-align:left;
      }
      .roundedCorners {
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        border-radius: 5px;
      }
    </style>

    <script src="https://js.arcgis.com/4.8/"></script>
    <script>
      var map;
      require([
        "esri/Map", "esri/views/MapView", "esri/tasks/Locator", "esri/Graphic",
        "esri/geometry/support/webMercatorUtils",
        "esri/PopupTemplate",
        "dojo/number", "dojo/parser",
        "dijit/layout/BorderContainer", "dijit/layout/ContentPane", "dojo/domReady!"
      ], function(
        Map, MapView, Locator, Graphic,
        webMercatorUtils,
        PopupTemplate,
        number, parser
      ) {
        parser.parse();

        map = new Map({
          basemap: "streets"
        });

        var view = new MapView({
          container: "map",
          map: map,
          center: [-118.3, 34.2],
          zoom: 11
        });

        var locator = new Locator("https://geocode.arcgis.com/arcgis/rest/services/World/GeocodeServer");

        var infoTemplate = new PopupTemplate({
          title: "Location",
          content: "Address: {Address}"
        });

        view.on("click", function(evt) {
          view.graphics.removeAll();
          locator.locationToAddress(webMercatorUtils.webMercatorToGeographic(evt.mapPoint), 100).then(function(evt){
            if (evt.address) {
              var address = {Address: evt.address};
              var location = webMercatorUtils.geographicToWebMercator(evt.location);
              var graphic = new Graphic({
                geometry: location,
                symbol: {
                  type: "simple-marker",  // autocasts as new SimpleMarkerSymbol()
                  color: "blue",
                  size: 8,
                  outline: {  // autocasts as new SimpleLineSymbol()
                    width: 0.5,
                    color: "darkblue"
                  }
                },
                attributes: address,
                popupTemplate: infoTemplate
              });
              view.graphics.add(graphic);

              //display the info window with the address information
              view.popup.open({
                features: [graphic],
                location: location
              });
            }
          });
        });
      });
    </script>
  </head>
  <body class="claro">
    <div id="mainWindow" data-dojo-type="dijit/layout/BorderContainer"
         data-dojo-props="design:'headline', gutters:false"
         style="width:100%; height:100%;">

      <div id="header" class="roundedCorners"
           data-dojo-type="dijit/layout/ContentPane"
           data-dojo-props="region:'top'">
        <span>Click the map to get the address for the input location.</span>
      </div>
      <div id="map" class="roundedCorners"
           data-dojo-type="dijit/layout/ContentPane"
           data-dojo-props="region:'center'">
      </div>
    </div>
  </body>
</html>
‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Don't forget to mark this question as answered by clicking on the "Mark Correct" link on the reply that answered your question.

Re: find sample Reverse geocode | ArcGIS API for JavaScriptfor 4.8

HsuKao-Ming — Wed, 15 Aug 2018 04:14:24 GMT

Thanks

but I want "search[ lon, lat] to address(not click map to address)"

this my code:

var locator = new Locator("http://geocode.arcgis.com/arcgis/rest/services/World/GeocodeServer");
var x = parseFloat(lon);
var y = parseFloat(lat);
var pt = new Point(x, y, new SpatialReference({ wkid: 4326 }));

-------------------------------------------------------

got error this :

Uncaught TypeError: c.indexOf is not a function
at Object.m (dojo.js:315)
at Object.set (dojo.js:228)
at Object.postscript (dojo.js:227)
at new <anonymous> (dojo.js:237)
at Location.js?20161027:381
at K (dojo.js:18)
at dojo.js:19
at E (dojo.js:19)
at da (dojo.js:19)
at e (dojo.js:21)

How can I do this ?

Re: find sample Reverse geocode | ArcGIS API for JavaScriptfor 4.8

RobertScheitlin__GISP — Sat, 11 Dec 2021 19:38:39 GMT

Hsu,

Your code:

var pt = new Point(x, y, new SpatialReference({ wkid: 4326 }));‍

was the way it was done in 3.x API. In the 4.x API you need to provide an object in the Point constructor that specifies the objects property names:

var pt = new Point({x: x, y: y, spatialReference: new SpatialReference({ wkid: 4326 })});‍

Here is an updated sample:

<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">

    <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
    <title>Find Address</title>
    <link rel="stylesheet" href="https://js.arcgis.com/4.8/esri/css/main.css">

    <style>
      html, body { height: 100%; width: 100%; margin: 0; padding: 0; }
      #map {
        padding: 0;
        border: solid 2px #666;
        margin: 0 5px 5px 5px;
      }
      #header {
        border: solid 2px #666;
        color: #666;
        font-family: sans-serif;
        font-size: 1.1em;
        height: auto;
        margin: 5px;
        overflow: hidden;
        padding: 10px 0 10px 20px;
        text-align:left;
      }
      .roundedCorners {
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        border-radius: 5px;
      }
    </style>

    <script src="https://js.arcgis.com/4.8/"></script>
    <script>
      var map;
      require([
        "esri/Map", "esri/views/MapView", "esri/tasks/Locator", "esri/Graphic",
        "esri/geometry/support/webMercatorUtils",
        "esri/PopupTemplate", "esri/geometry/SpatialReference", "esri/geometry/Point",
        "dojo/number", "dojo/parser", "dojo/dom", "dojo/on",
        "dijit/layout/BorderContainer", "dijit/layout/ContentPane", "dojo/domReady!"
      ], function(
        Map, MapView, Locator, Graphic,
        webMercatorUtils,
        PopupTemplate, SpatialReference, Point,
        number, parser, dom, on
      ) {
        parser.parse();

        map = new Map({
          basemap: "streets"
        });

        var view = new MapView({
          container: "map",
          map: map,
          center: [-118.3, 34.2],
          zoom: 11
        });

        var locator = new Locator("https://geocode.arcgis.com/arcgis/rest/services/World/GeocodeServer");

        var infoTemplate = new PopupTemplate({
          title: "Location",
          content: "Address: {Address}"
        });

        on(dom.byId('btnGo'), 'click', function(){
          var lon = dom.byId('Lon').value;
          var lat = dom.byId('Lat').value;
          var x = parseFloat(lon);
          var y = parseFloat(lat);
          var pt = new Point({
            x: x,
            y: y,
            spatialReference: new SpatialReference({ wkid: 4326 })
          });
          locator.locationToAddress(pt, 100).then(function(evt){
            if (evt.address) {
              var address = {Address: evt.address};
              var location = webMercatorUtils.geographicToWebMercator(evt.location);
              var graphic = new Graphic({
                geometry: location,
                symbol: {
                  type: "simple-marker",  // autocasts as new SimpleMarkerSymbol()
                  color: "blue",
                  size: 8,
                  outline: {  // autocasts as new SimpleLineSymbol()
                    width: 0.5,
                    color: "darkblue"
                  }
                },
                attributes: address,
                popupTemplate: infoTemplate
              });
              view.graphics.add(graphic);

              //display the info window with the address information
              view.popup.open({
                features: [graphic],
                location: location
              });
            }
          });
        });

        view.on("click", function(evt) {
          view.graphics.removeAll();
          console.info(webMercatorUtils.webMercatorToGeographic(evt.mapPoint));
          locator.locationToAddress(webMercatorUtils.webMercatorToGeographic(evt.mapPoint), 100).then(function(evt){
            if (evt.address) {
              var address = {Address: evt.address};
              var location = webMercatorUtils.geographicToWebMercator(evt.location);
              var graphic = new Graphic({
                geometry: location,
                symbol: {
                  type: "simple-marker",  // autocasts as new SimpleMarkerSymbol()
                  color: "blue",
                  size: 8,
                  outline: {  // autocasts as new SimpleLineSymbol()
                    width: 0.5,
                    color: "darkblue"
                  }
                },
                attributes: address,
                popupTemplate: infoTemplate
              });
              view.graphics.add(graphic);

              //display the info window with the address information
              view.popup.open({
                features: [graphic],
                location: location
              });
            }
          });
        });
      });
    </script>
  </head>
  <body class="claro">
    <div id="mainWindow" data-dojo-type="dijit/layout/BorderContainer"
         data-dojo-props="design:'headline', gutters:false"
         style="width:100%; height:100%;">

      <div id="header" class="roundedCorners"
           data-dojo-type="dijit/layout/ContentPane"
           data-dojo-props="region:'top'">
        <span>Click the map to get the address for the input location.</span>
        <input type='text' id='Lat' value="34.250812723611325"></input>
        <input type='text' id='Lon' value='-118.51732330322035'></input>
        <button type="button" id='btnGo'>Locate</button>
      </div>
      <div id="map" class="roundedCorners"
           data-dojo-type="dijit/layout/ContentPane"
           data-dojo-props="region:'center'">
      </div>
    </div>
  </body>
</html>
‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Re: find sample Reverse geocode | ArcGIS API for JavaScriptfor 4.8

HsuKao-Ming — Sat, 11 Dec 2021 19:38:42 GMT

Thank your help

I have two questions.

this my code.

var locator = new Locator("https://geocode.arcgis.com/arcgis/rest/services/World/GeocodeServer");
var x = parseFloat(-118.51732330322035);
var y = parseFloat(34.250812723611325);
var pt = new Point({
x: x,
y: y,
spatialReference: new SpatialReference({ wkid: 4326 })
});
locator.locationToAddress(pt, 100).then(function(evt){
if (evt.address) {
var address = {Address: evt.address};

}
});

---------------------------------------------------------

get error this:

Uncaught TypeError: a.clone(...).normalize is not a function
at Object.b.locationToAddress (Locator.js:8)
at Location.js?20161027:388
at K (dojo.js:18)
at dojo.js:19
at E (dojo.js:19)
at da (dojo.js:19)
at e (dojo.js:21)
at HTMLScriptElement.<anonymous> (dojo.js:23)

What have I ignored?

2.The sample you provided

var address = {Address: evt.address};

I want to get "Match_addr" , but I can't
Why?
{"address":{"Match_addr":"17545 Lassen St, Northridge, California, 91325","LongLabel":"17545 Lassen St, Northridge, CA, 91325, USA","ShortLabel":"17545 Lassen St","Addr_type":"PointAddress","Type":"","PlaceName":"","AddNum":"17545","Address":"17545 Lassen St","Block":"","Sector":"","Neighborhood":"Northridge","District":"","City":"Northridge","MetroArea":"Los Angeles Metro Area","Subregion":"Los Angeles County","Region":"California","Territory":"","Postal":"91325","PostalExt":"","CountryCode":"USA"},"location":{"x":-118.51724250000001,"y":34.250362478792603,"spatialReference":{"wkid":4326,"latestWkid":4326}}}

Re: find sample Reverse geocode | ArcGIS API for JavaScriptfor 4.8

RobertScheitlin__GISP — Thu, 16 Aug 2018 13:04:34 GMT

Hsu,

Don't forget to mark this question as answered by clicking on the "Mark Correct" link on the reply that answered your question.

var x = parseFloat(-118.51732330322035);
var y = parseFloat(34.250812723611325);

You are telling the parseFloat function to parse a number (which make no sense). The parseFloat is for making a sting a number.

This would be correct:

var x = parseFloat('-118.51732330322035');
var y = parseFloat('34.250812723611325');

2. Because Match_addr is not part of the evt object it is part of the evt.attributes object:

var address = {Address: evt.attributes.Match_addr};

Re: find sample Reverse geocode | ArcGIS API for JavaScriptfor 4.8

HsuKao-Ming — Fri, 17 Aug 2018 00:59:03 GMT

THANK Your Tips.

but I have the 1 same error again.

mycode:

require([
"esri/Map",
"esri/views/MapView",
"esri/widgets/Search",
"esri/Graphic",
"esri/geometry/Point",
"esri/tasks/Locator",
"esri/geometry/SpatialReference",
"esri/PopupTemplate",
"dojo/domReady!"
],
function(Map, MapView, Search,
Point,
SpatialReference, Locator
) {

var locator = new Locator("https://geocode.arcgis.com/arcgis/rest/services/World/GeocodeServer");

var x = parseFloat('-118.51732330322035');
var y = parseFloat('34.250812723611325');
var pt = new Point({
x: x,
y: y,
spatialReference: new SpatialReference({ wkid: 4326 })
});

locator.locationToAddress(pt, 100).then(function(evt){
if (evt.address) {
var address = {Address: evt.address};

}
});

---------------------------------------------------------------------------------

get error this.

Please help again.

THANKS

Re: find sample Reverse geocode | ArcGIS API for JavaScriptfor 4.8

RobertScheitlin__GISP — Sat, 11 Dec 2021 19:38:45 GMT

Hsu,

Your requires are out of order:

require([
"esri/Map",
"esri/views/MapView",
"esri/widgets/Search",
"esri/Graphic",
"esri/geometry/Point", 
"esri/tasks/Locator", 
"esri/geometry/SpatialReference", 
"esri/PopupTemplate",
"dojo/domReady!"
],
function(
Map
MapView,
Search,
Point, 
SpatialReference,
Locator
) {‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

it should be:

require([
  "esri/Map",
  "esri/views/MapView",
  "esri/widgets/Search",
  "esri/Graphic",
  "esri/geometry/Point", 
  "esri/tasks/Locator", 
  "esri/geometry/SpatialReference", 
  "esri/PopupTemplate",
  "dojo/domReady!"
],
function(
  Map
  MapView,
  Search,
  Graphic,
  Point,
  Locator,
  SpatialReference,
  PopupTemplate
) {‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Notice, line 2 = line 13, 3 = 13, etc, etc

Re: find sample Reverse geocode | ArcGIS API for JavaScriptfor 4.8

HsuKao-Ming — Mon, 20 Aug 2018 01:44:19 GMT

Thank your help.

My other two questions.
1. There is something wrong with the address returned by location. If I want to provide information and ask you to modify it.
What should I do?
Because some locations return the store name, it is not the address of the return details.
2.google api "timezone", is there a way to convert?

Re: find sample Reverse geocode | ArcGIS API for JavaScriptfor 4.8

RobertScheitlin__GISP — Mon, 20 Aug 2018 12:49:54 GMT

Hsu,

I have never run into that situation. You have looked through all the attributes in the returned event and are sure the infomation you need is not returned right?
"google api" ???....

Re: find sample Reverse geocode | ArcGIS API for JavaScriptfor 4.8

HsuKao-Ming — Mon, 20 Aug 2018 16:19:28 GMT

1.YES.Some time return not correct address,return Commercial store name

So how can I do?

2.For your reference↓

Developer Guide | Time Zone API | Google Developers

I focus this↓

the offset for daylight-savings time in seconds. This will be zero if the time zone is not in Daylight Savings Time during the specified timestamp.

Re: find sample Reverse geocode | ArcGIS API for JavaScriptfor 4.8

RobertScheitlin__GISP — Mon, 20 Aug 2018 16:22:51 GMT

Hsu,

Again. You have looked through all the attributes in the returned event and are sure the information you need is not returned right?

2. Sorry I don't use the Google maps API so I can't help there.

Re: find sample Reverse geocode | ArcGIS API for JavaScriptfor 4.8

HsuKao-Ming — Mon, 20 Aug 2018 17:24:39 GMT

Robert,

1.Again anwser YES,Not the same value returned by google.

You can compare the latitude and longitude of a commercial vending shop.

2.Then, if you get the information obtained abroad, how to solve the time zone offset?

Re: find sample Reverse geocode | ArcGIS API for JavaScriptfor 4.8

RobertScheitlin__GISP — Mon, 20 Aug 2018 18:16:24 GMT

Can you provide an example of when a lat long returns a store name instead of an address? Example lat lon.

Re: find sample Reverse geocode | ArcGIS API for JavaScriptfor 4.8

HsuKao-Ming — Sat, 11 Dec 2021 19:38:48 GMT

HI,Robert.

Try this example:

x:24.979867
y:121.549301

and then I got the new question.

 circle = new Circle({
 center: [lng,lat],
 geodesic: false,
 radius: 300, // 300 feet
 radiusUnit: "meters" 
 });
 
 view.graphics.add({
 symbol: {
 type: "simple-marker",
 color: [255,0,0,0.25],
 size:1000
 },
 geometry:circle
 });
‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

symbol 's size and circle's radius,Which is the main influence on drawing information?

because I not set symbol 's size ,not draw circle

So how can I do?

Re: find sample Reverse geocode | ArcGIS API for JavaScriptfor 4.8

RobertScheitlin__GISP — Tue, 21 Aug 2018 14:34:34 GMT

Hsu,

I don't read Taiwanese but I believe you need to use the LongLabel attribute to get the address.

新北市新店區寶興里寶中路119號安泰商業銀行, 231, TWN = Antai Commercial Bank, No. 119, Baozhong Road, Baoxing, Xindian District, New Taipei City, 231, TWN

var address = {Address: evt.attributes.LongLabel};‍

For new unrelated questions you need to start a new Question.

Re: find sample Reverse geocode | ArcGIS API for JavaScriptfor 4.8

HsuKao-Ming — Wed, 22 Aug 2018 02:06:46 GMT

Robert,

Sorry,you try it again.

Test this

x:24.979990000000043

y:121.54915000000005

link :

https://geocode.arcgis.com/arcgis/rest/services/World/GeocodeServer/reverseGeocode?location=%7B%22spatialReference%22%3A…

The LongLabel is Not detailed,should be return '231新北市新店區寶中路94-112'

Re: find sample Reverse geocode | ArcGIS API for JavaScriptfor 4.8

RobertScheitlin__GISP — Wed, 22 Aug 2018 12:35:34 GMT

Hsu,

I am not sure what to tell you. You say it should be:

231 94-112, Baozhong Road, Xindian District, New Taipei City

but the Geocode service returns
No. 1-3, Lane 113, Baozhong Road, Baoxing, Xindian District, New Taipei City, 231

There is no fixing this.