<!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, gsvc; 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_Imagery/MapServer"); map.addLayer(basemap); gsvc = new esri.tasks.GeometryService("http://tasks.arcgisonline.com/ArcGIS/rest/services/Geometry/GeometryServer"); 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); var points = { "points": [ [85, 45.51], [-5, 45.51], [45, 45.55], [20, 45.00], [20, 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("Jack", "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.connect(map, "onMouseMove", function (evt) { var mp = esri.geometry.webMercatorToGeographic(evt.mapPoint); dojo.byId("spanCoords").innerHTML = mp.x + ", " + mp.y; dojo.byId("spanCoords").innerHTML = (Math.round(mp.x * 10000) / 10000) + ", " + (Math.round(mp.y * 10000) / 10000); }); dojo.connect(map, "onClick", function projectToLatLong(e) { var outSR = new esri.SpatialReference({ wkid: 4326 }); gsvc.project([e.mapPoint], outSR, function(projectedPoints) { console.log("project callback: ", projectedPoints); pt = projectedPoints[0]; // dojo.byId("latlong").innerHTML = " Latitude = " + pt.y + "<br/> Longitude = " + pt.x; console.log("Latitude = " + pt.y + " Longitude = " + pt.x); }); }); }); } dojo.ready(init); </script> </head> <div style="position: absolute; bottom: 5px; left: 5px; z-index: 8999; padding: 5px; background-color: #ADD8E6;">Current Coordinates (Latitude, Longitude): <span id="spanCoords"></span> </div> <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>
Les membres connectés peuvent publier, suivre les mises à jour, et plus encore. Nouveau ici ? Inscrivez-vous gratuitement.
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.
