当前位置: 首页>>代码示例 >>用法及示例精选 >>正文


JavaScript ArcGIS SnappingControls用法及代码示例


基本信息

以下是所在类或对象的基本信息。

AMD: require(["esri/widgets/support/SnappingControls"], (SnappingControls) => { /* code goes here */ });

ESM: import SnappingControls from "@arcgis/core/widgets/support/SnappingControls";

类: esri/widgets/support/SnappingControls

继承: SnappingControls > Widget > Accessor

自从:用于 JavaScript 4.21 的 ArcGIS API

用法说明

概述

SnappingControls 小部件提供与SnappingOptions 类一起使用的用户接口。 SnappingOptionsSketchSketchViewModelEditorEditorViewModel 中的属性。

此小部件已集成为Sketch 小部件的一部分。因此,它会在加载 Sketch 小部件时自动包含在内,并且在开发人员端不需要额外的工作。

查看 Sketch 小部件中的 SnappingControlssketch-geometries样本。
sketch-geometries

使用小部件

SnappingControls 小部件可以像任何其他小部件一样与 MapView 一起使用。但是,此小部件依赖于SnappingOptions 类。目前,除了 SketchEditor 小部件及其各自的视图模型之外,它仅作为属性提供。这意味着 SnappingControls 小部件不能用作独立小部件,除非它与这些支持的类结合使用。要将此小部件与 EditorEditorViewModelSketchViewModel 一起使用,必须对其进行实例化,并且其 snappingOptions 属性必须设置为 Editor'sEditorViewModel'sSketchViewModel's snappingOptions 属性。

以下代码片段演示了如何在编辑器小部件中使用SnappingControls。

require(["esri/widgets/Editor", "esri/widgets/support/SnappingControls"], (Editor, SnappingControls) => {
  const editor = new Editor({
    view: view
  });

  // create a new instance of the SnappingControls widget
  const snappingControls = new SnappingControls({
    view: view,
    snappingOptions: editor.snappingOptions  // set the Editor's snappingOptions property
  });

  view.ui.add(editor, "top-right");  // adds the Editor widget to the view
  view.ui.add(snappingControls, "top-left"); // adds the SnappingControls widget to the view

});

此小部件将自动检测 Map 上支持捕捉的任何图层,并且 layerlist 会填充这些 FeatureSnappingLayerSources 。默认情况下,这些图层将被禁用以进行要素捕捉。当用户单击图层列表中的图层标题时,图层将启用捕捉。如果希望自动启用这些层,请将 enabled 设置为 true

widgets-editor-basic

已知限制

有关获得对小部件样式的完全控制的信息,请参阅Styling 主题。

例子:

// Create a new instance of SketchViewModel
const sketchViewModel = new SketchViewModel({
  view: view,
  layer: graphicsLayer
});

// Create a new instance of the SnappingControls widget
const snappingControls = new SnappingControls({
  view: view,
  snappingOptions: sketchViewModel.snappingOptions
});

相关用法


注:本文由纯净天空筛选整理自arcgis.com大神的英文原创作品 SnappingControls。非经特殊声明,原始代码版权归原作者所有,本译文未经允许或授权,请勿转载或复制。