<!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"/> <meta name="apple-mobile-web-app-capable" content="yes" /> <title>Map</title> <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/2.8/js/dojo/dijit/themes/claro/claro.css"> <style type='text/css'> body{ padding:0; margin:0; } html,body,#map,#mainView{ height:100%; } #navPane{ display:none; } </style> <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=3.0"></script> <script type='text/javascript'> dojo.require("esri.map"); dojo.require("esri.tasks.geometry"); dojo.addOnLoad(init); var map,geometryService; var placesKey='Google Key'; function init(){ esri.config.defaults.io.proxyUrl = 'http://localhost/~kell3008/proxy/proxy.php'; geometryService = new esri.tasks.GeometryService("http://tasks.arcgisonline.com/ArcGIS/rest/services/Geometry/GeometryServer"); var supportsOrientationChange = "onorientationchange" in window, orientationEvent = supportsOrientationChange ? "orientationchange" : "resize"; window.addEventListener(orientationEvent, function() { orientationChanged(); }, false); map = new esri.Map('map'); //find location if(navigator.geolocation){ navigator.geolocation.getCurrentPosition(function(location){ var pt = esri.geometry.geographicToWebMercator(new esri.geometry.Point(location.coords.longitude, location.coords.latitude)); var symbol = new esri.symbol.PictureMarkerSymbol({"angle":0,"xoffset":0,"yoffset":0,"type":"esriPMS","url":"http://static.arcgis.com/images/Symbols/Shapes/BlueStarLargeB.png","contentType":"image/png","width":18,"height":18}); graphic = new esri.Graphic(pt, symbol); map.graphics.add(graphic); map.centerAndZoom(pt,14); var loc = location.coords.latitude + ',' + location.coords.longitude; findPlaces(loc); //display accuracy var params = new esri.tasks.BufferParameters(); params.geometries = [pt]; params.distances = [location.coords.accuracy]; //accuracy in meters params.unit = esri.tasks.GeometryService.UNIT_METER; params.outSpatialReference = map.spatialReference; geometryService.buffer(params,function(results){ if(results.length > 0){ var symbol = new esri.symbol.SimpleFillSymbol(); symbol.setColor(new dojo.Color([100,100,100,0.25])); symbol.setOutline(null); var graphic = new esri.Graphic(results[0],symbol); map.graphics.add(graphic); } }); },function(positionerror){ switch(positionerror.code){ case 0: console.log("Unknown error occurred"); break; case 1: console.log("Permission denied"); break; case 2: console.log("Unable to find current location"); break; case 3: console.log("Location request timed out"); break; } }); } var basemap = new esri.layers.ArcGISTiledMapServiceLayer('http://server.arcgisonline.com/ArcGIS/rest/services/Canvas/World_Light_Gray_Base/MapServer'); map.addLayer(basemap); } function orientationChanged(){ if(map){ map.reposition(); map.resize(); } } function findPlaces(location){ var placesUrl = 'https://maps.googleapis.com/maps/api/place/search/json'; var params ={ location:location, sensor:false, radius:5000, types:'book_store', key:placesKey, } var places = esri.request({ url:placesUrl, content:params, handleAs:'json' }); places.then(requestSucceeded,requestFailed); } function requestSucceeded(response){ dojo.forEach(response.results,function(result){ var pt = esri.geometry.geographicToWebMercator(new esri.geometry.Point(result.geometry.location.lng, result.geometry.location.lat,new esri.SpatialReference(4326))); console.log(result); var attr = {'name':result.name,'address':result.vicinity}; var symbol = new esri.symbol.PictureMarkerSymbol({"angle":0,"xoffset":0,"yoffset":0,"type":"esriPMS","url":result.icon,"contentType":"image/png","width":16,"height":16}); var infoTemplate = new esri.InfoTemplate('Books',"${*}"); graphic = new esri.Graphic(pt, symbol,attr,infoTemplate); map.graphics.add(graphic); }) } function requestFailed(response){ console.log(response); } </script> </head> <body class='claro'> <div id='mainView' dojoType='dojox.mobile.View' selected='true'> <div id='map'></div> </div> </body> </html>
Angemeldete Mitglieder können Beiträge verfassen, Updates folgen und mehr. Neu hier? Registriere ein kostenloses Konto.
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.
