TA,
Here is your code updated for that:
define(['dojo/_base/declare',
'dijit/_WidgetsInTemplateMixin',
'jimu/BaseWidget',
'esri/map',
'esri/tasks/BufferParameters',
'esri/tasks/GeometryService',
'esri/graphic',
'esri/symbols/SimpleFillSymbol',
'esri/symbols/SimpleLineSymbol',
'esri/Color',
'dojo/_base/array',
'dojo/_base/lang',
'jimu/dijit/CheckBox',
'dojo/domReady!'
],
function (declare, _WidgetsInTemplateMixin, BaseWidget, Map, BufferParameters, GeometryService, Graphic, SimpleFillSymbol, SimpleLineSymbol, Color, array, lang) {
//To create a widget, you need to derive from BaseWidget.
return declare([BaseWidget, _WidgetsInTemplateMixin], {
// Custom widget code goes here
name: 'BufferTool',
baseClass: 'jimu-widget-buffertool',
distances: null,
clickEvt: null,
gsvc: null,
postCreate: function () {
this.inherited(arguments);
this.distances = [];
this.gsvc = new GeometryService("http://tasks.arcgisonline.com/ArcGIS/rest/services/Geometry/GeometryServer");
},
_onChkboxesClicked: function() {
this.distances = [];
if(this.cbx05.getValue()){
this.distances.push(0.5);
}
if(this.cbx10.getValue()){
this.distances.push(1);
}
if(this.cbx15.getValue()){
this.distances.push(1.5);
}
if(this.cbx20.getValue()){
this.distances.push(2);
}
},
_clearall: function() {
console.log("button clicked");
this.distances = [];
this.map.graphics.clear();
this.cbx05.setValue(false);
this.cbx10.setValue(false);
this.cbx15.setValue(false);
this.cbx20.setValue(false);
},
//---------------------------------------
startup: function () {
this.inherited(arguments);
console.log('startup');
},
onClose: function(){
console.log('onClose');
this.clickEvt.remove();
},
onOpen: function(){
this.clickEvt = this.map.on('click', lang.hitch(this, function (evt) {
this.map.graphics.clear();
var params = new BufferParameters();
params.geometries = [evt.mapPoint];
//buffer in linear units such as meters, km, miles etc.
params.distances = this.distances;
params.unit = GeometryService.UNIT_STATUTE_MILE;
params.outSpatialReference = this.map.spatialReference;
if(this.distances.length === 0){
return false;
}
this.gsvc.buffer(params, lang.hitch(this, function (geoms) {
geoms.reverse();
var symbol = new SimpleFillSymbol(
SimpleFillSymbol.STYLE_NULL,
new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID,
new Color([0, 0, 255, 0.65]), 2),
new Color([0, 0, 255, 0.35])
);
var symbol2 = new SimpleFillSymbol(
SimpleFillSymbol.STYLE_NULL,
new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID,
new Color([255, 0, 0, 0.65]), 2),
new Color([255, 0, 0, 0.35])
);
var symbol3 = new SimpleFillSymbol(
SimpleFillSymbol.STYLE_NULL,
new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID,
new Color([0, 255, 255, 0.65]), 2),
new Color([0, 0, 255, 0.35])
);
var symbol4 = new SimpleFillSymbol(
SimpleFillSymbol.STYLE_NULL,
new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID,
new Color([255, 255, 0, 0.65]), 2),
new Color([255, 0, 0, 0.35])
);
var syms = [symbol, symbol2, symbol3, symbol4];
var graphic;
array.map(geoms, lang.hitch(this, function(bufferGeom, index){
graphic = new Graphic(bufferGeom, syms[index]);
this.map.graphics.add(graphic);
}));
}));
}));
}
});
});