` ````
<div id="map"></div>
```

` ````
html, body, #map {
border: 0;
margin: 0;
padding: 0;
width: 100%;
height: 100%;
overflow: hidden;
}
```

` ````
require(["dojo/_base/array", "esri/map", "esri/toolbars/draw", "esri/graphic", "esri/geometry/Polygon", "esri/geometry/Polyline", "esri/geometry/Point", "esri/symbols/SimpleFillSymbol", "esri/symbols/SimpleLineSymbol", "esri/symbols/SimpleMarkerSymbol",
"esri/InfoTemplate", "esri/geometry/geometryEngine", "dojo/domReady!"
], function(arrayUtils, Map, Draw, Graphic, Polygon, Polyline, Point, FillSymbol, LineSymbol, MarkerSymbol, InfoTemplate, geometryEngine) {
var index = 0;
var delayInMilliseconds = 10;
var drawTool;
var map = new Map("map", {
basemap: "topo",
center: [-122.45, 37.75],
zoom: 13
});
function addShapeToMap(geometry) {
var graphic;
switch (geometry.type.toLowerCase()) {
case "polygon":
graphic = new Graphic(geometry, new FillSymbol({
"type": "esriSFS",
"style": "esriSFSSolid",
"color": [115, 76, 0, 64],
"outline": {
"type": "esriSLS",
"style": "esriSLSSolid",
"color": [110, 110, 110, 255],
"width": 1
}
}), {
"test": index++
}, new InfoTemplate("polygon", "test = ${test}"));
break;
case "polyline":
graphic = new Graphic(geometry, new LineSymbol({
"type": "esriSLS",
"style": "esriSLSSolid",
"color": [0, 76, 255, 255],
"width": 2
}), {
"test": index++
}, new InfoTemplate("polyline", "test = ${test}"));
break;
case "point":
graphic = new Graphic(geometry, new MarkerSymbol({
"type": "esriSMS",
"style": "esriSMSX",
"color": [225, 20, 20, 255],
"size": 12,
"angle": 0,
"xoffset": 0,
"yoffset": 0,
"outline": {
"color": [225, 20, 20, 255],
"width": 1
}
}), {
"test": index++
}, new InfoTemplate("point", "test = ${test}"));
break;
default:
alert("Unknown geometry type: " + geometry.type);
}
if (graphic) {
map.graphics.add(graphic);
}
}
function generatePoint(line, polygonToTest) {
var segment = line.paths[0];
var pointArray = segment[0].map(function(item, i) {
return (item + segment[1][i]) / 2;
});
var point = new Point(pointArray);
point.setSpatialReference(map.spatialReference);
if (polygonToTest.contains(point)) {
addShapeToMap(point);
}
}
//draw line across the middle of the polygon extent.
function generateIntersect(polygon) {
// generate a polygon from the first ring of the polygon
var avgLine, intersects, intersectLine;
arrayUtils.some(polygon.rings, function(ring) {
// make a polygon from the first ring and get its extent.
var polygonFromRing = new Polygon(ring);
polygon.setSpatialReference(map.spatialReference);
var extent = polygonFromRing.getExtent();
// draw a horizontal line that should go through the middle of the current ring
var yAvg = (extent.ymin + extent.ymax) / 2;
var yAvgLine = new Polyline([
[extent.xmin, yAvg],
[extent.xmax, yAvg]
]);
yAvgLine.setSpatialReference(map.spatialReference);
// test if the horizontal line intersects the whole polygon somehow.
intersects = geometryEngine.intersects(yAvgLine, polygon);
if (intersects) {
// if so, create the intersection line from that line
intersectLine = geometryEngine.intersect(yAvgLine, polygon);
return intersects;
}
// draw a vertical line that should go through the middle of the current ring
var xAvg = (extent.xmin + extent.xmax) / 2;
var xAvgLine = new Polyline([
[xAvg, extent.ymin],
[xAvg, extent.ymax]
]);
xAvgLine.setSpatialReference(map.spatialReference);
// test if the vertical line interesects with the whole polygon
intersects = geometryEngine.intersects(xAvgLine, polygon);
if (intersects) {
// if intersects, create an intersecting line between the two shapes.
intersectLine = geometryEngine.intersect(yAvgLine, polygon);
}
return intersects;
});
if (intersects) {
addShapeToMap(intersectLine);
window.setTimeout(function() {
generatePoint(intersectLine, polygon);
}, delayInMilliseconds);
};
}
function addDrawing() {
drawTool = new Draw(map);
drawTool.on("draw-end", onDrawComplete);
drawTool.activate(Draw.FREEHAND_POLYGON);
}
function onDrawComplete(results) {
var geometry = geometryEngine.simplify(results.geometry);
addShapeToMap(geometry);
window.setTimeout(function() {
generateIntersect(geometry);
}, delayInMilliseconds);
}
if (map.loaded) {
addDrawing();
} else {
map.on("load", addDrawing);
}
});
```

999px

Loading
..................

Alt F
Opt F
Find & Replace

Also see: Tab Triggers