Editor

AMD: require(["geoscene/widgets/Editor"], (Editor) => { /* code goes here */ });
ESM: import Editor from "@geoscene/core/widgets/Editor";
类: geoscene/widgets/Editor
继承于:Editor Widget Accessor
起始版本:GeoScene API for JavaScript 4.11

此微件提供开箱即用的编辑体验,以帮助简化 Web 应用程序中的编辑体验。它会自动识别地图中是否有可编辑的要素图层。如果它识别出它们是可编辑的,则微件可以使用这些层。此外,还可以通过设置其 layerInfos 属性来配置 Editor 的行为方式。此属性采用一组配置对象,允许您配置这些层的编辑体验。

该微件根据所需的功能具有不同的工作流,将在下面讨论。

  • CreateWorkflow (自 4.23 起已弃用)- 此工作流程主要设计用于针对单个功能创建的现有自定义工作流程。这个工作流程最终将被删除,取而代之的是,
  • CreateFeaturesWorkflow (4.23 中的新功能)- 此工作流程允许同时创建单独的和连续的特征。
  • UpdateWorkflow - 此工作流允许您更新和/或删除可编辑要素图层中的现有要素。

从 4.23 版开始,Editor 微件经历了一些重大更新,包括其 UI 和底层 API。这些更新只是编辑器路线图上的一些改进。随着未来版本的发布,预计会看到更多更新。其中一些更新包括:

  • 初始编辑器对话框已被删除并更新为包含一个整合创建更新工作流程的初始面板。
  • 添加了一个额外的创建要素工作流以包括连续编辑。现在可以一次连续创建多个相同类型的要素。创建初始草图后,实体形式将与指定的字段元素一起显示。这些字段可以在用户创建新要素时更新。现有的创建工作流仍然有效,但已被标记为 deprecated,以支持使用创建要素工作流。这个新的工作流程是为单个和多个要素创建而设计的。
  • 捕捉自动包含在微件的 UI 中。不再需要通过将编辑器的 snappingOptions 传递给 SnappingControls 的实例来专门设置它。 默认情况下,捕捉被禁用。切换“启用捕捉”以启用它。默认情况下,几何约束和要素到要素捕捉均处于启用状态。几何约束允许编辑器指定他们希望如何绘制几何图形。例如,如果需要线完全成直角,则捕捉指示器会显示为这样,并且可以适当地创建顶点。要素到要素捕捉允许将新几何或现有几何捕捉到其他图层中的几何,如 Snapping layer 列表中所示,或与当前正在编辑的图层中的几何。 默认情况下,所有可配置为捕捉的图层都会自动添加到此列表中。如果需要更新,请通过直接设置 FeatureSnappingLayerSource 来更新编辑器的 snappingOptions

已知限制

Editor 微件尚未与 3.x Editor 微件中提供的要素完全等同。例如,目前不支持编辑相关的要素属性。

editor

有关获得对微件样式的完全控制的信息,请参阅 Styling 主题。
另请参阅:
示例:
// At the very minimum, set the Editor's view
const editor = new Editor({
  view: view
});

view.ui.add(editor, "top-right");

构造函数

new Editor(properties)
参数:
properties Object
可选

有关可能传递给构造函数的所有属性的列表,请参见属性

示例:
// Typical usage for Editor widget. Be default, this will recognize all editable layers in the map if no specific layers are set.
const editor = new Editor({
  view: view
});

属性概览

可以设置、检索或收听任何属性。请参阅使用属性主题。
显示继承的属性 隐藏继承的属性
名称 类型 描述
CreateWorkflow|CreateFeaturesWorkflow|UpdateWorkflow更多信息

指示当前活动工作流的属性。

更多信息Editor
String更多信息

一个字符串值数组,指定允许最终用户编辑的内容。

更多信息Editor
String|HTMLElement更多信息

表示包含微件的 DOM 元素的 ID 或节点。

更多信息Widget
String更多信息

类的名称。

更多信息Accessor
Number更多信息

指示用于微件标题的标题级别。

更多信息Editor
String更多信息

微件的默认 CSS 图标类。

更多信息Editor
String更多信息

创建微件时分配给微件的唯一 ID。

更多信息Widget
String更多信息

微件的默认标签。

更多信息Editor
LayerInfo[]更多信息

单个图层的一组编辑配置。

更多信息Editor
SnappingOptions更多信息

用于编辑的 SnappingOptions

