Dear all,
I am working on the sample existing in ArcGIS API for JavaScript "Basic Service Area"
The drive time polygon is given by a map click and i would like to have the polygon after a button click.
Below the code if someone could give me any support:
var map, serviceAreaTask, params, clickpoint;
require([
"esri/map", "esri/config",
"esri/tasks/ServiceAreaTask", "esri/tasks/ServiceAreaParameters", "esri/tasks/FeatureSet",
"esri/symbols/SimpleMarkerSymbol", "esri/symbols/SimpleLineSymbol", "esri/symbols/SimpleFillSymbol",
"esri/geometry/Point", "esri/graphic",
"dojo/parser", "dojo/dom", "dijit/registry",
"esri/Color", "dojo/_base/array",
"dijit/layout/BorderContainer", "dijit/layout/ContentPane",
"dijit/form/HorizontalRule", "dijit/form/HorizontalRuleLabels", "dijit/form/HorizontalSlider",
"dojo/domReady!",
"esri/geometry/Extent",
"esri/layers/GraphicsLayer",
"esri/SpatialReference",
"esri/InfoTemplate",
"dojo/on"
], function(
Map, esriConfig,
ServiceAreaTask, ServiceAreaParameters, FeatureSet,
SimpleMarkerSymbol, SimpleLineSymbol, SimpleFillSymbol,
Point, Graphic,
parser, dom, registry,
Color, arrayUtils,
Extent, FeatureLayer, GraphicsLayer, SpatialReference,
InfoTemplate, on
) {
parser.parse();
esriConfig.defaults.io.proxyUrl = "/proxy/";
map = new Map("map", {
basemap: "streets",
center: [-122.447, 37.781],
zoom: 15
});
// map.on("click", mapClickHandler);
params = new ServiceAreaParameters();
params.defaultBreaks= [1];
params.outSpatialReference = map.spatialReference;
params.returnFacilities = false;
serviceAreaTask = new ServiceAreaTask("http://sampleserver3.arcgisonline.com/ArcGIS/rest/services/Network/USA/NAServer/Service Area");
registry.byId("hslider").on("change", updateHorizontalLabel);
updateHorizontalLabel();
// Create function that updates label when changed
function updateHorizontalLabel() {
// Get access to nodes/widgets we need to get/set values
var hSlider = registry.byId("hslider");
var label = dom.byId("decValue");
// Update label
label.innerHTML = hSlider.get("value");
params.defaultBreaks = [ hSlider.value / 60 ];
if (clickpoint) {
mapClickHandler(clickpoint);
}
}
on(dojo.byId("AddDTP"), "click", function mapClickHandler(evt) {
clickpoint = evt;
map.graphics.clear(); //clear existing graphics
//define the symbology used to display the results and input point
var pointSymbol = new SimpleMarkerSymbol(
"diamond",
20,
new SimpleLineSymbol(
"solid",
new Color([88,116,152]), 2
),
new Color([88,116,152,0.45])
);
var inPoint = new Point(evt.mapPoint.x, evt.mapPoint.y, map.spatialReference);
var location = new Graphic(inPoint, pointSymbol);
map.graphics.add(location);
var features = [];
features.push(location);
var facilities = new FeatureSet();
facilities.features = features;
params.facilities = facilities;
//solve
serviceAreaTask.solve(params,function(solveResult){
var polygonSymbol = new SimpleFillSymbol(
"solid",
new SimpleLineSymbol("solid", new Color([232,104,80]), 2),
new Color([232,104,80,0.25])
);
arrayUtils.forEach(solveResult.serviceAreaPolygons, function(serviceArea){
serviceArea.setSymbol(polygonSymbol);
map.graphics.add(serviceArea);
});
}, function(err){
console.log(err.message);
});
})
});
Thank you in advance.
Solved! Go to Solution.
It is working correctly...it's just placing the point in Portland, not in San Francisco. Your map's center is -122.447, 37.781 but you're placing the point at -122.65, 45.53.
Also, don't forget to mark the post that answered your initial question.
Dear Ken,
Yaa you are right, kind of things that make you crazy
Thanks a lot to all of you