官方文档:PopupTemplate | ArcGIS API for JavaScript 4.18 (gdeei.cn)
标记点面配置popupTemplate,我的弹窗内容需要的是表格形式的
outFields: ['*'],
popupTemplate: {
title: "{name}",//弹窗标题
content: [
{
type: "fields",
fieldInfos: [
{
label: "隶属行政村",
fieldName: "数据返回的字段",
},
]
}
],
actions: [ // 配置弹窗按钮
{
id: "btn1", // 按钮1的唯一标识符
title: "详情", // 按钮的显示文本
visible: true, // 按钮1的可见性
disabled: false, // 按钮的可用性
type: "button", // 按钮类型为"button"
className: "esri-icon-edit"
},
],
},
弹窗配置按钮的点击事件监听
this.vm.view.popup.on("trigger-action", async (event) => {
const actionId = event.action.id;
const actionTitle = event.action.title;
const clickedGraphic = this.vm.view.popup.selectedFeature;
const areaId = clickedGraphic.attributes["area_id"];
if (actionId === "btn1") {
// 按钮1
} else if (actionId === "btn2") {
// 按钮2
}
})
点击弹窗的标题默认折叠掉弹窗的内容,我没有找到相关的配置把它关掉,所以是通过css禁止掉鼠标事件的
.esri-popup__header-container--button {
pointer-events: none;
}