我正在努力在彈出視窗中顯示單擊區域的結果，這使用戶可以輕松瀏覽所選的功能集。這有助于簡化顯示識別結果的程序。用戶無需在單獨的選項卡中或以復雜的樹視圖結構顯示來自多個特征的結果，而是可以簡單地向前和向后瀏覽識別結果。
但是，當單擊我的代碼沒有顯示彈出視窗時，我在我的代碼中為彈出視窗定義了函式，但仍然沒有實作。有什么建議？
<html>
<head>
<meta charset="utf-8" />
<meta
name="viewport"
content="initial-scale=1,maximum-scale=1,user-scalable=no"
/>
<style>
html,
body,
#viewDiv {
padding: 0;
margin: 0;
height: 100%;
width: 100%;
}
.esri-popup .esri-popup-header .esri-title {
font-size: 18px;
font-weight: bolder;
}
.esri-popup .esri-popup-body .esri-popup-content {
font-size: 14px;
}
</style>
<link
rel="stylesheet"
href="https://js.arcgis.com/4.21/esri/themes/light/main.css"
/>
<script src="https://js.arcgis.com/4.21/"></script>
<script>
require([
"esri/Map",
"esri/views/MapView",
"esri/layers/MapImageLayer",
"esri/rest/identify",
"esri/rest/support/IdentifyParameters"
], function (Map, MapView, MapImageLayer, identify, IdentifyParameters) {
var params;
var identifyURL =
"https://sampleserver6.arcgisonline.com/arcgis/rest/services/MtBaldy_BaseMap/MapServer";
var identifyLayer = new MapImageLayer({
url: identifyURL,
opacity: 0.5
});
var map = new Map({
basemap: "osm"
});
map.add(identifyLayer);
var view = new MapView({
map: map,
container: "viewDiv",
center: [-117.23502, 34.23911],
zoom: 13
});
view.when(function () {
view.on(executeIdentify);
params = new IdentifyParameters();
params.tolerance = 3;
params.layerIds = [0, 1, 2, 3, 4];
params.layerOption = "top";
params.width = view.width;
params.height = view.height;
});
function executeIdentify(event) {
params.geometry = event.mapPoint;
params.mapExtent = view.extent;
document.getElementById("viewDiv").style.cursor = "wait";
identify
.identify(identifyURL, params)
.then(function (response) {
var results = response.results;
return results.map(function (result) {
var feature = result.feature;
var layerName = result.layerName;
feature.attributes.layerName = layerName;
if (layerName === "Roads") {
feature.popupTemplate = {
title: layerName,
content:
"<b>Block ID:</b> {BLOCK_ID} "
"<br><b>Geometry Type:</b> {Shape}"
"<br><b>Road Length:</b> {Shape_Length}"
};
} else if (layerName === "water") {
feature.popupTemplate = {
title: "{LABEL_LOCAL}",
content:
"<b>Block ID:</b> {BLOCK_ID} "
"<br><b>Geometry Type:</b> {Shape}"
"<br><b>Water Area:</b> {Shape_Area}"
};
} else if (layerName === "Urban") {
feature.popupTemplate = {
title: layerName,
content:
"<b>Block ID:</b> {BLOCK_ID} "
"<br><b>Geometry Type:</b> {Shape}"
"<br><b>Urban Area:</b> {Shape_Area}"
};
} else if (layerName === "Landuse") {
feature.popupTemplate = {
// autocasts as new PopupTemplate()
title: layerName,
content:
"<b>Block ID:</b> {BLOCK_ID} "
"<br><b>Geometry Type:</b> {Shape}"
"<br><b>Landuse Area:</b> {Shape_Area}"
};
} else if (layerName === "Counties") {
feature.popupTemplate = {
title: layerName,
content:
"<b>ObjectID:</b> {OBJECTID} "
"<br><b>Geometry Type:</b> {Shape}"
"<br><b>Landuse Area:</b> {Shape_Area}"
};
}
return feature;
});
})
.then(showPopup); // Send the array of features to showPopup()
function showPopup(response) {
if (response.length > 0) {
view.popup.open({
features: response,
location: event.mapPoint
});
}
document.getElementById("viewDiv").style.cursor = "auto";
}
}
});
</script>
</head>
<body>
<div id="viewDiv"></div>
</body>
</html>uj5u.com熱心網友回復：
您沒有宣告 click 函式，當然是您define the function what will happen once you click，但是您在代碼中的確切位置提到了當您單擊此函式時將執行。
替換您的代碼如下：
view.when(function () {
// executeIdentify() is called each time the view is clicked
view.on("click", executeIdentify);
// Set the parameters for the identify
params = new IdentifyParameters();
params.tolerance = 3;
params.layerIds = [0, 1, 2, 3, 4];
params.layerOption = "top";
params.width = view.width;
params.height = view.height;
});
轉載請註明出處，本文鏈接：https://www.uj5u.com/net/335678.html