const [
  SketchViewModel,

] = await $arcgis.import([
  "@arcgis/core/widgets/Sketch/SketchViewModel.js",

]);

const mapEl = document.querySelector("arcgis-map");
await mapEl.viewOnReady();

/*
  ステップ：編集可能なレイヤーの構築、追加
*/


/*
  ステップ：FeatureTemplates の作成
*/


// SketchViewModel の初期化
const sketchVM = new SketchViewModel({
  layer: mapEl.view.graphics,
  view: mapEl.view,
  snappingOptions: {
    enabled: true,
  }
});
sketchVM.on("create", editFeature);

// FeatureTemplates の選択内容を入力する変数
let currentAttributes, currentFeatureLayer;

function selectTemplate(evt) {
  // 選択内容の格納
  currentAttributes = evt.template.prototype.attributes;
  currentFeatureLayer = evt.item.layer;

  // スケッチの開始
  sketchVM.create(currentFeatureLayer.geometryType, { mode: "click" });

}

function editFeature(evt) {
  // 作図の完了をハンドリング
  if (evt.state === "complete") {
    // 作図結果をグラフィックをグラフィックス レイヤーから削除
    mapEl.graphics.remove(evt.graphic);
    /*
      ステップ：作図結果とテンプレートの選択内容からグラフィックを作成
    */

      
    /*
      ステップ：グラフィックをフィーチャ レイヤーに追加
    */


  }
}
