topic Re: Locate Button Will Not Find Location in ArcGIS JavaScript Maps SDK Questions

Locate Button Will Not Find Location

NathanSommers — Wed, 30 Oct 2013 17:14:29 GMT

I'm in the process of creating a web editing application by modifying some of the javascript examples. I have added LocateButton into the app however when I click on the button it just spins. It's not my browser because the examples work just fine. Here is my code:

    <script>

      require([
        "dojo/ready", 
        "dojo/parser",
        "dijit/layout/BorderContainer",
        "dijit/layout/ContentPane", 
        "esri/map",
        "esri/dijit/LocateButton",
        "esri/config",
        "esri/tasks/GeometryService",
        "esri/urlUtils",
        "esri/arcgis/utils",
        "dojo/dom",
        "dojo/_base/array",
        "esri/dijit/editing/Editor",
        "dojo/domReady!"
        ], function(
          ready, 
          parser, 
          BorderContainer,
          ContentPane,
          Map,
          LocateButton,
          config,
          GeometryService,
          urlUtils,
          arcgisUtils,
          dom,
          array,
          Editor
        ) {

          ready(function(){
            parser.parse();
            config.defaults.io.proxyUrl = "/proxy";
            config.defaults.geometryService = new GeometryService("http://maps.ci.perrysburg.oh.us/arcgis/rest/services/Utilities/Geometry/GeometryServer");

            //check to see if a webmap was specified using URL params. If not use the 
            //hardcoded webmap id 
            var urlObject = urlUtils.urlToObject(document.location.href);
            var webmap = "90d7e213fb014d31ac623d233511fcf9";
            if(urlObject.query && urlObject.query.webmap){
              webmap = urlObject.query.webmap;
            }


            //create the map 
            arcgisUtils.createMap(webmap, "map", {
              mapOptions: {
                sliderStyle: "large"
              },
              ignorePopups: true
                             

            }).then(function(response){

              var map = response.map;
                dom.byId("title").innerHTML = response.itemInfo.item.title;
                dom.byId("snippet").innerHTML = response.itemInfo.item.snippet;
                
              geoLocate = new LocateButton({
               map: map,
               geolocationOptions: {
                      maximumAge: 0,
                      timeout: 15000,
                      enableHighAccuracy: true
                  }
              }, "LocateButton");               

                //create the editor widget 
                var layerInfo = [];

                var layers = response.itemInfo.itemData.operationalLayers;
                array.forEach(layers, function (layer){
                  layerInfo.push({
                    "featureLayer": layer.layerObject
                  });
                });

                var settings = {
                  map: map,
                  layerInfos: layerInfo
                };


                var editorWidget = new Editor({
                  settings: settings
                },"editorDiv");
                editorWidget.startup();



            });


        });
 
      });
    </script>

Any help would be much appreciated!

Thank you,
Ian

Re: Locate Button Will Not Find Location

NumaGremling — Sun, 12 Dec 2021 04:17:03 GMT

Are you running it from your server or straight from disk? Always make sure you run it from a server, since some of the functionality will only work otherwise. I've had issues with certain widgets before until I put them into my root directory.

Also, I just looked at mine, and I have an additional line. In your code it would look like this:

              geoLocate = new LocateButton({
               map: map,
               geolocationOptions: {
                      maximumAge: 0,
                      timeout: 15000,
                      enableHighAccuracy: true
                  }
              }, "LocateButton"); 
             geoLocate.startup();

EDIT:
Nevermind! You forgot to declare a variable. This should fix it:

