📄 finaldemo.html
字号:
//A feature that is found is passed in that will be added as a graphic
function showFeature(feature) {
//Clear graphics if the user runs the query back to back
map.graphics.clear();
curFeature = feature;
var fExtent = feature.geometry.getExtent();
//Recenter the map based upon the center of the parcel's extent
var centerPt = fExtent.getCenter();
map.centerAt(centerPt);
var symbol = new esri.symbol.SimpleFillSymbol(esri.symbol.SimpleFillSymbol.STYLE_SOLID, new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_DASHDOT, new dojo.Color([255, 0, 0]), 2), new dojo.Color([255, 255, 0, 0.5]));
feature.setSymbol(symbol);
//design what the info window will look like. It will list a series of attributes, and have an text box for buffer distance, button that will run the "RunGeometryService" function
feature.setInfoTemplate(new esri.InfoTemplate("Parcel ID : <pre style='display:inline;'>${TLID}</pre>",
"<form>Address : ${SITEADDR}"
+ "<br />Total Value : ${TOTALVAL}"
+ "<br />Tax Code : ${TAXCODE}"
+ "<br />Last Sale : ${SALEDATE}"
+ "<br />Sale Price : ${SALEPRICE}"
+ "<br />"
+ "<br /><b>Generate Mailing List: </b>"
+ "<br/> Enter buffer distance in ft: "
+ "<br/><input id='txtgpdist' width='30px' type='text' name='txtgpdist' value='100'> <input id='btnGP' type='button' onclick='RunGeometryService(dojo.byId('txtgpdist').value, curFeature)' value='Submit' ></form>"
));
map.graphics.add(feature);
map.infoWindow.resize(210, 210);
map.infoWindow.setTitle(feature.getTitle()).setContent(feature.getContent());
map.infoWindow.show(map.toScreen(centerPt), map.getInfoWindowAnchor(map.toScreen(centerPt)));
}
//In the info Window that gets returned from the Parcel Query, there is a "Submit" button associated to a distance the user enters for a buffer.
//When the user clicks the submit button, the RunGeometryService below will be executed
function RunGeometryService(distance, featureinput) {
//Geometry Service Endpoint
var gsvc = new esri.tasks.GeometryService("http://sampleserver1.arcgisonline.com/arcgis/rest/services/Geometry/GeometryServer");
var MailingQueryTask = new esri.tasks.QueryTask("http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Portland/Portland_ESRI_LandBase_AGO/MapServer/1");
var MailingQuery = new esri.tasks.Query();
MailingQuery.returnGeometry = true;
//A window will appear with the TaxLotID, address and city for parcels found within the buffer
//additional fields could be added, but they would need to be specified as outfields below
MailingQuery.outFields = ["TLID", "SITEADDR", "SITECITY"];
map.graphics.clear();
var feature = featureinput;
//Define input parameters for buffer
var params = new esri.tasks.BufferParameters();
params.features = [ feature ];
params.distances = [ distance ];
params.unit = esri.tasks.BufferParameters.UNIT_FEET;
//Set the spatial reference to the same as the input layers
params.bufferSpatialReference = new esri.SpatialReference({wkid: 102113});
//Use the geometry service to execute the buffer based upon above parameters
gsvc.buffer(params);
dojo.connect(gsvc, "onBufferComplete", function(features) {
var symbol = new esri.symbol.SimpleFillSymbol(
esri.symbol.SimpleFillSymbol.STYLE_SOLID,
new esri.symbol.SimpleLineSymbol(
esri.symbol.SimpleLineSymbol.STYLE_SOLID,
new dojo.Color([0,0,255,0.65]), 2
),
new dojo.Color([0,0,255,0.35])
);
//should only be one buffer polygon, so no need to loop through
//features[0] represents the first polygon returned
var bufferpoly = features[0].geometry;
features[0].setSymbol(symbol);
map.graphics.add(features[0]);
//Set up the spatial relationship of the query. In this case you want INTERSECTS to find all
//parcels that intersect the buffer polygon
MailingQuery.spatialRelationship = esri.tasks.Query.SPATIAL_REL_INTERSECTS;
//Pass in the extent of the buffer polygon to determine the parcels that fall within
MailingQuery.geometry = bufferpoly.getExtent();
MailingQueryTask.execute(MailingQuery);
});
// +++++Listen for QueryTask executecomplete event+++++
dojo.connect(MailingQueryTask, "onComplete", function(fset) {
dojo.byId('MailingLabels').innerHTML = " ";
var resultFeatures = fset.features;
var symbol = new esri.symbol.SimpleFillSymbol(
esri.symbol.SimpleFillSymbol.STYLE_SOLID,
new esri.symbol.SimpleLineSymbol(
esri.symbol.SimpleLineSymbol.STYLE_SOLID,
new dojo.Color([0,0,255,0.65]), 2
),
new dojo.Color([255,0,255,0.35])
);
for (var i=0, il=resultFeatures.length; i<il; i++) {
//alert ("found one");
dojo.byId('MailingLabels').innerHTML = (dojo.byId('MailingLabels').innerHTML + "<br />" + resultFeatures[i].attributes['SITEADDR'] + ", " + resultFeatures[i].attributes['SITECITY']);
resultFeatures[i].setSymbol(symbol);
map.graphics.add(resultFeatures[i]);
}
dijit.byId('MailingList').show()
});
}
//In the init() function, the populateTOC function below is synced with the OnLoad. It is used to
//add all the layers from the portland service into the "Identify Attributes" Floating Panel as check boxes so they can be identified
//No GIS functionality is performed in this function, it just gets a list of the layers
function populateToc() {
var layers = portlandService.layerInfos;
var layer, id;
numLayers = layers.length;
var s = [];
for (var i=0; i<numLayers; i++) {
layer = layers[i];
id = layer.id;
s.push("<input type=\"checkbox\" id=\"" + layerIdPrefix + id + "\" name=\"" + layerIdPrefix + id + "\" /><label for=\"" + layerIdPrefix + id + "\">" + layer.name + "</label>")
}
dojo.byId("toc").innerHTML = s.join("<br />");
}
//The syncIdentify function gets called when the "Identify Feature" button on the "Identify Attributes" Floating Panel is clicked
//It syncs everytime the user clicks on the map so the "doIdentify" function is called
function syncIdentify(){
Identify_OnClick = dojo.connect(map, "onClick", doIdentify);
}
//The doIdentify function accepts an event as an argument, which corresponds to the Map Click (X/Y location) as defined in the OnClick event- see syncIdentifyFunction
//That X/Y location (evt.MapPoint) is used as the input to identify layers. The identifyParams hold how/which layers will be returned.
function doIdentify(evt) {
//Clear the map if user performs Identify over and over
map.graphics.clear();
var symbol = new esri.symbol.SimpleMarkerSymbol(esri.symbol.SimpleMarkerSymbol.STYLE_SQUARE, 10, new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID, new dojo.Color([255,0,0]), 1), new dojo.Color([0,255,0,0.25]));
var graphic = new esri.Graphic(evt.mapPoint,symbol);
map.graphics.add(graphic);
identifyParams.geometry = evt.mapPoint;
identifyParams.layerOption = dojo.byId("layerOption").value;
identifyParams.mapExtent = map.extent;
//Determine which layers are checked to be identified and add to the identifyParams
var layerIds = identifyParams.layerIds = [];
for (var i = 0; i<numLayers; i++) {
if (dojo.byId(layerIdPrefix + i).checked) {
layerIds.push(i);
}
}
identify.execute(identifyParams)
}
//The addToMap function gets called when the "onComplete" event from the identify task is triggered
//The onComplete event is synced in the init funciton when the application loads
//this function will add a graphic for any feature that is identified and set the info template
//The user must click the graphic again to see the info window appear
function addToMap(results) {
for (var i=0, il=results.length; i<il; i++) {
var graphic = results[i].feature;
switch (graphic.geometry.type) {
case "point":
var symbol = new esri.symbol.SimpleMarkerSymbol(esri.symbol.SimpleMarkerSymbol.STYLE_SQUARE, 10, new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID, new dojo.Color([0,255,0]), 1), new dojo.Color([0,255,0,0.25]));
break;
case "polyline":
var symbol = new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_DASH, new dojo.Color([0,255,0]), 1);
break;
case "polygon":
var symbol = new esri.symbol.SimpleFillSymbol(esri.symbol.SimpleFillSymbol.STYLE_NONE, new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_DASHDOT, new dojo.Color([0,255,0]), 2), new dojo.Color([0,255,0,0.25]));
break;
case "multipoint":
var symbol = new esri.symbol.SimpleMarkerSymbol(esri.symbol.SimpleMarkerSymbol.STYLE_DIAMOND, 20, new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID, new dojo.Color([0,0,0]), 1), new dojo.Color([0,255,0,0.5]));
break;
}
graphic.setSymbol(symbol);
var infoTemplate = new esri.InfoTemplate("Layer Name: " + results[i].layerName,"${*}");
graphic.setInfoTemplate(infoTemplate);
map.graphics.add(graphic);
}
}
//when the "Draw Polygon to Clip to" button on the "Clip and Ship" floating panel is clicked, the below function is called
//It activates the drawing toolbar (not visible to UI) and indicates to start drawing polygons
function initToolbar() {
//Disconnect from Identify Event in case user ran identify first, otherwise
//map will expect to identify rather than draw polygon alone
dojo.disconnect(Identify_OnClick);
map.graphics.clear();
var tb = new esri.toolbars.Draw(map);
//find points in Extent when user completes drawing extent
dojo.connect(tb, "onDrawEnd", addClipGraphic);
//set drawing mode to extent
tb.activate(esri.toolbars.Draw.POLYGON);
}
//In the "initToolbar" function, when the "onDrawEnd" event is triggered from a polygon being completed,
//the below function funs which adds a graphic representing the polygon with default symbology
function addClipGraphic(geometry) {
var symbol = new esri.symbol.SimpleLineSymbol();
map.graphics.add(new esri.Graphic(geometry, symbol));
}
function clipship() {
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -