发布有附件的要素服务和前端查询附件

0
分享 2020-07-28
启用附件的要素服务支持对附件进行查询和编辑。附件是与地理数据库中的要素或对象关联的介质文件。可以向单个要素添加文件作为附件,它们可以是图像、PDF、文本文档或任意其他文件类型。例如,如果用某个要素表示建筑物,则可以使用附件来添加多张从不同角度拍摄的建筑物照片及包含建筑物其他信息的 PDF 文件等。
本次使用软件:ArcGIS Enterprise10.7.1、arcgis pro2.5、
具体步骤:
1、启用附件:要添加文件附件,首先需要在要素类或表中启用附件。在创建的企业级地理数据库中找到对应的要素数据右键,Manage - Enable Attachments, 或者使用工具箱中的启用附件工具。


启用附件后,会自动新建一个table表和关系类来建立关联。

2、向要素中添加附件
方式1:使用Edit:选择要添加附件的某个要素,右键选择attributes,在attributes窗口切换到Attachments,点击add添加附件。



方式2:使用添加附件工具 add attachments

3、发布要素服务


4、验证启用附件的要素服务对附件是否可以进行查询和编辑(包括queryAttachmentaddAttachmentdeleteAttachmentsupdateAttachment ),每一个操作都有相应的前提条件




查看发布的要素服务地址验证下服务是否满足条件:


5、可以在server rest服务地址找到对应接口的测试页面进行测试:
(1)queryAttachment接口:

(2):addAttachment 、deleteAttachments 、updateAttachment接口需要具体定位到某个要素,如下图中的请求地址,然后进行操作。





attachmentid 和 objectid具体可以通过table表进行查看。

6、利用arcgis api for javascript查询附件
使用FeatureLayer中queryAttachments 方法实现查询:
具体代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"/>
<title>Query Attachments - 4.14</title>
<style>
html,
body {
height: 100%;
width: 100%;
margin: 0;
padding: 0;
}
#attachmentsDiv {
height: 100%;
width: 30%;
float: left;
padding: 20px;
overflow: auto;
min-width: 240px;
}
#viewDiv {
height: 100%;
max-width: 70%;
}
.queryImg {
width: 175px;
padding-right: 5px;
}
</style>
<link rel="stylesheet" href="https://js.arcgis.com/4.14/esr ... gt%3B
<script src="https://js.arcgis.com/4.14/%26 ... gt%3B
<script>
require([
"esri/Map",
"esri/views/MapView",
"esri/layers/FeatureLayer"
], function(Map, MapView, FeatureLayer) {
const layer = new FeatureLayer({
url:"https://wl.arcgisonline.cn/ser ... ot%3B,
outFields: ["*"]
});
const map = new Map({
basemap: "osm",
layers: [layer]
});
const view = new MapView({
container: "viewDiv",
map: map,
zoom: 6
});
let highlight;
view.on("click", function(event) {
clearMap();
queryFeatures(event);
});
function queryFeatures(screenPoint) {
const point = view.toMap(screenPoint);
// Query the for the object ids within 800m from where the user clicked
layer
.queryObjectIds({
geometry: point,
spatialRelationship: "intersects",
distance: 3000,
units: "meters",
returnGeometry: false,
outFields: ["*"]
})
.then(function(objectIds) {
if (!objectIds.length) {
showMessage();
return;
}
// Highlight the query-area on the map
view.whenLayerView(layer).then(function(layerView) {
if (highlight) {
highlight.remove();
}
highlight = layerView.highlight(objectIds);
});
// Query the for the attachments from the object ids found
return layer.queryAttachments({
attachmentTypes: ["image/jpeg"],
objectIds: objectIds
});
})
.then(function(attachmentsByFeatureId) {
if (!attachmentsByFeatureId) {
return;
}
if (Object.keys(attachmentsByFeatureId).length === 0) {
const infoP = document.createElement("p");
infoP.innerHTML =
"[b]There are no tree image/jpeg attachments located in your query area.[/b]";
document.getElementById("queryResults").appendChild(infoP);
}
// Display the attachments
Object.keys(attachmentsByFeatureId).forEach(function(objectId) {
const attachments = attachmentsByFeatureId[objectId];
attachments.forEach(function(attachment) {
const image = document.createElement("img");
image.src = attachment.url;
image.className = "queryImg";
document.getElementById("queryResults").appendChild(image);
});
});
})
.catch(function(error) {
showMessage();
});
}
function showMessage() {
clearMap();
const infoP = document.createElement("p");
infoP.innerHTML =
"[b]There are no image/jpg attachments located in your query area.[/b]";
document.getElementById("queryResults").appendChild(infoP);
}
// Clear attachments from div
function clearMap() {
if (highlight) {
highlight.remove();
}
const att = document.getElementById("queryResults");
while (att.firstChild) {
att.removeChild(att.firstChild);
}
}
});
</script>
</head>
<body>
<div id="attachmentsDiv" class="esri-widget">
<h2>Query Results</h2>
<div id="queryResults">

<div id="viewDiv">
</body>
</html>

效果图:

另外也可以点击要素弹出窗口查看附件:


文章来源:https://blog.csdn.net/qq_40376439/article/details/105217075

0 个评论

要回复文章请先登录注册