var geoLocate = new LocateButton({

Re: Locate Button Will Not Find Location

NathanSommers — Wed, 30 Oct 2013 18:10:17 GMT

Thanks for the quick reply.

I tried making both changes you suggested however neither worked. I am also running it from my root directory. When I download the sample from https://developers.arcgis.com/en/javascript/jssamples/widget_locate.html and run it from my root directory everything works fine. I just run into problems when I'm trying to implement the locateButton in another site.

Thanks for your help,
Ian

Re: Locate Button Will Not Find Location

NumaGremling — Sun, 12 Dec 2021 04:17:06 GMT

I was using the same sample, and I ended up with this, which works:

  var userLocation = new LocateButton({
  map: mainMap
  }, "userLocDIV");
  userLocation.startup();

The only difference I see is that you included geolocationOptions. I've tried adding yours to mine and it still worked, but maybe you still want to take them out and see what happens.

Re: Locate Button Will Not Find Location

JanelYang — Wed, 30 Oct 2013 20:55:46 GMT

Ian,

Which browser are you using? There is a known issue with LocateButton on Firefox. Here is an earlier discussion about it: http://forums.arcgis.com/threads/95213-quot-Find-my-location-quot-is-not-working-in-firefox. Let us know if it helps!

Re: Locate Button Will Not Find Location

NathanSommers — Thu, 31 Oct 2013 14:04:37 GMT

Hi Jerome,

I've tried it in Chrome, IE 9, Safari, and Firefox both with and without the fix outlined in the thread and still nothing.

Re: Locate Button Will Not Find Location

GISDev1 — Thu, 31 Oct 2013 14:24:55 GMT

What is the http traffic telling you about the request and response for the geolocation?

Re: Locate Button Will Not Find Location

NathanSommers — Thu, 31 Oct 2013 14:50:53 GMT

Thanks I just figured it out. It was a projection issue.

Watching the traffic I saw this:

Map: Geometry (wkid: 102100) cannot be converted to spatial reference of the map (wkid: 102722)

I'm using a basemap that I published on ArcGIS Online which has a State Plane Ohio North projection. I changed it to an ArcGIS Onilne basemap with a Web Mercator projection and everything worked fine.

Does anybody know how I would be able to use a non Web Mercator projection with the Locate Widget?

Thanks

Re: Locate Button Will Not Find Location

GISDev1 — Thu, 31 Oct 2013 18:51:53 GMT

Thanks I just figured it out. It was a projection issue.

Watching the traffic I saw this:

Map: Geometry (wkid: 102100) cannot be converted to spatial reference of the map (wkid: 102722)

I'm using a basemap that I published on ArcGIS Online which has a State Plane Ohio North projection. I changed it to an ArcGIS Onilne basemap with a Web Mercator projection and everything worked fine.

Does anybody know how I would be able to use a non Web Mercator projection with the Locate Widget?

Thanks

Ok, that's a good start.
What geometry service are you pointing to? Yours or esri's or a custom one?
And what geocoder are you pointing to in order to geolocate the addresses?

Re: Locate Button Will Not Find Location

FrancoisPelletier1 — Wed, 06 Nov 2013 14:40:02 GMT

Thanks I just figured it out. It was a projection issue.

Watching the traffic I saw this:

Map: Geometry (wkid: 102100) cannot be converted to spatial reference of the map (wkid: 102722)

I'm using a basemap that I published on ArcGIS Online which has a State Plane Ohio North projection. I changed it to an ArcGIS Onilne basemap with a Web Mercator projection and everything worked fine.

Does anybody know how I would be able to use a non Web Mercator projection with the Locate Widget?

Thanks

Did you manage to find a solution or workaround ?

I came across the exact same issue. I'm also using my own basemap wich is a non Web Mercator projection. I feel like the LocateButton widget just does'nt support using another projection... The console message comes from the api's init.js file.

d._canProject(c)?d.isWebMercator()?b=O.geographicToWebMercator(b):4326===d.wkid&&(b=O.webMercatorToGeographic(b,!0)):(console.log("Map: "+v.substitute({geometry:c.wkid||c.wkt,map:d.wkid||d.wkt},this.invalidGeometry)),b=null))

I would very much like to avoid the pain of building my own Locate widget.

Please help !
Thanks

Re: Locate Button Will Not Find Location

NathanSommers — Thu, 07 Nov 2013 11:18:24 GMT

Unfortunately I was not able to find a work around so I went ahead used the ArcGIS for iOS app. We were in a time crunch to get a product deployed so I decided that it was better just to use the app then try and reinvent the wheel. So far it has served our needs perfectly.

Re: Locate Button Will Not Find Location

AndyBurns — Sun, 12 Dec 2021 04:17:08 GMT

Hi

Just thought i would add in here. I have not worked with the geolocation service since the old syntax so only have some examples of how i got it to work on a BNG projection (27700)

Once i got the lat lon i then pushed it through our geometry service

// use this if basemap is WGS84 --- var pt = esri.geometry.geographicToWebMercator(new esri.geometry.Point(location.coords.longitude, location.coords.latitude));
            //otherwise, use this stuff below - basically we make a new point with the geolocated coordinates and reproject it, but to do so, you make the point
            //first and specify it's originating spatial reference so then you can reproject it to your own wkid
            function zoomToLocation(location) {
                var pt = new esri.geometry.Point(location.coords.longitude, location.coords.latitude, new esri.SpatialReference({
                  wkid: 4236
                    }
                )); //don't forget to specify the originating wkid (in this case from the GPS/Geolocation)

                var outSR = new esri.SpatialReference({
                   wkid: 27700
                });

                gsvc.project([pt], outSR, function (projectedPoints) {
                    pt = projectedPoints[0];
                    map.centerAndZoom(pt, 2);
                    //add graphic at current location - if graphic exists just move it
                    if (!graphic) {
                        addGraphic(pt);
                    } else { //move the graphic if it already exists
                        graphic.setGeometry(pt);
                    }
                    map.centerAt(pt);
                    //console.log(pt);
                })
              }
            };

Hope this helps put you in the right direction.

Re: Locate Button Will Not Find Location

OttarViken_Valvåg — Sun, 12 Dec 2021 04:17:11 GMT

