使用草绘微件和放大镜进行捕捉

此示例演示如何利用草绘微件的捕捉。此示例还利用了放大镜，使捕捉现有图形的折点变得更容易。例如，Magnifier在视图上提供了一个放大的图像，这意味着用户不必为了在地图上定位折点或要素而进行过多的缩放。

放大镜

此示例演示如何配置放大镜，并在游标出现在地图上的任何位置显示它。

// enable the Magnifier
view.magnifier.visible = true;
view.magnifier.factor = 1.7; // magnification factor
view.magnifier.size = 150; // magnifier image size
view.magnifier.offset = { x: 75, y: 75}; // x and y offset values

// uses the mouse cursor location to position the Magnifier
view.on("pointer-move", (evt) => {
  view.magnifier.position = { x: evt.x, y: evt.y };
});

此示例允许用户通过方解石设计系统组件配置 Magnifier 属性。这允许用户打开/关闭放大镜可见性，增加/减少放大系数，增加/减少放大镜大小，并更新偏移量。

magnifier-config-panel

捕捉

此示例演示了如何通过编程或使用草绘微件的用户界面（UI）配置捕捉的示例。有关使用捕捉和 草绘 微件时的已知限制列表，请参阅 SnappingOptions 文档。

下面的代码片段演示了如何在默认情况下为功能捕捉和自捕捉启用捕捉。这需要将 SnappingOptions.enabled 属性设置为 true。用户也可以使用 UI 打开/关闭捕捉，但了解如何以编程方式进行设置也很有用。此示例还显示了如何通过编程将 GraphicsLayer传递给 featureSources，从而在该图层上启用功能捕捉。这也可以通过“捕捉图层”下的 草绘 微件中的 UI 完成。需要明确的是，在使用草绘微件时，不需要以下代码片段中的 snappingOptions 代码。所有这些都可以通过微件的 UI 进行配置。这段代码旨在展示如何在应用程序中以编程方式设置它的示例。

// setup the Sketch widget with all snapping enabled by default
const sketch = new Sketch({
  layer: graphicsLayer,
  view: view,
  // graphic will be selected as soon as it is created
  creationMode: "update",
  snappingOptions: {  // autocasts as SnappingOptions()
    enabled: true,
    featureSources: [{ layer: graphicsLayer, enabled: true }]
  }
});