Uso"esri/views/draw/Draw"
var draw=new Draw({view:view});
var graphicsLayer=new GraphicsLayer();
map.add(graphicsLayer);
Punto de empate
function drawPoint(view,graphicsLayer,draw){
require([
"esri/Graphic",
], function(
Graphic,
){
graphicsLayer.removeAll();
var action = draw.create("point");
action.on("draw-complete",draw1);
function draw1(event) {
var point = {
type: "point",
x: event.coordinates[0],
y: event.coordinates[1],
spatialReference: view.spatialReference
};
var markerSymbol={
type:"simple-marker",
color:[255,0,0],
outline:{
color:[255,255,255],
width:2
}
};
var inputPoint = new Graphic({
geometry: point,
symbol: markerSymbol
});
graphicsLayer.add(inputPoint);
}
})
}
Línea de empate
graphicsLayer.removeAll();
var action = draw.create("polyline",{mode: "click"});
action.on(["vertex-add","cursor-update","draw-complete"],draw1);
function draw1(event) {
graphicsLayer.removeAll();
var line={
type: "polyline",
paths: event.vertices,
spatialReference: view.spatialReference
};
var lineSymbol={
type:"simple-line",
color:[255,0,0],
width: 4,
cap: "round",
join: "round"
};
var inputPolyline = new Graphic({
geometry: line,
symbol: lineSymbol
});
graphicsLayer.add(inputPolyline);
}
Pantalla
graphicsLayer.removeAll();
var action = draw.create("polygon",{mode: "click"});
action.on(["vertex-add","cursor-update","draw-complete"],draw1);
function draw1(event) {
graphicsLayer.removeAll();
var line={
type: "polygon",
rings: event.vertices,
spatialReference: view.spatialReference
};
var lineSymbol={
type:"simple-fill",
color:[255, 255, 255, 0.7],
style: "solid",
outline: {
color: "red",
width: 1
}
};
var inputPolygon = new Graphic({
geometry: line,
symbol: lineSymbol
});
graphicsLayer.add(inputPolygon);
}
Pintura
graphicsLayer.removeAll();
var action = draw.create("circle");
action.on(["vertex-add","cursor-update","draw-complete"],draw1);
function draw1(event) {
graphicsLayer.removeAll();
var vertices=event.vertices;
if(vertices.length<2){
return;
}
var center=new Point({
x:vertices[0][0],
y:vertices[0][1],
spatialReference: view.spatialReference
});
var dis=center.distance(new Point({
x:vertices[1][0],
y:vertices[1][1],
spatialReference: view.spatialReference
}));
var line= new Circle({
type: "circle",
center:center,
radius:dis,
spatialReference: view.spatialReference
});
var lineSymbol={
type:"simple-fill",
color:[255, 255, 255, 0.2],
style: "solid",
outline: {
color: "red",
width: 1
}
};
var inputPolygon = new Graphic({
geometry: line,
symbol: lineSymbol
});
graphicsLayer.add(inputPolygon);
}
Dibujar rectángulo
graphicsLayer.removeAll();
var action = draw.create("rectangle");
action.on(["vertex-add","cursor-update","draw-complete"],draw1);
function draw1(event) {
graphicsLayer.removeAll();
var vertices=event.vertices;
if(vertices.length<2){
return;
}
var rings=[[vertices[0],[vertices[1][0],vertices[0][1]],vertices[1],[vertices[0][0],vertices[1][1]]]];
var line={
type: "polygon",
rings: rings,
spatialReference: view.spatialReference
};
var lineSymbol={
type:"simple-fill",
color:[255, 255, 255, 0.7],
style: "solid",
outline: {
color: "red",
width: 1
}
};
var inputPolygon = new Graphic({
geometry: line,
symbol: lineSymbol
});
graphicsLayer.add(inputPolygon);
}
.