属性概述
属性详细信息
-
-
操作或操作切换对象的集合。可通过单击微件中符号化的图标或图像来执行的每个操作。默认情况下,每个弹出窗口和 Features 微件都有一个
zoom-to
操作,并带有一个放大镜图标。单击此图标时,视图将放大四个 LOD,并以所选要素为中心。
通过将 includeDefaultActions 设置为
false
,或在 PopupTemplate 中将 overwriteActions 属性设置为true
时,可以从默认的微件操作中移除此操作。微件中每个操作的顺序是它们在操作集合中的显示顺序。每次单击微件中的操作时,都会触发 trigger-action 事件。应使用此事件为单击的每个操作执行自定义代码。例如,如果要向微件添加一个
zoom-out
操作以将视图缩小多个 LOD,则可以在单独的函数中定义缩小代码。然后,您将在 trigger-action 事件处理程序中调用自定义zoom-out
函数。有关其工作原理的更多详细信息,请参阅以下示例代码段。操作是使用 ActionButton 或 ActionToggle 类中列出的属性定义的。
示例// Defines an action to zoom out from the selected feature let zoomOutAction = { // This text is displayed as a tooltip title: "Zoom out", // The ID by which to reference the action in the event handler id: "zoom-out", // Sets the icon font used to style the action button className: "geoscene-icon-zoom-out-magnifying-glass" }; // Adds the custom action to the popup. view.popup.viewModel.actions.push(zoomOutAction); // The function to execute when the zoom-out action is clicked function zoomOut() { // Zoom out two levels (LODs) view.goTo({ center: view.center, zoom: view.zoom - 2 }); } // This event fires for each click on any action view.popup.viewModel.on("trigger-action", function(event){ // If the zoom-out action is clicked, fire the zoomOut() function if(event.action.id === "zoom-out"){ zoomOut(); } });
-
指示微件在可见且未等待结果时是否处于活动状态。
- 另请参阅
-
- 默认值:false
-
指示“浏览要素”体验是否在聚类弹出窗口中处于活动状态。当用户使用“浏览要素”聚类微件操作启用要素浏览时,此值将变为
true
。当视图比例更改、微件关闭或用户禁用“浏览要素”操作时,该值将变为false
。仅当 selectedFeature 是聚合图形并表示聚类时,才应以编程方式设置此选项。- 默认值:false
示例// open the browse features experience for a cluster graphic view.popup.viewModel.browseClusterEnabled = view.popup.viewModel.selectedFeature?.isAggregate;
-
-
微件的内容。直接在微件中设置时,此内容可能只是静态的,不能使用字段来设置内容模板。要基于字段或属性名称为内容设置模板,请参阅 PopupTemplate.content。
- 另请参阅
示例// This sets generic instructions in the popup that will always be displayed // unless it is overridden by a PopupTemplate view.popup.viewModel.content = "Click a feature on the map to view its attributes";
-
类的名称。声明的类名称格式化为
geoscene.folder.className
。
-
-
只读属性,指示微件中操作按钮或切换的集合。默认情况下,每个 Popup 和 Features 微件均具有一个“缩放至”操作,这允许用户缩放到所选要素。
要禁用任何默认操作,必须将 includeDefaultActions 设置为
false
。
-
允许为已启用弹出窗口但未定义 popupTemplate 的图层自动创建弹出窗口模板。支持
createPopupTemplate
方法的图层支持自动弹出窗口模板。(支持 FeatureLayer、GeoJSONLayer、OGCFeatureLayer、SceneLayer、CSVLayer、PointCloudLayer、StreamLayer 和 ImageryLayer)。- 默认值:false
-
微件可用的所选要素的数量。
- 默认值:0
-
与微件相关联的要素数组。此数组中的每个图形都必须具有有效的 PopupTemplate 集。它们可能共享相同的 PopupTemplate 或具有唯一的 PopupTemplates,具体取决于其属性。微件的内容和标题是根据每个图形各自的 PopupTemplate 的
content
和title
属性设置的。当此数组中存在多个图形时,将根据所选要素的值设置弹出窗口的当前内容。
如果没有与弹出窗口相关联的要素,则此值为
null
。示例// When setting the features property, the graphics pushed to this property // must have a PopupTemplate set. let g1 = new Graphic(); g1.popupTemplate = new PopupTemplate({ title: "Results title", content: "Results: {ATTRIBUTE_NAME}" }); // Set the graphics as an array to the popup instance. The content and title of // the popup will be set depending on the PopupTemplate of the graphics. // Each graphic may share the same PopupTemplate or have a unique PopupTemplate let graphics = [g1, g2, g3, g4, g5]; view.popup.viewModel.features = graphics;
-
一次要获取的要素数。
- 默认值:20
-
定义微件在查询和显示其内容时应使用的特定功能。
-
goToOverride GoToOverride inherited
-
此函数提供了覆盖 MapView goTo() 或 SceneView goTo() 方法的能力。
示例// The following snippet uses the Search widget but can be applied to any // widgets that support the goToOverride property. search.goToOverride = function(view, goToParams) { goToParams.options.duration = updatedDuration; return view.goTo(goToParams.target, goToParams.options); };
-
使用 MapView 上设置的 highlightOptions 或 SceneView 上设置的 highlightOptions 来高亮显示选定的要素。
- 默认值:true
-
指示是否在微件的 UI 中包含 defaultActions。
要禁用任何默认操作,必须将 includeDefaultActions 设置为
false
。- 默认值:true
示例// Removes the default actions from the popup view.popup.viewModel.includeDefaultActions = false;
-
尚待解析的 promises 数量。
- 默认值:0
- 另请参阅
-
微件可用的所选 promises 的数量。
- 默认值:0
-
尚未完成的一系列待定 Promises。如果没有待处理的 Promises,则值为
null
。解析待处理的 Promises 后,它们将从此数组中移除,并且其返回的要素将推送到要素数组中。
-
此图形用于表示当
Browse features
操作在聚类弹出窗口中处于活动状态时的聚类范围。仅当在 FeatureReductionCluster 实例上设置了 PopupTemplate 时,才适用。使用此属性可覆盖所显示聚类范围的默认符号。- 另请参阅
示例view.popup.viewModel.selectedClusterBoundaryFeature.symbol.outline.color = "yellow"
view.popup.viewModel.selectedClusterBoundaryFeature.symbol = { type: "simple-fill", style: "diagonal-cross", color: "green", outline: { width: 3, color: "green" } }
-
微件访问的所选要素。微件的内容是根据分配给此要素的 PopupTemplate 确定的。
-
视图模型的状态。
可能的值:"ready"|"disabled"
- 默认值:disabled
-
微件的标题。无论选择何种要素,都可将其设置为任何字符串值。如果所选要素具有 PopupTemplate,则在此处使用相应模板中设置的标题。
示例// This title will display in the popup unless a selected feature's // PopupTemplate overrides it view.popup.viewModel.title = "Population by zip codes in Southern California";
-
与微件实例关联的视图。
-
指示微件是否可见。
- 默认值:false
方法概述
名称 | 返回值类值 | 描述 | 类 |
---|---|---|---|
添加一个或多个与对象生命周期相关联的句柄 更多详情 | Accessor | ||
从微件中移除 promises、features、content、title 和 location。 更多详情 | PopupViewModel | ||
Promise<FetchPopupFeaturesResult> | 使用此方法可在给定屏幕位置返回要素。 更多详情 | PopupViewModel | |
Boolean | 如果存在指定的句柄组,则返回 true。 更多详情 | Accessor | |
PopupViewModel | 在下一个索引处选取与所选要素相关的要素。 更多详情 | PopupViewModel | |
Object | 在实例上注册事件处理程序。 更多详情 | PopupViewModel | |
在给定位置处打开微件,其中包含使用 | PopupViewModel | ||
PopupViewModel | 在上一个索引处选取与所选要素相关的要素。 更多详情 | PopupViewModel | |
移除对象拥有的句柄组。 更多详情 | Accessor | ||
触发 trigger-action 事件,并在操作数组中的指定索引处执行操作。 更多详情 | PopupViewModel |
方法详细说明
-
addHandles(handleOrHandles, groupKey)inherited
-
添加一个或多个与对象的生命周期相关联的句柄。当对象被销毁时,将移除句柄。
// Manually manage handles const handle = reactiveUtils.when( () => !view.updating, () => { wkidSelect.disabled = false; }, { once: true } ); this.addHandles(handle); // Destroy the object this.destroy();
参数handleOrHandles WatchHandle|WatchHandle[]对象销毁后,标记为要移除的句柄。
groupKey *optional标识句柄应添加到的组的键。组中的所有句柄稍后都可使用 Accessor.removeHandles() 进行删除。如果未提供键,则句柄将被添加到默认组。
-
clear()inherited
-
-
-
使用此方法可在给定屏幕位置返回要素。这些要素是从视图中的所有 LayerViews 中获取的。要使用此函数,图层必须具有关联的 PopupTemplate 及其 popupEnabled。然后,可以在自定义 Popup、Features 或 Feature 微件体验中使用这些要素。一个示例可能是自定义侧面板,该侧面板根据最终用户的单击位置显示特定于要素的信息。此方法允许开发人员控制如何处理输入位置,然后控制如何处理结果。
参数screenPoint Object表示屏幕上一个点的对象。此点可位于 MapView 或 SceneView 中。
规范x Numberx 坐标。
y Numbery 坐标。
options FetchFeaturesOptionsoptional要传递到
fetchFeatures
方法中的选项。返回类型 描述 Promise<FetchPopupFeaturesResult> 使用所选的 hitTest
位置进行解析。此外,如果直接在视图上执行hitTest
,它还返回图形数组、包含所有结果图形数组的单个 Promise 或包含此结果图形数组及其关联 layerview 的对象数组。最常见的情形是,如果访问所有要素,请使用结果的 allGraphicsPromise 中返回的单个 promise,并调用.then()
,如示例代码段中所示。示例// Add Feature widget to UI view.ui.add(featureWidget, "top-right"); // Get view's click event view.on("click", function(event) { // Call fetchFeatures and pass in the click event screenPoint view.popup.fetchFeatures(event.screenPoint).then(function(response) { // Access the response from fetchFeatures response.allGraphicsPromise.then(function(graphics) { // Set the feature widget's graphic to the returned graphic from fetchFeatures featureWidget.graphic = graphics[0]; }); }); });
-
如果存在指定的句柄组,则返回 true。
参数groupKey *optional组键。
返回类型 描述 Boolean 如果存在指定的句柄组,则返回 true
。示例// Remove a named group of handles if they exist. if (obj.hasHandles("watch-view-updates")) { obj.removeHandles("watch-view-updates"); }
-
-
在下一个索引处选取与所选要素相关的要素。
返回类型 描述 PopupViewModel 返回弹出窗口视图模型的实例。 - 另请参阅
-
在实例上注册事件处理程序。调用此方法将事件与监听器挂钩。
参数要监听的事件或事件数组。
listener Function事件触发时要调用的函数。
返回类型 描述 Object 返回一个具有 remove()
方法的事件处理程序,应该调用该方法以停止监听事件。属性 类型 描述 remove Function 当调用时,将从事件中移除该监听器。 示例view.on("click", function(event){ // event is the event handle returned after the event fires. console.log(event.mapPoint); });
-
open(options)inherited
-
在给定位置处打开微件,其中包含使用
content
明确定义的内容或由输入要素的 PopupTemplate 驱动的内容。此方法可将微件的 visible 属性设置为true
。或者,用户也可通过将 visible 属性直接设置为true
来打开微件。如果使用 Popup 微件,仅当满足 dockOptions 中的视图大小约束或 location 属性设置为几何时,才会显示该微件。参数规范options Objectoptional定义弹出窗口打开时的位置和内容。
规范title Stringoptional设置弹出窗口的标题。
content Stringoptional设置弹出窗口的内容。
fetchFeatures Booleanoptional默认值: false起始版本:4.12
当为
true
时,表示弹出窗口应获取此要素的内容并显示它。如果不存在 PopupTemplate,则在 defaultPopupTemplateEnabled =true
的情况下,将为图层创建一个默认模板。为了使此选项可用,必须有一个有效的view
和location
设置。location Geometryoptional设置弹出窗口的位置,即用于定位弹出窗口的几何。
optional 设置弹出窗口的要素,这些要素根据每个图形的 PopupTemplate 填充弹出窗口的标题和内容。
optional 在弹出窗口中设置待处理的 promises。promises 解决后,将显示弹出窗口。每个 promise 必须解析为一组图形。允许用户滚动查询返回的要素列表,并选择要在弹出窗口中显示的选择。
updateLocationEnabled Booleanoptional默认值: false当为
true
时,指示弹出窗口应根据所选要素的几何更新每个分页要素的位置。当为
true
时,指示只显示弹出窗口标题。示例view.on("click", function(event){ view.popup.open({ location: event.mapPoint, // location of the click on the view title: "You clicked here", // title displayed in the popup content: "This is a point of interest" // content displayed in the popup }); });
view.on("click", function(event){ view.popup.open({ location: event.mapPoint, // location of the click on the view fetchFeatures: true // display the content for the selected feature if a popupTemplate is defined. }); });
view.popup.open({ title: "You clicked here", // title displayed in the popup content: "This is a point of interest", // content displayed in the popup updateLocationEnabled: true // updates the location of popup based on // selected feature's geometry });
view.popup.open({ features: graphics, // array of graphics });
-
-
在上一个索引处选取与所选要素相关的要素。
返回类型 描述 PopupViewModel 返回弹出窗口视图模型的实例。 - 另请参阅
-
removeHandles(groupKey)inherited
-
移除对象拥有的句柄组。
参数groupKey *optional要移除的组键或组键的数组或集合。
示例obj.removeHandles(); // removes handles from default group obj.removeHandles("handle-group"); obj.removeHandles("other-handle-group");
-
triggerAction(actionIndex)inherited
-
触发 trigger-action 事件,并在操作数组中的指定索引处执行操作。
参数actionIndex Number要执行的 action 的索引。
事件概述
名称 | 类型 | 描述 | 类 |
---|---|---|---|
{action: ActionButton|ActionToggle} | 更多详情 | PopupViewModel |
事件详细说明
-
trigger-actioninherited
-
- 属性
-
action ActionButton|ActionToggle
用户单击的操作。有关此对象的说明及其属性的规范,请参阅此类的 actions 属性。
- 另请参阅
示例// Defines an action to zoom out from the selected feature let zoomOutAction = { // This text is displayed as a tooltip title: "Zoom out", // The ID used to reference this action in the event handler id: "zoom-out", // Sets the icon font used to style the action button className: "geoscene-icon-zoom-out-magnifying-glass" }; // Adds the custom action to the popup. view.popup.viewModel.actions.push(zoomOutAction); // Fires each time an action is clicked view.popup.viewModel.on("trigger-action", function(event){ // If the zoom-out action is clicked, then execute the following code if(event.action.id === "zoom-out"){ // The view zooms out two LODs on each click view.goTo({ center: view.center, zoom: view.zoom - 2 }); } });