更多信息Editor
SupportingWidgetDefaults更多信息

此属性允许自定义支持的 Editor 微件及其默认行为。

更多信息Editor
Boolean更多信息

指示编辑器是否应默认使用已弃用的 CreateWorkflow

更多信息Editor
MapView|SceneView更多信息

MapViewSceneView 的引用。

更多信息Editor
EditorViewModel更多信息

此微件的视图模型。

更多信息Editor
Boolean更多信息

指示微件是否可见。

更多信息Widget

属性详情

指示当前活动工作流的属性。这是 CreateFeaturesWorkflowUpdateWorkflow。如果 useDeprecatedCreateWorkflowtrue,则此属性类型反映已弃用的 CreateWorkflow

allowedWorkflows String

一个字符串值数组,指定允许最终用户编辑的内容。例如,具有完全编辑权限的要素图层可能可用。 但是您可能只希望最终用户能够更新现有要素。将 allowedWorkflows 设置为仅 update

可能的值 说明
create 这允许最终用户在要素服务中创建新的单个要素。(自 4.23 起已弃用,使用如下所述的 create-features。)
create-features 这允许最终用户在要素服务中创建单独的或连续的要素。(自 4.23 开始)
update 这允许最终用户更新和/或删除要素服务中的要素。

仅当要素服务允许这些操作时,才会启用这些工作流。

可能的值:"create-features"|"create"|"update"

另请参阅:
示例:
const editor = new Editor({
  view: view,
  allowedWorkflows: ["update"] // allows only updates and no adds
});

表示包含微件的 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"
});
declaredClass Stringreadonly inherited

类的名称。声明的类名格式为 geoscene.folder.className

headingLevel Number
起始版本:GeoScene API for JavaScript 4.20

指示用于微件标题的标题级别。默认情况下,标题呈现为 4 级标题(例如 <h4>Editor</h4>)。 根据微件在您的应用中的位置,您可能需要调整此标题以获得正确的语义。这对于满足可访问性标准很重要。

默认值:4
另请参阅:
示例:
// "Editor" will render as an <h3>
editor.headingLevel = 3;
iconClass Stringreadonly

微件的默认 CSS 图标类。

创建微件时分配给微件的唯一 ID。如果开发人员未设置,则默认为容器 ID,如果不存在,则会自动生成。

label String

微件的默认标签。

layerInfos LayerInfo[]

单个图层的一组编辑配置。

如果您有一个可编辑的要素图层,但不希望最终用户进行任何类型的编辑,您可以通过将 enabled 属性设置为 false 来限制这一点。

另请参阅:
示例:
const editor = new Editor({
  layerInfos: [{
    view: view,
    layer: featureLayer, // pass in the feature layer,
    formTemplate:  { // autocastable to FormTemplate
      elements: [
        { // autocastable to FieldElement
          type: "field",
          fieldName: "fulladdr",
          label: "Full Address"
        }
      ]
    },
    enabled: true, // default is true, set to false to disable editing functionality
    addEnabled: true, // default is true, set to false to disable the ability to add a new feature
    updateEnabled: false // default is true, set to false to disable the ability to edit an existing feature
    deleteEnabled: false // default is true, set to false to disable the ability to delete features
  }]
});
snappingOptions SnappingOptionsautocast
起始版本:GeoScene API for JavaScript 4.19

用于编辑的 SnappingOptions。支持自捕捉和要素捕捉。从版本 4.23 开始,SnappingControls UI 自动集成到 Editor 微件中。如果需要对默认 UI 中提供的内容进行修改,请修改 snappingOptions

另请参阅:
示例:
// Creates the Editor with SnappingOptions with no snapping UI
const editor = new Editor({
  view: view,
  snappingOptions: { // autocasts to SnappingOptions()
    enabled: true,
    featureSources: [{layer: streetsLayer}] // autocasts to FeatureSnappingLayerSource()
  }
});
// Creates the Editor with SnappingControls widget
const editor = new Editor({
  view: view
});

const snappingControls = new SnappingControls({
  view: view,
  snappingOptions: editor.snappingOptions
});

// Add the widgets to the view
view.ui.add(editor, "top-right");
view.ui.add(snappingControls, "top-left");
supportingWidgetDefaults SupportingWidgetDefaults

此属性允许自定义支持的 Editor 微件及其默认行为。这些微件包括 FeatureFormFeatureTemplatesSketchViewModel

