I have this standard buffer plotting code (there may be some typos as I am copying from another network that I can only view the code on a monitor, and not directly. These are lines of code that I think don't need to be there, to save time in my typing):
define([
"dojo/_base/declare"
...
, "dojo/_base/array"
...
, "dojo/dom"
, "dojo/on"
...
, "esri/SpatialReference"
, "esri/graphic"
, "esri/GraphicsLayer"
, "esri/Color"
, "esri/geometry/Point"
, "esri/geometry/Polyline"
, "esri/geometry/normalizeUtils"
, "esri/symbols/SimpleLineSymbol"
, "esri/symbols/SimpleFillSymbol"
, "esri/tasks/GeometryService"
, "esri/tasks/BufferParameters"
...
], function (
declare
...
, array
, dom
, on
...
, SpatialReference
, Graphic
, GraphicsLayer
, Color
, Point
, Polyline
, normalizeUtils
, SimpleLineSymbol
, SimpleFillSymbol
, GeometryService
, BufferParameters
) {
var plotArray = [
{ latitude:34, longitude: -118 },
{ latitude:32, longitude: -114 },
{ latitude:32, longitude: -109 },
{ latitude:37, longitude: -106 },
{ latitude:41, longitude: -104 },
{ latitude:41, longitude: -96 },
{ latitude:39, longitude: -91 },
{ latitude:38, longitude: -88 },
{ latitude:32, longitude: -96 },
{ latitude:37, longitude: -123 },
return declare([ ... ],
{
...
gsvc: '',
graphicsLayerID: '',
graphicsLyr:'',
...
constructor: function (options, srcRefNode) {
try {
this.gsvc = esriConfig.defaults,geometryService;
this.map = (options.map || null);
...
this.graphicsLayerID = (options.graphicsLayerID || 'Upload_gLyr');
...
this.symbolMarker = {
'circle': SimpleMarkerSymbol.STYLE_CIRCLE,
...
};
this.lineSymbol = {
'dash": SimpleLineSymbol.STYLE_DASH,
...
};
} catch (e) {
console.info("Error in Constructor - " + this.name);
}
},
startup: function () {
if (this.debugMode) {
console.info(this.name + ' - STARTUP called');
}
this.inherited(arguments)
this.graphicsLyr = new GraphicsLayer({id: this.graphicsLayerID});
this.map.add(this.graphicsLyr);
},
postCreate: function() {
if (this.debugMode) {
console.info(this.name + ' - POST CREATE called');
}
this.inherited(arguments);
this.own(
this.gsvc.on("buffer-complete", lang.hitch(this, this._showBuffer) )
)
...
},
...
_buildLineSelection: function () {
if (this.debugMode) {
console.info(this.name + ' - BUILD LINE SELECTION called');
}
lineColorID = dom.byId('lineCOlor');
this.lineColor = this.colorSelection;
dojo.style(lineColorID, 'backgroundcolor', this.colorSelection);
...
on(dojo.byId('btnDrawLines'),'click', lang.hitch(this, this._drawLineData) );
}
_drawLineData: function(evt) {
if (this.debugMode){
console.info( this.name + ' - DRAW LINE DATA called');
}
try {
var paths = [];
for (var j = 1; j < plotArray.length; j++) {
point0 = [];
point0 = [];
point0[0] = plotArray[j - 1].longitude;
point0[1] = plotArray[j - 1].latitude;
point1[0] = plotArray
point1[1] = plotArray
path = [point0, point1];
paths.push(path);
}
polylineDefinition = {"paths":paths,"spatialReference":this.map.spatialReference};
polyline = new Polyline(polylineDefinition);
graphic = new esri.Graphic().setGeometry(polyline);
this.lineColor = this.colorSelection;
lineStyle = dojo.byId('lineStyle').value;
dojoColor = new dojo.Color(this.lineColor);
rgbColor = dojoColor.toRgb();
lineSize = dojo.byId('lineSize').value;
alpha = dojo.byId('lineOpacity').value;
rgbColor[rgcColor.length] = alpha;
graphic.symbol = new SimpleLineSymbol()
.setColor(rgbColor)
.setWidth(lineSize)
.setStyle(this.lineSymbol[lineStyle]);
this.graphicsLyr.add(graphic);
//fill in points on line intersections
for (var i = 0; i < plotArray.length; i++) {
data = "";
pt = new Point([plotAray.longitude,plotArray.latitude],this.map.spatialReference);
symbol = "circle";
dojoColor = new dojo.Color(this.lineColor);
rgbColor = dojoColor.toRgb();
size = dojo.byId('lineSize').value;
alpha = dojo.byId('lineOpacity').value;
rgbColor[rgcColor.length] = alpha;
point = {
pt: pt,
symbol: this.SymbolMarker[symbol],
outlineSize: 0,
size: size,
color: rgbColor,
data:data
};
this._plotPoint(this.map,point);
}
this._doBuffer( polyline );
} catch (Error) {
if (this.debugMode){
console.info('Error in DRAW LINE DATA: ' + evt.target);
console.info(Error);
}
}
},
_doBuffer: function ( polyline ) {
if (this.debugMode) {
console.info( this.name + ' - DO BUFFER called');
console.info ( polyline );
}
bufferLineSize = dojo.byId('bufferDistance').value;
bufferUnits = dojo.byId('bufferUnits').value
try {
if (this.debugMode) {
console.info( this.name + ' - BUFFER LINE - ' + bufferLineSize
}
params = new BufferParameters();
params.distances = [ bufferLineSize ];
params.geometires = [ polyline ];
params.outSpatialReference = this.map.spatialReference
params.unit = GeometryService.UNIT_STATUTE_MILE;
if ( this.debugMode) {
console.info( this.name + ' - BUFFER...');
}
this.gsvc.buffer(params);
if (this.debugMode) {
console.info( this.name + ' - FINISHED BUFFERING...');
}
} catch (e) {
console.info( this.name + ' - Error in DO BUFFER');
console.info(e);
}
},
_showBuffer: funtion (results) {
if (this.debugMode) {
console.info( this.name + ' - SHOW BUFFER called');
console.info( results );
}
dojoColor = new dojo.Color(this.bufferColor);
rgbFillColor = dojoColor.toRgb();
rgbOutlineColor = dojoColor.toRgb();
alphaFill = 0.35;
alphaOutline = 1;
rgbFillColor[rgbFillColor.length] = alphaFill;
rgbOutlineColor[rgbOutlineColor.length] = alphaOutline;
symbol = new SimpleFillSymbol()
.setStyle(SimpleFillSymbol.STYLE_SOLID)
.setOutline(
new SimpleLineSymbol()
.setStyle(SimpleLineSymbol.STYLE_SOLID)
.setColor(rgbOutlineColor)
.setWidth(2)
)
.setCOlor(rgbFillColor);
graphic = new esri.Graphic(results.geometries[0],symbol);
this.graphsLyr.add(graphic);
}
});
});
I can give you other functions if needed, but I give the essentials, I believe. I get it to plot the buffer but not where the polyline is drawn. The data for the rings looks like this:
rings[0][
[-399.9999999,4053.06334471325],
[-367.648012018999,4056.249737401],
[-104.507677999999,4064.86406],
...
]
That comes out no where near the polyline that gets drawn.
Any insights?
Thanks in advance.
Solved! Go to Solution.
Matthew,
Try setting the buffer spatial ref:
params.bufferSpatialReference = new SpatialReference({wkid: 32662});
and also because you are using WGS 84 you should set the buffer param to geodesic true.
Matthew,
Is this code for a WAB widget or just a custom dojo dijit? What is the Spatial reference of the map?
Robert, thank you for the response. It is a Dojo Dijit, and the Spatial Reference is 4326. I hope this helps.
Matthew,
When you get to the line:
console.info( results );
in the _showBuffer function what is the spatial ref of the resulting polygon?
Hello Robert,
I get back the geometries[0]/spatialReference object with the attributes:
spatialReference/declaredClass:"esri.SpatialReference"
spatialReference/wkid:4326
spatialReference/wkt: null
If you need anymore, just let me know.
Thank You
Matthew,
Try setting the buffer spatial ref:
params.bufferSpatialReference = new SpatialReference({wkid: 32662});
and also because you are using WGS 84 you should set the buffer param to geodesic true.
Robert,
I entered my buffer settings now as:
params = new BufferParameters();
params.bufferSpatialReference = new SpatialReference({ wkid 32662 });
params.distances = [ bufferLineSize ];
params.geodesic = true;
params.geometries = [ polyline ];
params.outSpatialReference = this.map.spatialReference;
params.unit = GeometryService.UNIT_STATUTE_MILE;
That appears to have done it, applying the params.bufferSpatialReference = new SpatialReference({ wkid 32662 });, and the params.geodesic = true;. Though, I did try it without applying the geodesic parameters to true, and it appears to have not made any difference, but I'll keep it in, just in case.
Thank you for your help, Robert.