AnsweredAssumed Answered

How do I get my LocateButton widget to work with our TiledMapService?

Question asked by csergent08 Champion on Nov 12, 2014
Latest reply on Nov 12, 2014 by csergent08

I am receiving the following error when I click on the LocateButton widget: Map: Geometry (wkid: 4326) cannot be converted to spatial reference of the map (wkid: 3435)

 

The url for my application is at: Decatur GIS Template

What do I need to change for the locate button to work?

 

Here is my code:

<!DOCTYPE html>

<html>

    <head>

        <title>Decatur GIS Template</title>

        <meta http-equiv="content-type" content="text/html; charset=utf-8">

        <meta name="viewport" content="initial-scale=1,maximum-scale=1, user-scalable=no">

        <link rel="stylesheet" href="http://js.arcgis.com/3.11/dijit/themes/claro/claro.css">

        <link rel="stylesheet" href="http://js.arcgis.com/3.11/esri/css/esri.css">

        <style>

            html, body, #mapDiv

            {

                padding:0;

                margin:0;

                height:100%;

            }

           

            #HomeButton

            {

                position: absolute;

                top: 250px;

                left: 20px;

                z-index: 50;

            }

           

           

            #LocateButton

            {

              position: absolute;

              top: 300px;

              left: 20px;

              z-index: 50;

            }

                           

        </style>

        <script src="http://js.arcgis.com/3.11/"></script>

        <script>

            var map;

 

 

            require(["esri/map",

                    "esri/dijit/HomeButton", "esri/dijit/LocateButton",

                    "esri/layers/ArcGISTiledMapServiceLayer",

                    "esri/layers/ArcGISDynamicMapServiceLayer",

                    "dojo/dom", "dojo/on", "dojo/parser",

                    "esri/geometry/Extent", "dojo/domReady!"], function (Map, HomeButton, LocateButton, Tiled, ArcGISDynamicMapServiceLayer, dom, on, parser, Extent

            ) {

                // set custom extent

                var initialExtent = new Extent({ "xmin": 777229.03, "ymin": 1133467.92, "xmax": 848340.14, "ymax": 1185634.58, "spatialReference": { "wkid": 3435}});

                map = new Map("mapDiv", {

                    showAttribution: false,

                    sliderStyle: "large",

                    extent:initialExtent

 

 

                });

                    // add imagery

                    var tiled = new Tiled("http://maps.decaturil.gov/arcgis/rest/services/Aerial_2014_Tiled/MapServer");

                    map.addLayer(tiled);

                    // add operational layer

                    var operationalLayer = new ArcGISDynamicMapServiceLayer("http://maps.decaturil.gov/arcgis/rest/services/Public/InternetVector/MapServer", { "opacity": 0.5 });

                    map.addLayer(operationalLayer);

 

 

                    // add home button to get full extent

                    var home = new HomeButton({

                        map: map

                    }, "HomeButton");

                    home.startup();

 

 

                    // add geolocate button to find the location of the current user

                    geoLocate = new LocateButton({

                        map: map,

                        highlightLocation:true

                    }, "LocateButton");

                    geoLocate.startup();

 

 

                    }

                   

                );

 

 

                   

              

           

        </script>

    </head>

    <body class="soria">

        <div id="mapDiv">

            <div id="HomeButton"></div>

            <div id="LocateButton"></div>

        </div>

    </body>

</html>

Outcomes