此属性对于默认微件的基本覆盖很有用。 Editor 可以对这些被覆盖的属性执行的操作可能存在一些限制。例如,无论在此属性中设置什么,编辑器都会禁用 Sketch.defaultUpdateOptions 中的 multipleSelectionEnabled 属性。

另请参阅:
useDeprecatedCreateWorkflow Boolean
起始版本:GeoScene API for JavaScript 4.23
已弃用从 4.23 版开始。尽管在 4.23 中是新的,但引入此属性是为了帮助从旧版 CreateWorkflow 迁移到更新后的 CreateFeaturesWorkflow。完全删除 CreateWorkflow 后,将不再需要此属性。

指示编辑器是否应默认使用已弃用的 CreateWorkflow。默认情况下,Editor 允许使用 CreateFeaturesWorkflow 在一个工作流中创建多个要素。如果需要恢复到已弃用的单一功能创建工作流,请将其设置为 true

默认值:false
另请参阅:

MapViewSceneView 的引用。此视图为 Editor 微件提供可编辑层。

此微件的视图模型。这是一个包含控制此微件行为的所有逻辑(属性和方法)的类。请参阅 EditorViewModel 类以访问微件上的所有属性和方法。

指示微件是否可见。

如果为 false,则该微件将不再呈现在 Web 文档中。这可能会影响文档中其他元素或微件的布局。例如,如果此微件是与视图 UI 右上角关联的三个微件中的第一个,则当此微件不可见时,其他微件将重新定位。有关详细信息,请参阅 "none" 的 CSS display 值。

默认值:true
示例:
// Hides the widget in the view
widget.visible = false;

方法概览

显示继承的方法 隐藏继承的方法
名称 返回类型 描述
Promise<void>更多信息

取消任何活动的工作流程。

更多信息Editor
String更多信息

用于构建微件 class 属性值的实用方法。

更多信息Widget
Promise<void>更多信息

如果存在活动的 UpdateWorkflow,这适用。

更多信息Editor
更多信息

注销微件实例。

更多信息Widget
Boolean更多信息

在实例上发出事件。

更多信息Widget
Boolean更多信息

指示实例上是否存在与提供的事件名称匹配的事件侦听器。

更多信息Widget
Boolean更多信息

isFulfilled() 可用于验证创建类的实例是否已完成(已解决或已拒绝)。

更多信息Widget
Boolean更多信息

isRejected() 可用于验证创建类的实例是否被拒绝。

更多信息Widget
Boolean更多信息

isResolved() 可用于验证创建类的实例是否已解决。

更多信息Widget
Object更多信息

在实例上注册事件处理程序。

更多信息Widget
更多信息

微件拆卸助手。

更多信息Widget
更多信息

此方法主要由开发人员在实现自定义微件时使用。

更多信息Widget
Object更多信息

此方法主要由开发人员在实现自定义微件时使用。

更多信息Widget
更多信息

立即将微件呈现给 DOM。

更多信息Widget
更多信息

此方法主要由开发人员在实现自定义微件时使用。

更多信息Widget
Promise<void>更多信息

通过显示开始创建特征的面板来启动 CreateFeaturesWorkflow

更多信息Editor
Promise<void>更多信息

通过显示 FeatureTemplates 面板来启动 CreateFeaturesWorkflow

更多信息Editor
Promise<void>更多信息

通过显示开始创建特征的面板来启动 CreateFeaturesWorkflow

更多信息Editor
Promise<void>更多信息

此方法启动 CreateWorkflow,等待选择多个要素。

更多信息Editor
Promise<void>更多信息

通过显示 FeatureTemplates 面板来启动 CreateWorkflow

更多信息Editor
Promise<void>更多信息

在属性编辑面板上启动 UpdateWorkflow

更多信息Editor
Promise<void>更多信息

使用当前选定的功能启动 UpdateWorkflow

更多信息Editor
Promise<void>更多信息

此方法启动 UpdateWorkflow,等待选择多个功能。

更多信息Editor
Promise更多信息

when() 一旦创建了类的实例,就可以利用它。

更多信息Widget

方法详情

cancelWorkflow(){Promise<void>}

取消任何活动的工作流程。

返回:
类型 说明
Promise<void> 取消工作流后解决。
classes(classNames){String}inherited

用于构建微件 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)} />
  );
}
deleteFeatureFromWorkflow(){Promise<void>}

