<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <!--The viewport meta tag is used to improve the presentation and behavior of the samples on iOS devices--> <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"> <title>Foggy Buffer Zone</title> <link rel="stylesheet" href="http://js.arcgis.com/3.7/js/dojo/dijit/themes/claro/claro.css"> <link rel="stylesheet" href="http://js.arcgis.com/3.7/js/esri/css/esri.css"> <style> html, body { height: 100%; width: 100%; margin: 0; padding: 0; overflow:hidden; } #leftPane{ color:#000; width:250px; padding-bottom:15px; } #map{ padding:0; } .details{ font-size:14px; font-weight:600; padding-bottom:20px; } </style> <script src="http://js.arcgis.com/3.7/"></script> <script> require(["dojo/dom", "dojo/dom-attr", "dojo/_base/array", "dojo/_base/Color", "dojo/parser", "esri/config", "esri/map", "esri/graphic", "esri/tasks/Geoprocessor", "esri/tasks/FeatureSet", "esri/tasks/LinearUnit", "esri/toolbars/draw", "esri/symbols/SimpleMarkerSymbol", "esri/symbols/SimpleLineSymbol", "esri/symbols/SimpleFillSymbol", "dijit/layout/BorderContainer", "dijit/layout/ContentPane"], function(dom, domAttr, array, Color, parser, esriConfig, Map, Graphic, Geoprocessor, FeatureSet, LinearUnit, Draw, SimpleMarkerSymbol, SimpleLineSymbol, SimpleFillSymbol) { var map, gp, tb; parser.parse(); map = new Map("map", { basemap: "streets", center: [-122.4, 37.785], zoom: 13, }); esriConfig.defaults.io.proxyUrl = "/proxy"; esriConfig.defaults.io.alwaysUseProxy = false; gp = new Geoprocessor("http://localhost:6080/arcgis/rest/services/SFFoggyZone/GPServer/Model"); //gp.setOutputSpatialReference({ //wkid: 32612 //}); map.on("load", initToolbar); /* ** Initialize the drawing toolbar */ function initToolbar(evtObj) { app.tb = new Draw(evtObj.map); app.tb.on("draw-end", drawPoint); } // Array where points are saved var list = new Array(); /* ** Draw point */ function drawPoint(evtObj) { // Get the click geometry var geometry = evtObj.geometry; // Point symbol var symbol = new SimpleMarkerSymbol( SimpleMarkerSymbol.STYLE_SQUARE, 10, new SimpleLineSymbol( SimpleLineSymbol.STYLE_SOLID, new Color([255,0,0]), 1), new Color([0,255,0,0.25]) ); // Add point to the map var graphic = new Graphic(geometry, symbol); app.map.graphics.add(graphic); // Store the point geometry list.push(geometry) } /* ** Create buffer around points */ function doBuffer() { // Stop drawing points app.tb.deactivate(); // Show the zoom slider app.map.showZoomSlider(); // Setup the buffer parameters // var params = new BufferParameters(); // params.distances = [ dom.byId("distance").value ]; // params.bufferSpatialReference = new esri.SpatialReference({wkid: dom.byId("bufferSpatialReference").value}); // params.outSpatialReference = map.spatialReference; // params.unit = GeometryService[dom.byId("unit").value]; // params.geometries = list; var features = []; // features.push(graphic); var featureSet = new FeatureSet(); featureSet.features = features; var distances = new LinearUnit(); distances.distance = [ dom.byId("Dis").value ]; distances.units = [dom.byId("unit").value]; // var bufferSpatialReference = new gp.setOutputSpatialReference({wkid: dom.byId("bufferSpatialReference").value}); var params = { "Foggy_Points":FeatureSet, "Boundary_Polygons":FeatureSet, "Buffer_Distance": distances, "bufferSpatialReference": dom.byId("bufferSpatialReference").value }; // Launch buffer calculation // app.geo.buffer(params, showBuffer); gp.execute(params, showBuffer); }; /* ** Draw buffer on the map */ function showBuffer(geoms) { // Symbol of the buffer var symbol = new SimpleFillSymbol( SimpleFillSymbol.STYLE_SOLID, new SimpleLineSymbol( SimpleLineSymbol.STYLE_SOLID, new Color([255,0,0,0.65]), 2 ), new Color([255,0,0,0.35]) ); // Add the buffer graphics to the map array.forEach(geoms, function(geometry) { var graphic = new Graphic(geometry, symbol); app.map.graphics.add(graphic); }); } app = { map: map, tb: tb, geo: geo, buffer: doBuffer }; }); /* ** Click on Foggy Zone button */ function foggyZoneClick(){ app.buffer(); } /* ** Click on Point button */ function pointClick(){ app.tb.activate(esri.toolbars.Draw.POINT); app.map.hideZoomSlider(); } /* ** Click on Clear Graphics button */ function clearGraphicsClick(){ app.map.graphics.clear(); } </script> </head> <body class="claro"> <div data-dojo-type="dijit.layout.BorderContainer" data-dojo-props="gutters:'true', design:'sidebar'" style="width:100%;height:100%;"> <div id="map" data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'center'"> </div> <div id="leftPane" data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'left'"> <div><b>Foggy Zone Parameters</b></div> Spatial Reference WKID: <input type="text" id="bufferSpatialReference" size="5" value="32612" /><br /> Distance: <input type="text" id="Dis" size="5" value="1" /> <select id="unit" style="width:100px;"> <option value="UNIT_KILOMETER">Kilometers</option> <option value="UNIT_METER">Meters</option> <option value="UNIT_STATUTE_MILE">Miles</option> </select><br /> <hr /> <div class="details">Please enter points of the Foggy Zone</div> <button data-dojo-type="dijit.form.Button" onclick="pointClick();">Report Fog</button> <button id="point" data-dojo-type="dijit.form.Button" onclick="foggyZoneClick();">Foggy Zone</button> <button data-dojo-type="dijit.form.Button" type="button" onclick="clearGraphicsClick();">Clear Graphics</button> <br /> </div> </div> </body> </html>
Hi pepatosp,Thanks for your feedback, it's exactly the problem i'am facing, even if i'am changing the geometry service and using geoprocessing service i'am still using an instance of the GeometryService.I check the URL that you send me i found some classes that i change but still not working if you can provide me with more help i will be grateful.Thanks a lot for your support
tags to preserve your indentation, making the code easier for others to read. require(["dojo/dom", "dojo/dom-attr", "dojo/_base/array", "dojo/_base/Color", "dojo/parser", "esri/config", "esri/map", "esri/graphic", "esri/tasks/GeometryService", "esri/tasks/BufferParameters", "esri/toolbars/draw", "esri/symbols/SimpleMarkerSymbol", "esri/symbols/SimpleLineSymbol", "esri/symbols/SimpleFillSymbol", "dijit/layout/BorderContainer", "dijit/layout/ContentPane"], function (dom, domAttr, array, Color, parser, esriConfig, Map, Graphic, GeometryService, BufferParameters, Draw, SimpleMarkerSymbol, SimpleLineSymbol, SimpleFillSymbol) { var map, geo, tb; parser.parse(); map = new Map("map", { basemap: "streets", center: [-122.4, 37.785], zoom: 13 }); esriConfig.defaults.io.proxyUrl = "/proxy"; esriConfig.defaults.io.alwaysUseProxy = false; geo = new GeometryService("http://tasks.arcgisonline.com/ArcGIS/rest/services/Geometry/GeometryServer"); map.on("load", initToolbar); /* ** Initialize the drawing toolbar */ function initToolbar(evtObj) { app.tb = new Draw(evtObj.map); app.tb.on("draw-end", drawPoint); } // Array where points are saved var list = []; /* ** Draw point */ function drawPoint(evtObj) { // Get the click geometry var geometry = evtObj.geometry; // Point symbol var symbol = new SimpleMarkerSymbol( SimpleMarkerSymbol.STYLE_SQUARE, 10, new SimpleLineSymbol( SimpleLineSymbol.STYLE_SOLID, new Color([255, 0, 0]), 1), new Color([0, 255, 0, 0.25])); // Add point to the map var graphic = new Graphic(geometry, symbol); app.map.graphics.add(graphic); // Store the point geometry list.push(geometry); } /* ** Create buffer around points */ function doBuffer() { // Stop drawing points app.tb.deactivate(); // Show the zoom slider app.map.showZoomSlider(); // Setup the buffer parameters var params = new BufferParameters(); params.distances = [dom.byId("distance").value]; params.bufferSpatialReference = new esri.SpatialReference({ wkid: dom.byId("bufferSpatialReference").value }); params.outSpatialReference = map.spatialReference; params.unit = GeometryService[dom.byId("unit").value]; params.geometries = list; // Launch buffer calculation app.geo.buffer(params, showBuffer); } /* ** Draw buffer on the map */ function showBuffer(geoms) { // Symbol of the buffer var symbol = new SimpleFillSymbol( SimpleFillSymbol.STYLE_SOLID, new SimpleLineSymbol( SimpleLineSymbol.STYLE_SOLID, new Color([255, 0, 0, 0.65]), 2), new Color([255, 0, 0, 0.35])); // Add the buffer graphics to the map array.forEach(geoms, function (geometry) { var graphic = new Graphic(geometry, symbol); app.map.graphics.add(graphic); }); } app = { map: map, tb: tb, geo: geo, buffer: doBuffer }; }); /* ** Click on Foggy Zone button */ function foggyZoneClick() { app.buffer(); } /* ** Click on Point button */ function pointClick() { app.tb.activate(esri.toolbars.Draw.POINT); app.map.hideZoomSlider(); }
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.