#javascript #angular #arcgis #arcgis-js-api #arcgis-server
#javascript #angular #arcgis #arcgis-js-api #arcgis-server
Вопрос:
Есть ли способ вернуть все атрибуты (поля) в векторном слое для PopupTemplate, не объявляя их все в fieldInfos
объекте в Angular?
.ts
const template = {
title: "{NAME} in {COUNTY}",
content: ,
fieldInfos : fieldInfos
};
const layer = new FeatureLayer({
url: this.featureLayerUrl,
visible: true,
popupTemplate : template
});
var fieldInfos = layer.map(layer.fields, function(field){
return {
"fieldName": field.name,
"label": field.alias,
"visible": true
webmap.add(layer);
.html
<!-- Map Div -->
Я использую arcgis-js-api версии 4.2.1.
Но когда я использую этот пример, он работает. (Но я хочу задать эти поля динамически.)
const fields = [{
name: "NAME",
alias: "Name",
type: "string"
}, {
name: "County",
alias: "County",
type: "string"
}, {
const config = {
fields: fields,
title: "County land"
};
Ответ №1:
Если вы просто хотите создать шаблон всплывающего окна по умолчанию (таблицу со всеми полями), то вам просто нужно использовать FeatureLayer
функцию createPopupTemplate
, она все сделает за вас (ArcGIS JS API — FeatureLayer createPopupTemplate).
Теперь, если вы хотите выполнить дополнительную настройку, вы можете использовать тот же метод или popupUtils
метод, который имеет дополнительный параметр.
Вот пример, который я сделал для вас, чтобы показать возможное использование, там все, что я делаю, это меняю alias
значения, чтобы сделать его более красивым.
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8' />
<meta name='viewport' content='initial-scale=1,maximum-scale=1,user-scalable=no' />
<title>FeatureLayer field and popup example - 4.21</title>
<link rel='stylesheet' href='https://js.arcgis.com/4.21/esri/themes/light/main.css' />
<script src='https://js.arcgis.com/4.21/'></script>
<style>
html,
body,
#viewDiv {
padding: 0;
margin: 0;
height: 100%;
width: 100%;
}
</style>
<script>
require([
'esri/views/MapView',
'esri/Map',
'esri/layers/FeatureLayer',
'esri/support/popupUtils'
], function (MapView, Map, FeatureLayer, popupUtils) {
const layer1 = new FeatureLayer({
url: 'https://services9.arcgis.com/RHVPKKiFTONKtxq3/arcgis/rest/services/USGS_Seismic_Data_v1/FeatureServer/1'
});
const layer2 = new FeatureLayer({
portalItem: {
id: "f9e348953b3848ec8b69964d5bceae02"
}
});
const layersToCreateMyPopupTemplate = [layer2, layer1];
const map = new Map({
basemap: 'gray-vector',
layers: layersToCreateMyPopupTemplate
});
const view = new MapView({
map: map,
container: 'viewDiv',
center: [-98, 40],
zoom: 4
});
const toNiceName = function(text) {
if (!text) {
return null;
}
return text
.toLowerCase()
.split(/_|__|s/)
.join(' ');
};
const createMyPopupTemplate = function(layer) {
console.log(layer.fields); // layer fields
const config = {
fields: layer.fields.map(field => (
{
name: field.name,
type: field.type,
alias: toNiceName(field.alias)
}
)),
title: toNiceName(layer.title)
};
console.log(config); // config parameter
return popupUtils.createPopupTemplate(config);
}
for (const layer of layersToCreateMyPopupTemplate) {
view.whenLayerView(layer).then(function (layerView) {
const popupTemplate = createMyPopupTemplate(layer)
console.log(popupTemplate); // popup template
if (!popupTemplate) {
console.log("FeatureLayer has no fields.")
} else {
layer.popupTemplate = popupTemplate;
}
});
}
});
</script>
</head>
<body>
<div id='viewDiv'></div>
</body>
</html>
fields
Свойство config
переменной в примере автоадаптации в качестве экземпляра esri/layers/support/Field, которое отличается тем, что это fieldInfos
свойство PopupTemplate
имеет тип FieldInfo .
Комментарии:
1. Это здорово!! Но я получаю такого рода ошибки. config не может быть присвоен параметру типа ‘Config’. Типы свойств «поля» несовместимы. Кроме того, у меня есть еще 2 слоя, и я хочу также получить все поля этих слоев, и возможно ли это?
2. Я обновил вопрос. Пожалуйста, взгляните.
3. Я обновил фрагмент и добавил дополнительную информацию, связанную с .. Если вы хотите использовать его для непосредственного размещения в
fieldInfos
шаблоне всплывающего окна, вам необходимо его адаптировать, по крайней мере, 1)name
дляfieldName
, 2) удалитьtype
, 3)alias
дляlabel