I've also found that the Locate Button does not work with non-mercator projections.
The fairly obvious requirement of projecting the lat/long coordinate to the map's spatial reference doesn't seem to be implemented.

I added the functionality to the LocateButton by overriding the private _setPosition method using version 3.8 of the API. Since it's a private method the fix could break with updates of the API though. Hopefully ESRI can incorporate this functionality in future versions of the API, it's literally 3 extra lines of code.

require([
    "dojo/_base/lang",
    "esri/dijit/LocateButton",
    "dojo/Deferred",
    "esri/config",
    "esri/geometry/Point",
    "esri/SpatialReference"
], function (
    lang,
    LocateButton,
    Deferred,
    esriConfig,
    Point,
    SpatialReference
) {
    lang.extend(LocateButton, {
        _setPosition: function (location) {
            var deferred = new Deferred;
            if (location && location.coords) {
                var point = null;
                var scale = this.get("scale") || location.coords.accuracy || 5E4;
                if (point = new Point([location.coords.longitude, location.coords.latitude], new SpatialReference({ wkid: 4326 }))) {
                    esriConfig.defaults.geometryService.project([point], this.map.spatialReference).then(lang.hitch(this, function (projectedPoints) {
                        point = projectedPoints[0];
                        var event = this._createEvent(point, scale, location);
                        if (this.get("setScale")) this.get("map").setScale(scale);
                        if (this.get("centerAt")) {
                            this.get("map").centerAt(point).then(lang.hitch(this, function () {
                                deferred.resolve(event);
                            }), lang.hitch(this, function (err) {
                                if (!err) err = Error("LocateButton::Could not center map.");
                                deferred.reject(err);
                            }));
                        }
                        else {
                            deferred.resolve(event);
                        }
                    }), lang.hitch(this, function (err) {
                        if (!err) err = Error("LocateButton::Could not project point to map's spatial reference.");
                        deferred.reject(err);
                    }));
                }
                else {
                    var err = Error("LocateButton::Invalid point");
                    deferred.reject(err)
                }
            }
            else {
                var err = Error("LocateButton::Invalid position");
                deferred.reject(err);
            }
            return deferred.promise;
        } 
    });
});

Re: Locate Button Will Not Find Location

MattDriscoll — Sun, 12 Dec 2021 04:17:14 GMT

require([
    "dojo/_base/lang",
    "esri/dijit/LocateButton",
    "dojo/Deferred",
    "esri/config",
    "esri/geometry/Point",
    "esri/SpatialReference"
], function (
    lang,
    LocateButton,
    Deferred,
    esriConfig,
    Point,
    SpatialReference
) {
    lang.extend(LocateButton, {
        _setPosition: function (location) {
            var deferred = new Deferred;
            if (location && location.coords) {
                var point = null;
                var scale = this.get("scale") || location.coords.accuracy || 5E4;
                if (point = new Point([location.coords.longitude, location.coords.latitude], new SpatialReference({ wkid: 4326 }))) {
                    esriConfig.defaults.geometryService.project([point], this.map.spatialReference).then(lang.hitch(this, function (projectedPoints) {
                        point = projectedPoints[0];
                        var event = this._createEvent(point, scale, location);
                        if (this.get("setScale")) this.get("map").setScale(scale);
                        if (this.get("centerAt")) {
                            this.get("map").centerAt(point).then(lang.hitch(this, function () {
                                deferred.resolve(event);
                            }), lang.hitch(this, function (err) {
                                if (!err) err = Error("LocateButton::Could not center map.");
                                deferred.reject(err);
                            }));
                        }
                        else {
                            deferred.resolve(event);
                        }
                    }), lang.hitch(this, function (err) {
                        if (!err) err = Error("LocateButton::Could not project point to map's spatial reference.");
                        deferred.reject(err);
                    }));
                }
                else {
                    var err = Error("LocateButton::Invalid point");
                    deferred.reject(err)
                }
            }
            else {
                var err = Error("LocateButton::Invalid position");
                deferred.reject(err);
            }
            return deferred.promise;
        } 
    });
});

I will add this to the widget for the next update!

Thanks for bringing it to our attention.

Re: Locate Button Will Not Find Location

OttarViken_Valvåg — Fri, 10 Jan 2014 06:54:59 GMT

That's great, thank you.

Re: Locate Button Will Not Find Location

LorinGaertner — Mon, 28 Jul 2014 19:58:24 GMT

I'm using API 3.10 and as far as I can tell this still hasn't been fixed. Or has it and I'm missing something?

Re: Locate Button Will Not Find Location

MattDriscoll — Mon, 28 Jul 2014 21:11:01 GMT

It will project the geometry if you've set a geometry service for your app.

Default API Configurations | Guide | ArcGIS API for JavaScript‌

esriConfig.defaults.geometryService = new GeometryService("http://yourdomain.com/geometryService");