如果存在活动的 UpdateWorkflow,这适用。如果是这样,此方法将删除工作流功能。

返回:
类型 说明
Promise<void> 删除活动的 UpdateWorkflow 后解决。
另请参阅:
destroy()inherited

注销微件实例。

emit(type, event){Boolean}inherited

在实例上发出事件。此方法仅应在创建此类的子类时使用。

参数:
type String

事件的名称。

event Object
optional

事件有效负载。

返回:
类型 说明
Boolean true if a listener was notified
hasEventListener(type){Boolean}inherited

指示实例上是否存在与提供的事件名称匹配的事件侦听器。

参数:
type String

事件的名称。

返回:
类型 说明
Boolean 如果类支持输入事件,则返回 true。
isFulfilled(){Boolean}inherited
起始版本:GeoScene API for JavaScript 4.19

isFulfilled() 可用于验证创建类的实例是否已完成(已解决或已拒绝)。如果满足,则返回 true

返回:
类型 说明
Boolean 指示创建类的实例是否已完成(已解决或已拒绝)。
isRejected(){Boolean}inherited
起始版本:GeoScene API for JavaScript 4.19

isRejected() 可用于验证创建类的实例是否被拒绝。如果被拒绝,则返回 true

返回:
类型 说明
Boolean 指示创建类的实例是否已被拒绝。
isResolved(){Boolean}inherited
起始版本:GeoScene API for JavaScript 4.19

isResolved() 可用于验证创建类的实例是否已解决。如果已解决,将返回 true

返回:
类型 说明
Boolean 指示创建类的实例是否已解决。
on(type, listener){Object}inherited

在实例上注册事件处理程序。调用此方法以将事件与侦听器挂钩。

参数:

要侦听的事件或事件数组。

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);
});
own(handles)inherited

微件拆卸助手。当微件被销毁时,添加到它的任何句柄都将被自动删除。

参数:

微件销毁后标记为删除的句柄。

postInitialize()inherited

此方法主要由开发人员在实现自定义微件时使用。在微件准备好渲染后执行。

render(){Object}inherited

此方法主要由开发人员在实现自定义微件时使用。它必须由子类实现以进行渲染。

返回:
类型 说明
Object 渲染的虚拟节点。
renderNow()inherited

立即将微件呈现给 DOM。

scheduleRender()inherited

此方法主要由开发人员在实现自定义微件时使用。安排微件渲染。此方法对于影响 UI 的更改很有用。

startCreateFeaturesWorkflowAtFeatureCreation(creationInfo){Promise<void>}
起始版本:GeoScene API for JavaScript 4.23

通过显示开始创建特征的面板来启动 CreateFeaturesWorkflow。此方法采用包含要使用的层和模板的 CreationInfo 对象。

参数:
creationInfo CreationInfo

包含使用编辑器小部件创建新功能所需的信息的对象。该对象提供了用于创建一个或多个新特征的特征模板和图层。

返回:
类型 说明
Promise<void> 解决 CreateFeaturesWorkflow 何时启动并显示开始创建特征的面板。
另请参阅:
startCreateFeaturesWorkflowAtFeatureTypeSelection(){Promise<void>}
起始版本:GeoScene API for JavaScript 4.23

通过显示 FeatureTemplates 面板来启动 CreateFeaturesWorkflow

返回:
类型 说明
Promise<void> CreateFeaturesWorkflow 启动并显示 FeatureTemplates 面板时解决。
startCreateWorkflowAtFeatureCreation(creationInfo){Promise<void>}
已弃用从 4.23 版开始。而是使用 startCreateFeaturesWorkflowAtFeatureCreation

通过显示开始创建特征的面板来启动 CreateFeaturesWorkflow。此方法采用包含要使用的层和模板的 CreationInfo 对象。

参数:
creationInfo CreationInfo

包含使用编辑器小部件创建新功能所需的信息的对象。 此对象提供用于创建新要素的要素模板和图层。

返回:
类型 说明
Promise<void> 解决 CreateFeaturesWorkflow 何时启动并显示开始创建特征的面板。
另请参阅:
startCreateWorkflowAtFeatureEdit(feature){Promise<void>}
已弃用自 4.23 起

此方法启动 CreateWorkflow,等待选择多个要素。

参数:
feature Graphic

已编辑的要素。

