<!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,IE=9" /> <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"/> <title>Project a point</title> <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/2.4/js/dojo/dijit/themes/claro/claro.css"> <script src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=2.4" type="text/javascript"></script> <script type="text/javascript"> dojo.require("esri.map"); dojo.require("esri.tasks.geometry"); var map = null; var gsvc = null; var pt = null; function initialize() { map = new esri.Map("map"); var layer = new esri.layers.ArcGISTiledMapServiceLayer("http://server.arcgisonline.com/ArcGIS/rest/services/ESRI_StreetMap_World_2D/MapServer"); map.addLayer(layer); map.setExtent(new esri.geometry.Extent(-144.13, 7.98, -52.76, 68.89, new esri.SpatialReference({wkid: 4326}))); map.infoWindow.resize(360, 120); gsvc = new esri.tasks.GeometryService("http://sampleserver3.arcgisonline.com/ArcGIS/rest/services/Geometry/GeometryServer"); dojo.connect(map, "onClick", projectToWebMercator); } function projectToWebMercator(evt) { map.graphics.clear(); var point = evt.mapPoint; var symbol = new esri.symbol.SimpleMarkerSymbol().setStyle(esri.symbol.SimpleMarkerSymbol.STYLE_DIAMOND); var graphic = new esri.Graphic(point, symbol); var outSR = new esri.SpatialReference({ wkid: 102113}); // convert client side var wm = esri.geometry.geographicToWebMercator(point); map.graphics.add(graphic); gsvc.project([ point ], outSR, function(projectedPoints) { pt = projectedPoints[0]; // display both geometry service result and the client side result graphic.setInfoTemplate(new esri.InfoTemplate("Coordinates", "<table><tbody><tr><td>Geometry Service:</td><td>" + pt.x.toFixed(3) + ", " + pt.y.toFixed(3) + "</td></tr><tr><td>Client Side:</td><td>" + wm.x.toFixed(3) + ", " + wm.y.toFixed(3) + "</td></tr></tbody></table>" )); map.infoWindow .setTitle(graphic.getTitle()) .setContent(graphic.getContent()) .show(evt.screenPoint, map.getInfoWindowAnchor(evt.screenPoint)); }); } dojo.addOnLoad(initialize); </script> </head> <body class="claro"> <b>Click a location on the map to Project from LatLng -> Web Mercator:</b> <div id="map" style="width:800px; height:800px; border:1px solid #000;"></div> </body> </html>
Signed in members can post, follow updates, and more. New here? Register a free account.
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.