Show Coordinates

akashmagoon · ‎04-30-2012

Hello,

can someone edit this code so that it shows coordinates for where the cursor is currently at. The coordinates should show in the bottom of the map, sort of like the sample from the api:
http://help.arcgis.com/en/webapi/javascript/arcgis/demos/util/util_project.html

I am new to the arcgis engine, and its a bit different from what i usually do. Anyways thanks for the help, and here is my code that i want to add the coordinates to:

<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=7,IE=9" />
    <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"/>
    <title></title>
    <link rel="stylesheet" href="http://serverapi.arcgisonline.com/jsapi/arcgis/2.5/js/dojo/dijit/themes/tundra/tundra.css">
    <link rel="stylesheet" href="http://serverapi.arcgisonline.com/jsapi/arcgis/2.5/js/esri/dijit/css/Popup.css">
    <style>
      html, body { height: 100%; width: 100%; margin: 0; padding: 0; }
      #map{ margin: 0; padding: 0; }
    </style>
    <script>var dojoConfig = { parseOnLoad: true };</script>
    <script src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=2.5"></script>
    <script>
      dojo.require("dijit.layout.BorderContainer");
      dojo.require("dijit.layout.ContentPane");
      dojo.require("esri.map");

      var map;
      function init() {
var initExtent = new esri.geometry.Extent({"xmin":-13114922,"ymin":-5500000,"xmax":9292585,"ymax":10351408, "spatialReference":{"wkid":102100}});
map = new esri.Map("map",{extent:initExtent});
var basemap = new esri.layers.ArcGISTiledMapServiceLayer("http://server.arcgisonline.com/ArcGIS/rest/services/World_Topo_Map/MapServer");
map.addLayer(basemap);

dojo.connect(map, "onLoad", function() {

var points = {
   "points": [[-122.63,45.51],[-122.56,45.51],[-122.56,45.55],[-122.62,45.00],[77,19]],
   "spatialReference": ({ "wkid": 4326 })
};
var mp = new esri.geometry.Multipoint(points);
var wm_mp = esri.geometry.geographicToWebMercator(mp);

var sms = new esri.symbol.SimpleMarkerSymbol();
var infoTemplate = new esri.InfoTemplate("Bob","Lives in the USA");
var graphic = new esri.Graphic(wm_mp, sms, '', infoTemplate);
map.graphics.add(graphic);

dojo.connect(map.graphics, "onMouseOver", function(evt) {
                  var g = evt.graphic;
                  map.infoWindow.setContent(g.getContent());
                  map.infoWindow.setTitle(g.getTitle());
                  map.infoWindow.show(evt.screenPoint,map.getInfoWindowAnchor(evt.screenPoint));

               });
               dojo.connect(map.graphics, "onMouseOut", function() {map.infoWindow.hide();} );

});
}
      dojo.ready(init);
    </script>
</head>

<body class="tundra">
    <div data-dojo-type="dijit.layout.BorderContainer"
         data-dojo-props="design:'headline',gutters:false"
         style="width: 100%; height: 100%; margin: 0;">
      <div id="map"
           data-dojo-type="dijit.layout.ContentPane"
           data-dojo-props="region:'center'">
      </div>
    </div>
</body>
</html>

TomJacoby · ‎04-30-2012

dojo.connect(map, "onMouseMove", function(evt) { 
      var mp = esri.geometry.webMercatorToGeographic(evt.mapPoint);
      dojo.byId("spanCoords").innerHTML = mp.x + ", " + mp.y; 
});

and html:
[HTML]<div style="position: absolute; bottom: 5px; left: 5px; z-index: 8999; padding: 5px; background-color: #FFF;">
Hover coordinates: <span id="spanCoords"></span>
</div>[/HTML]

TomJacoby · ‎04-30-2012

You may want to round the coordinates as it goes out quite a few decimal places. I use three:

dojo.byId("spanCoords").innerHTML = (Math.round(mp.x * 1000) / 1000) + ", " + (Math.round(mp.y * 1000) / 1000);

akashmagoon · ‎04-30-2012

Thanks alot tom.

akashmagoon · ‎05-01-2012

Also, how can i add the project a point:
http://help.arcgis.com/en/webapi/javascript/arcgis/help/jssamples_start.htm#jssamples/util_project.h...

to my original code.

I need it so that if there is no pinpoint registered at a certain point, then it project its coordinates in a infowindow...

Thanks for any help