返回:
类型 说明
Promise<void> CreateWorkflow 启动后解决,显示开始创建特征的面板,并等待选择特征。
另请参阅:
startCreateWorkflowAtFeatureTypeSelection(){Promise<void>}
已弃用从 4.23 版开始。而是改用 startCreateFeaturesWorkflowAtFeatureTypeSelection

通过显示 FeatureTemplates 面板来启动 CreateWorkflow

返回:
类型 说明
Promise<void> CreateWorkflow 启动并显示 FeatureTemplates 面板时解决。
另请参阅:
startUpdateWorkflowAtFeatureEdit(feature){Promise<void>}

在属性编辑面板上启动 UpdateWorkflow

参数:
feature Graphic

已更新的要素。

返回:
类型 说明
Promise<void> UpdateWorkflow 启动属性编辑面板后解决。
另请参阅:
startUpdateWorkflowAtFeatureSelection(){Promise<void>}

使用当前选定的功能启动 UpdateWorkflow

返回:
类型 说明
Promise<void> 使用当前选定的功能启动 UpdateWorkflow 后解决。
另请参阅:
startUpdateWorkflowAtMultipleFeatureSelection(candidates){Promise<void>}

此方法启动 UpdateWorkflow,等待选择多个功能。

参数:
candidates Graphic[]

一系列要更新的功能。这仅在有多个候选者要更新时才相关。

返回:
类型 说明
Promise<void> UpdateWorkflow 启动后解决,因为它等待选择多个功能。
另请参阅:
when(callback, errback){Promise}inherited
起始版本:GeoScene API for JavaScript 4.19

when() 一旦创建了类的实例,就可以利用它。这个方法有两个输入参数:一个 callback 函数和一个 errback 函数。callback 在类的实例加载时执行。如果类的实例无法加载,则执行 errback

参数:
callback Function
可选

当 promise 解决时调用的函数。

errback Function
可选

当 promise 失败时执行的函数。

返回:
类型 说明
Promise 返回 callback 结果的新promise,可用于链接其他函数。
示例:
// 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
});

类型说明

CreationInfo

该对象提供了用于创建一个或多个新特征的特征模板和图层。

属性:

新创建要素的关联要素图层。

用于创建新功能的关联功能模板。

LayerInfo

用于在编辑器中设置图层的可编辑首选项的配置。

属性:

包含可编辑字段的关联要素图层。

allowAttachments Boolean
optional
默认值:true

指示是否在编辑器的 UI 中显示附件小部件。 默认情况下,如果服务 supportsAttachment,则为 true

enabled Boolean
optional
默认值:true

指示是否在图层上启用编辑。如果服务支持,则默认为 true

addEnabled Boolean
optional

指示是否启用创建新功能的要素。如果服务支持,则默认为 true

updateEnabled Boolean
optional

指示是否启用创建新功能的要素。如果服务支持,则默认为 true

deleteEnabled Boolean
optional

指示是否启用删除要素的要素。如果服务支持,则默认为 true

formTemplate FormTemplate
optional

定义功能的表单内容的模板。在设置要编辑的字段时使用它。

SupportingWidgetDefaults

设置此项以自定义任何支持的 Editor 微件的默认行为。这些微件包括 FeatureFormFeatureTemplatesSketchViewModel

属性:
featureForm Object
可选

包含特定于自定义 FeatureForm 微件的属性的对象。

规格:
groupDisplay String
可选

指示 groupDisplay 以及它们将如何显示给最终用户的字符串。这仅适用于使用 Editor 的 图层信息中配置的分组字段元素

featureTemplates Object
optional

包含特定于自定义 FeatureTemplates 微件的属性的对象。

规格:
optional

帮助管理各种模板项以及它们在小部件中的显示方式。请参阅 groupBy 参考手册以获取更多信息。

visibleElements.filter Boolean
optional

指示是否显示模板过滤器

sketch Object
optional

包含特定于自定义 Sketch 微件的属性的对象。

规格:
defaultUpdateOptions Object
optional

包含 Sketch 微件的 defaultUpdateOptions 的对象。

markerSymbol SimpleMarkerSymbol
optional

用于符号化任何点要素更新的标记符号。

polygonSymbol SimpleFillSymbol
optional

用于符号化任何面要素更新的面符号。

polylineSymbol SimpleLineSymbol
optional

用于符号化任何线要素更新的线符号。

您的浏览器已不再受支持。请升级您的浏览器以获得最佳体验。有关更多详细信息,请参阅 我们的浏览器弃用帖