// ---------------------------------------------------
// Snippets_Ex09
// ---------------------------------------------------

  /*
  この演習で使用する URL

  https://localhost/iweb/Ex09/

  ArcGIS Maps SDK for JavaScript サイト
  https://js.arcgis.com

  Wildfire フィーチャ サービス
    Points：
      https://sampleserver6.arcgisonline.com/arcgis/rest/services/Wildfire/FeatureServer/0
    Lines：
      https://sampleserver6.arcgisonline.com/arcgis/rest/services/Wildfire/FeatureServer/1
    Polygons：
      https://sampleserver6.arcgisonline.com/arcgis/rest/services/Wildfire/FeatureServer/2

  */

// ---------------------------------------------------
  
  js/main.js

  /*
    ステップ：編集可能なレイヤーの構築、追加
  */
   const flFirePoints = new FeatureLayer({
    url: "https://sampleserver6.arcgisonline.com/arcgis/rest/services/Wildfire/FeatureServer/0",
    outFields: ["*"]
  });
  const flFireLines = new FeatureLayer({
    url: "https://sampleserver6.arcgisonline.com/arcgis/rest/services/Wildfire/FeatureServer/1",
    outFields: ["*"]
  });
  const flFirePolygons = new FeatureLayer({
    url: "https://sampleserver6.arcgisonline.com/arcgis/rest/services/Wildfire/FeatureServer/2",
    outFields: ["*"]
  });

  mapEl.map.addMany([flFirePoints, flFireLines, flFirePolygons]);

// ---------------------------------------------------

  index.html body

  <!-- ステップ：Editor コンポーネントの作成 -->
  <arcgis-editor slot="top-right"></arcgis-editor>

// ---------------------------------------------------

  /*
    ステップ：FeatureTemplates の作成
  */
  const templatesDiv = document.createElement("div")
  templatesDiv.slot = "top-left";
  templatesDiv.style.height = "400px"
  templatesDiv.style.overflowY = "auto"
  const featureTemplates = new FeatureTemplates({
    layers: [flFirePolygons, flFireLines, flFirePoints],
    container:templatesDiv
  });
  mapEl.append(templatesDiv);

// ---------------------------------------------------

   /*
     ステップ：作図結果とテンプレートの選択内容からグラフィックを作成
   */
   const editGraphic = evt.graphic;
   editGraphic.attributes = currentAttributes;

// ---------------------------------------------------

   /*
     ステップ：グラフィックをフィーチャ レイヤーに追加
   */
   currentFeatureLayer.applyEdits({
     addFeatures: [editGraphic]
   });

// ---------------------------------------------------