此微件提供要素图层中每个要素属性的交互式表格视图。此外，它还适用于不与基础几何关联的独立表。使用大型数据集时，表会在用户滚动时加载其他要素。
已知限制
- 尚不支持数字和日期格式，但将在将来的版本中添加。
- 目前不支持查看相关记录。
- 当前不支持查看附件，但如果要素包含附件，将显示每个要素的总计数。
- 仅从版本 4.20 开始支持 SceneLayer。仅当 SceneLayer 具有关联的 FeatureLayer 时，才受支持。
下图显示了没有任何关联地图的独立 FeatureTable 微件。
下图显示了具有关联地图的 FeatureTable 微件。
- 另请参阅：
构造函数
-
new FeatureTable(properties)
-
参数：properties Objectoptional
有关可能传递到构造函数中的所有属性的列表，请参阅属性。
示例：// Typical usage for FeatureTable widget. This will recognize all fields in the layer if none are set. const featureTable = new FeatureTable({ view: view, // The view property must be set for the select/highlight to work layer: featureLayer, container: "tableDiv" });
属性概述
| 名称 | 类型 | 描述 | 类： | |
|---|---|---|---|---|
| Boolean | 更多详情 指示是否在表中显示 | 更多详情 | FeatureTable | |
| Boolean | 更多详情 更新表的关联图层后，将自动刷新表。 | 更多详情 | FeatureTable | |
| Boolean | 更多详情 当 | 更多详情 | FeatureTable | |
| Collection<FieldColumn> | 更多详情 表中列列的集合。 | 更多详情 | FeatureTable | |
| String|HTMLElement | 更多详情 表示包含微件的 DOM 元素的 ID 或节点。 | 更多详情 | Widget | |
| String | 更多详情 类的名称。 | 更多详情 | Accessor | |
| Boolean | 更多详情 指示是否对要素表中的数据启用编辑。 | 更多详情 | FeatureTable | |
| FieldColumnConfig[] | 更多详情 单个字段配置对象的数组。 | 更多详情 | FeatureTable | |
| Geometry | 更多详情 设置此属性可过滤表中显示的要素。 | 更多详情 | FeatureTable | |
| Boolean | 更多详情 指示在选择行时是否高亮显示关联的要素。 | 更多详情 | FeatureTable | |
| String | 更多详情 创建微件时分配给微件的唯一 ID。 | 更多详情 | Widget | |
| String | 更多详情 微件的默认标注。 | 更多详情 | FeatureTable | |
| FeatureLayer|SceneLayer|GeoJSONLayer|CSVLayer|WFSLayer|ImageryLayer | 更多详情 关联的 FeatureLayer、SceneLayer、GeoJSONLayer、CSVLayer、ImageryLayer 或 WFSLayer，其中包含要在微件中显示的字段和属性。 | 更多详情 | FeatureTable | |
| ButtonMenu | 更多详情 对 FeatureTable 的主菜单的引用。 | 更多详情 | FeatureTable | |
| ButtonMenuConfig | 更多详情 设置此对象可自定义要素表的菜单内容。 | 更多详情 | FeatureTable | |
| Boolean | 更多详情 指示表中是否支持对多个列进行排序。 | 更多详情 | FeatureTable | |
| Number | 更多详情 在表格中显示要素时使用的默认页面大小。 | 更多详情 | FeatureTable | |
| String | 更多详情 微件的状态。 | 更多详情 | FeatureTable | |
| MapView | 更多详情 对 MapView 的引用。 | 更多详情 | FeatureTable | |
| FeatureTableViewModel | 更多详情 此微件的视图模型。 | 更多详情 | FeatureTable | |
| Boolean | 更多详情 指示微件是否可见。 | 更多详情 | Widget | |
| VisibleElements | 更多详情 显示在微件中的可见元素。 | 更多详情 | FeatureTable |
属性详细信息
-
attachmentsEnabled Boolean
-
指示是否在表中显示
Attachments字段。仅当要素图层支持附件时，这才适用。目前，此字段仅显示每个要素的附件计数。
- 默认值：false
-
autoRefreshEnabled Boolean起始版本：GeoScene API for JavaScript 4.23
-
更新表的关联图层后，将自动刷新表。
- 默认值：true
-
columnReorderingEnabled Boolean起始版本：GeoScene API for JavaScript 4.16
-
当
true时，可以通过拖动列的标题对列进行重新排序。- 默认值：true
-
columns Collection<FieldColumn>autocast起始版本：GeoScene API for JavaScript 4.16
-
表中列列的集合。
-
-
表示包含微件的 DOM 元素的 ID 或节点。此属性只能设置一次。以下示例是使用微件时的所有有效用例。
示例：// Create the HTML div element programmatically at runtime and set to the widget's container const basemapGallery = new BasemapGallery({ view: view, container: document.createElement("div") }); // Add the widget to the top-right corner of the view view.ui.add(basemapGallery, { position: "top-right" });// Specify an already-defined HTML div element in the widget's container const basemapGallery = new BasemapGallery({ view: view, container: basemapGalleryDiv }); // Add the widget to the top-right corner of the view view.ui.add(basemapGallery, { position: "top-right" }); // HTML markup <body> <div id="viewDiv"></div> <div id="basemapGalleryDiv"></div> </body>// Specify the widget while adding to the view's UI const basemapGallery = new BasemapGallery({ view: view }); // Add the widget to the top-right corner of the view view.ui.add(basemapGallery, { position: "top-right" });
-
类的名称。声明的类名格式为
geoscene.folder.className。
-
editingEnabled Boolean起始版本：GeoScene API for JavaScript 4.16
-
指示是否对要素表中的数据启用编辑。双击像元将启用对该值的编辑。
编辑权限可以按以下优先级细分：
- Field - 这派生自 FeatureLayer。它采用在 Field.editable 属性中设置的内容。要启用编辑，必须始终为
true。可以使用段列配置字覆盖此内容。 - Config - 可以通过设置 FieldColumnConfig 的可编辑属性来配置字段的可编辑权限。
- FeatureTable - 必须在表上设置 editingEnabled 属性，才能启用任何类型的编辑。
例如，如果在微件中禁用了表编辑，即不设置
enableEditing，仍可以通过设置可编辑属性来启用对特定列的编辑。反之亦然，如果启用了表编辑，则可以使用字段配置来禁用对特定列的编辑。最终，如果服务的字段不可编辑，则无法使用上述选项之一覆盖其权限。
- 默认值：false
- 另请参阅：
- Field - 这派生自 FeatureLayer。它采用在 Field.editable 属性中设置的内容。要启用编辑，必须始终为
-
fieldConfigs FieldColumnConfig[]autocast
-
单个字段配置对象的数组。您可以在此处指定要显示的字段以及要如何显示这些字段。
如果未设置，则将包括除
CreationDate、Creator、EditDate、Editor和GlobalID之外的所有字段。否则，由开发人员设置要覆盖和显示的正确字段。- 默认值：除 `CreationDate`、`Creator`、`EditDate`、`Editor` 和 `GlobalID`之外的所有字段
-
起始版本：GeoScene API for JavaScript 4.19
-
示例：
// Filter the table to only display the associated feature(s) that fall within the filterGeometry's geometry, (e.g. Extent) featureLayer.watch("loaded", () => { reactiveUtils.when(() => view.updating === false, () => { // Get the new extent of view/map whenever map is updated if (view.extent) { // Filter and show only the visible features in the feature table featureTable.filterGeometry = view.extent; } }); });
-
highlightOnRowSelectEnabled Boolean起始版本：GeoScene API for JavaScript 4.16
-
指示在选择行时是否高亮显示关联的要素。
- 默认值：true
-
创建微件时分配给构件的唯一 ID。如果未由开发人员设置，它将默认为容器 ID，或者如果不存在，则将自动生成。
-
label String
-
微件的默认标注。
-
关联的 FeatureLayer、SceneLayer、GeoJSONLayer、CSVLayer、ImageryLayer 或 WFSLayer，其中包含要在微件中显示的字段和属性。表的分页默认为一次
50条记录。如果图层包含的记录少于 50 条，它将使用其具有的任何计数。请注意，0 条记录不适用。- 在版本 4.21 中添加了对 GeoJSONLayer、CSVLayer、ImageryLayer 和 WFSLayer 的支持。
- 要使 ImageryLayer 与 FeatureTable 配合使用，它必须具有镶嵌数据集。目前，不支持与
ImageryLayers进行Map和FeatureTable交互。
-
起始版本：GeoScene API for JavaScript 4.19
-
对 FeatureTable 的主菜单的引用。
当列的可见性更改时，将重新生成菜单的项目。使用 FeatureTable 的 menuConfig 和 menuConfig.items 来自定义菜单项。建议使用这些选项，而不是直接从
menu中更新表的items。这有助于确保菜单始终显示正确的项目。
-
起始版本：GeoScene API for JavaScript 4.16
-
设置此对象可自定义要素表的菜单内容。
-
multiSortEnabled Boolean起始版本：GeoScene API for JavaScript 4.23
-
指示表中是否支持对多个列进行排序。将其与 FieldColumnConfig.initialSortPriority 和 FieldColumnConfig.direction 属性结合使用，可设置多个列的排序功能。
- 默认值：false
- 另请参阅：
示例：const featureTable = new FeatureTable({ layer: featureLayer, multiSortEnabled: true, fieldConfigs: [{ // autocasts to FieldColumnConfig name: "ObjectId", direction: "asc", initialSortPriority: 1, // This field's sort order takes second-highest priority. }, { name: "Name", direction: "asc", initialSortPriority: 0, // This field's sort order takes the highest priority. }, { name: "Status", direction: "asc", initialSortPriority: 2 // This field's sort order is prioritized after Name and ObjectId, respectively. }], container: "tableDiv" });
-
pageSize Number起始版本：GeoScene API for JavaScript 4.19
-
在表格中显示要素时使用的默认页面大小。默认情况下，页面加载服务返回的前 50 个要素。
不可能覆盖服务器上的最大页面大小，即。
maxRecordCount，因为此属性仅适用于小于最大页面大小的设置值，即maxRecordCount，在服务上设置的值。- 默认值：50
- 另请参阅：
-
state String
-
微件的状态。
可能的值："disabled"|"loading"|"ready"
-
viewModel FeatureTableViewModelautocast
-
此微件的视图模型。这是一个包含控制此微件行为的所有逻辑（属性和方法）的类。请参阅 FeatureTableViewModel 类以访问微件上的所有属性和方法。
-
指示微件是否可见。
如果
false，则该微件将不再呈现在 web 文档中。这可能会影响文档中其他元素或微件的布局。例如，如果此微件是与视图 UI 右上角关联的三个微件中的第一个，则当此微件变为不可见时，其他微件将重新定位。有关详细信息，请参阅"none"的 CSS 显示值。- 默认值：true
示例：// Hides the widget in the view widget.visible = false;
-
visibleElements VisibleElementsautocast
-
显示在微件中的可见元素。此属性提供了打开/关闭微件显示的各个元素的功能。
示例：// Default values are displayed below featureTable.visibleElements = { header: true, menu: true, menuItems: { clearSelection: true, refreshData: true, toggleColumns: true, selectedRecordsShowAllToggle: true, selectedRecordsShowSelectedToggle: true, zoomToSelection: true }, selectionColumn: true, columnMenus: true }
方法概述
| 名称 | 返回类型 | 描述 | 类： | |
|---|---|---|---|---|
| String | 更多详情 用于为微件的 | 更多详情 | Widget | |
| 更多详情 这将清除所有突出显示的要素。 | 更多详情 | FeatureTable | ||
| 更多详情 清除表中的当前选定内容。 | 更多详情 | FeatureTable | ||
| 更多详情 清除表中的当前选择过滤器。 | 更多详情 | FeatureTable | ||
| 更多详情 取消选择表中的指定行。 | 更多详情 | FeatureTable | ||
| 更多详情 销毁微件实例。 | 更多详情 | Widget | ||
| Boolean | 更多详情 在实例上发出事件。 | 更多详情 | Widget | |
| 更多详情 按当前选择过滤表。 | 更多详情 | FeatureTable | ||
| FieldColumn | 更多详情 在要素表中查找指定的列。 | 更多详情 | FeatureTable | |
| Boolean | 更多详情 指示实例上是否存在与提供的事件名称匹配的事件侦听器。 | 更多详情 | Widget | |
| 更多详情 在要素表中隐藏指定的列。 | 更多详情 | FeatureTable | ||
| Boolean | 更多详情
| 更多详情 | Widget | |
| Boolean | 更多详情
| 更多详情 | Widget | |
| Boolean | 更多详情
| 更多详情 | Widget | |
| Object | 更多详情 在实例上注册事件处理程序。 | 更多详情 | Widget | |
| 更多详情 微件拆解助手。 | 更多详情 | Widget | ||
| 更多详情 此方法主要由开发人员在实现自定义微件时使用。 | 更多详情 | Widget | ||
| 更多详情 刷新表格内容，同时保持当前滚动位置。 | 更多详情 | FeatureTable | ||
| Object | 更多详情 此方法主要由开发人员在实现自定义微件时使用。 | 更多详情 | Widget | |
| 更多详情 立即将微件渲染给 DOM。 | 更多详情 | Widget | ||
| 更多详情 此方法主要由开发人员在实现自定义微件时使用。 | 更多详情 | Widget | ||
| 更多详情 根据指定的索引将表滚动到一行。 | 更多详情 | FeatureTable | ||
| 更多详情 选择表中的指定行。 | 更多详情 | FeatureTable | ||
| 更多详情 显示表中的所有列。 | 更多详情 | FeatureTable | ||
| 更多详情 显示要素表中的指定列。 | 更多详情 | FeatureTable | ||
| 更多详情 按升序 （“asc”） 或降序 （“desc”） 对列进行排序。 | 更多详情 | FeatureTable | ||
| Promise | 更多详情
| 更多详情 | Widget | |
| 更多详情 将视图缩放至当前行选择的范围。 | 更多详情 | FeatureTable |
方法详细信息
-
用于为微件的
class属性构建值的实用程序方法。这有助于简化 CSS 类设置。参数：repeatable 类名称
返回：类型 说明 String 计算的类名。 - 另请参阅：
示例：// .tsx syntax showing how to set CSS classes while rendering the widget render() { const dynamicIconClasses = { [CSS.myIcon]: this.showIcon, [CSS.greyIcon]: !this.showIcon }; return ( <div class={classes(CSS.root, CSS.mixin, dynamicIconClasses)} /> ); }
-
clearHighlights()起始版本：GeoScene API for JavaScript 4.16
-
这将清除所有突出显示的要素。请注意，不会取消选择关联的行。
-
clearSelection()起始版本：GeoScene API for JavaScript 4.16
-
清除表中的当前选定内容。
-
clearSelectionFilter()起始版本：GeoScene API for JavaScript 4.23
-
清除表中的当前选择过滤器。
-
deselectRows(params)起始版本：GeoScene API for JavaScript 4.16
-
取消选择表中的指定行。
参数：要在要素表中取消选择的选择参数。
-
destroy()inherited
-
销毁微件实例。
-
在实例上发出事件。仅当创建此类的子类时，才应使用此方法。
参数：type String事件的名称。
event Objectoptional事件负载。
返回：类型 说明 Boolean true如果听取了侦听者的通知
-
filterBySelection()起始版本：GeoScene API for JavaScript 4.16
-
按当前选择过滤表。
-
findColumn(fieldName){FieldColumn}起始版本：GeoScene API for JavaScript 4.16
-
在要素表中查找指定的列。
参数：fieldName String要查找的列的
fieldName。返回：类型 说明 FieldColumn 表中返回的列。
-
hideColumn(fieldName)起始版本：GeoScene API for JavaScript 4.16
-
在要素表中隐藏指定的列。
参数：fieldName String要隐藏的列的
fieldName。
-
起始版本：GeoScene API for JavaScript 4.19
-
isFulfilled()可用于验证是否满足类的创建实例（已解决或已拒绝）。如果已完成，将返回true。返回：类型 说明 Boolean 指示是否已完成创建类的实例（已解决或已拒绝）。
-
起始版本：GeoScene API for JavaScript 4.19
-
isRejected()可用于验证创建类的实例是否被拒绝。如果被拒绝，将返回true。返回：类型 说明 Boolean 指示创建类的实例是否已被拒绝。
-
起始版本：GeoScene API for JavaScript 4.19
-
isResolved()可用于验证是否解析了类的创建实例。如果被解析，将返回true。返回：类型 说明 Boolean 指示是否已解析创建类的实例。
-
在实例上注册事件处理程序。调用此方法将事件与侦听器挂钩。
参数：要侦听的事件或事件数组。
listener Function事件激发时要调用的函数。
返回：类型 说明 Object 返回具有 remove()方法的事件处理程序，应调用该方法以停止侦听事件。属性 类型 说明 remove 函数 调用时，从事件中删除侦听器。 示例：view.on("click", function(event){ // event is the event handle returned after the event fires. console.log(event.mapPoint); });
-
own(handles)inherited
-
微件拆解助手。当微件被销毁时，添加到其中的任何句柄都将自动删除。
参数：handles WatchHandle|WatchHandle[]在微件被销毁后标记为删除的句柄。
-
postInitialize()inherited
-
此方法主要由开发人员在实现自定义微件时使用。在微件准备好进行渲染后执行。
-
refresh()起始版本：GeoScene API for JavaScript 4.16
-
刷新表格内容，同时保持当前滚动位置。
-
此方法主要由开发人员在实现自定义微件时使用。它必须由子类实现以进行渲染。
返回：类型 说明 Object 渲染的虚拟节点。
-
renderNow()inherited
-
立即将微件渲染给 DOM。
-
scheduleRender()inherited
-
此方法主要由开发人员在实现自定义微件时使用。计划微件渲染。此方法对于影响 UI 的更改很有用。
-
scrollToIndex()起始版本：GeoScene API for JavaScript 4.19
-
根据指定的索引将表滚动到一行。
-
selectRows(params)起始版本：GeoScene API for JavaScript 4.16
-
选择表中的指定行。
参数：要在要素表中选择的选择参数。
-
showAllColumns()起始版本：GeoScene API for JavaScript 4.16
-
显示表中的所有列。
-
showColumn(fieldName)起始版本：GeoScene API for JavaScript 4.16
-
显示要素表中的指定列。
参数：fieldName String要显示的列的
fieldName。
-
sortColumn(path, direction)起始版本：GeoScene API for JavaScript 4.16
-
按升序 （“asc”） 或降序 （“desc”） 对列进行排序。
参数：path String要排序的指定字段名。
direction String排序的方向。
可能的值："asc"|"desc"
-
起始版本：GeoScene API for JavaScript 4.19
-
when()可以在创建类的实例后利用。此方法采用两个输入参数：callback函数和errback函数。在类的实例加载时执行callback。如果类的实例无法加载，则执行errback。参数：callback Functionoptional解析 promise 时要调用的函数。
errback Functionoptionalpromise 失败时要执行的函数。
返回：类型 说明 Promise 返回回调结果的新 promise， callback结果可用于链接其他函数。示例：// Although this example uses the BasemapGallery widget, any class instance that is a promise may use when() in the same way let bmGallery = new BasemapGallery(); bmGallery.when(function(){ // This function will execute once the promise is resolved }, function(error){ // This function will execute if the promise is rejected due to an error });
-
zoomToSelection()起始版本：GeoScene API for JavaScript 4.23
-
将视图缩放至当前行选择的范围。这也可以作为表中的菜单项触发。如果至少选择了一行并且在
FeatureTable上设置了视图，则将显示此项目。
类型定义
-
ButtonMenuConfig
-
通过 menuConfig 属性自定义要素表或列菜单的可配置选项。
- 属性：
-
optionalcontainer HTMLElement
包含菜单的 DOM 元素。
optionaliconClass Boolean将 CSS 类添加到菜单按钮的 DOM 节点。
optionalitems ButtonMenuItem[]ButtonMenuItems 的数组。
optionalopen Boolean指示菜单内容是否可见。默认为
false。optionalviewModel ButtonMenuViewModelButtonMenu 的关联 viewModel。
- 另请参阅：
-
ButtonMenuItemConfig
-
通过 menuConfig 项目属性自定义要素表或列菜单的可配置选项。
- 属性：
-
optionalautoCloseMenu Boolean
指示是否自动关闭菜单项。
optionalclickFunction ButtonMenuItemClickFunction在 ButtonMenuItem 的
click事件上执行的函数。optionaliconClass String将 CSS 类添加到菜单按钮的 DOM 节点。
optionalitems ButtonMenuItem[]单个菜单项的数组。
optionallabel String菜单项的标注。这可以与 iconClass 属性结合使用。
optionalopen Boolean指示菜单内容是否可见。
optionalselectionEnabled Boolean指示是否应将切换状态应用于各个菜单项。
optionalselected Boolean指示是否选择了菜单项。
- 另请参阅：
-
VisibleElements
-
显示在微件中的可见元素。这提供了打开/关闭微件显示的各个元素的能力。
- 属性：
-
optionalheader Boolean
指示是否显示要素表的标题信息。默认值为
true。optionalmenu Boolean指示是否显示要素表的菜单。默认值为
true。默认值为true。optionalselectionColumn Boolean指示是否在表中显示选择列。每行都有一个复选框，用于选择其相应的要素。默认值为
true。optionalcolumnMenus Boolean（自 4.23 起）指示是否在各个列中显示菜单项。默认值为
true。optionalmenuItems Object要素表菜单中的菜单项。
- 规范：
-
optionalclearSelection Boolean
指示是否显示
Clear selection菜单项。默认值为true。optionalrefreshData Boolean指示是否显示
Refresh data菜单项。默认值为true。optionalselectedRecordsShowAllToggle Boolean_（自4.23起）指示是否从仅显示表中的选定记录切换到显示所有记录。默认值为
true。optionalshowSelectedToggle Boolean（自 4.23 起）指示是否显示
Show selected records菜单项。默认值为true。仅当在表中选择了记录时，才会显示此选项。optionaltoggleColumns toggleColumns指示是否在菜单中启用切换列可见性。默认值为
true。optionalzoomToSelection zoomToSelection（自 4.23 起）指示是否显示
Zoom to selected菜单项。默认值为true。
事件概述
| 名称 | 类型 | 描述 | 类： | |
|---|---|---|---|---|
{added: Object[],added.feature: Graphic,added.attachments: AttachmentInfo[],added.relatedRecords: Graphic[],removed: Object[],removed.feature: Graphic,removed.attachments: AttachmentInfo[],removed.relatedRecords: Graphic[]} |
更多详情 在 FeatureTable 中添加和/或删除行选择时激发。 |
更多详情 | FeatureTable |
事件详细信息
-
selection-change
-
在 FeatureTable 中添加和/或删除行选择时激发。
- 属性：
-
包含添加到表选择中的行（要素）数据的对象数组。
- 规范：
-
feature Graphic
添加到要素表选择中的关联行（要素）。
attachments AttachmentInfo[]如果适用，则将与添加到要素表选择中的行（要素）关联的 AttachmentInfo 数组。
（当前未实现）。如果适用，则将与行（要素）关联的相关要素数组添加到要素表选择中。
包含表选择中移除的行（要素）数据的对象数组。
- 规范：
-
feature Graphic
从要素表选择中移除的关联行（要素）。
attachments AttachmentInfo[]如果适用，则为与从要素表选择中移除的行（要素）关联的 AttachmentInfo 数组。
（当前未实现）。如果适用，则从要素表选择中移除与行（要素）关联的相关要素数组。
- 另请参阅：
示例：// This function will fire each time a row (feature) is either added // or removed from the feature table's selection featureTable.on("selection-change", (event) => { let addedRows = event.added; // An array of features added to the selection let removedRows = event.removed; // An array of features removed from the selection });