Sketch in 3D

This sample demonstrates how to create graphics with 3D symbols and how to update these graphics using SketchViewModel in a SceneView.

For example, a symbol with ExtrudeSymbol3DLayer is used for drawing extruded building footprints:

const sketchVM = new SketchViewModel({
  layer: gLayer,
  view: view,
  polygonSymbol: {
    type: "polygon-3d",
    symbolLayers: [{
      type: "extrude",
      size: 10, // extrude by 10 meters
      material: {
        color: white
      },
      edges: {
        type: "solid",
        size: "3px",
        color: [82, 82, 122, 0.8]
      }
    }]
  },
  defaultCreateOptions: { hasZ: false }
});

To activate the sketch mode you can call the create() method on the SketchViewModel with the geometry type that should be created:

button.addEventListener("click", function(event) {
  sketchVM.create("polygon");
});

Snapping

Version 4.18 introduced self snapping as a feature in beta. Snapping can be enabled either by setting the snappingOptions property in SketchViewModel or by pressing the CTRL key. When modifying a geometry with snapping, use the top down view for the best user experience.