尝试一下在线预览此示例展示了如何在 3D 中使用编辑器微件。此微件很有用，因为它提供了开箱即用的体验，有助于简化应用程序中的编辑体验。
工作原理
微件会自动识别场景中是否有任何可编辑的要素图层。如果有，图层将显示在微件中。根据要素图层上设置的编辑功能，您可以 Edit 现有要素和/或 Add 新要素。
编辑器微件使用与其他微件相同的编码模式，即您必须指定微件要使用的视图。
1
2
3
4
const editor = new Editor({
view: view
// Pass in any other additional property as needed
});
最后，我们使用 View 的 UI 将微件添加到应用程序。
1
2
// Add widget to top-right of the view
view.ui.add(editor, "top-right");
当点使用 3D 对象符号图层时，编辑工具允许您使用 3D 操纵器以交互方式配置大小和旋转：
为了让编辑工具识别大小和旋转，您需要在渲染器中将它们设置为视觉变量：
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
const renderer = {
type: "unique-value", // autocasts as new UniqueValueRenderer()
// define visual variable for size and rottion and connect to the corresponding fields
visualVariables: [
{
// size can be modified with the interactive handle
type: "size",
field: "SIZE",
axis: "height",
valueUnit: "meters"
},
{
// rotation can be modified with the interactive handle
type: "rotation",
field: "ROTATION"
}
],
};
有关更多示例，请参阅使用编辑器微件编辑要素和使用配置的编辑器微件。
捕捉
您也可以在 Editor 微件中配置捕捉。这是通过 snappingOptions 属性处理的。由于编辑器尚未提供用于配置捕捉功能的 UI，因此此示例包含复选框输入元素以打开/关闭捕捉功能，并指定捕捉是否应限于自我捕捉或要素捕捉。
选中 “Snapping enabled” 复选框相当于将 snappingOptions.enabled 设置为 true。您还可以使用 CTRL 键动态切换捕捉的开/关。
1
2
...
editor.snappingOptions.featureSources = snapSource;
