diff --git a/debug/index.ts b/debug/index.ts
index 02c1cb8..fb2be1c 100644
--- a/debug/index.ts
+++ b/debug/index.ts
@@ -29,6 +29,7 @@ viewer.scene.camera.setView({
 });
 
 let geometry: any;
+let geometryType: string;
 const dragStartHandler = () => {
   console.error('start');
 };
@@ -50,88 +51,19 @@ const editEndHandler = (geometryPoints: any) => {
 
 const buttonGroup = document.getElementById('button-group') as HTMLElement;
 buttonGroup.onclick = (evt) => {
+  const targetElement = evt.target as HTMLElement;
+  geometryType = targetElement.id;
+  geometry = new CesiumPlot[geometryType](Cesium, viewer, {
+    material: Cesium.Color.fromCssColorString('rgba(59, 178, 208, 0.5)'),
+    outlineMaterial: Cesium.Color.fromCssColorString('rgba(59, 178, 208, 1)'),
+    outlineWidth: 3,
+  });
+};
+
+const operationButtonGroup = document.getElementById('operation-button-group') as HTMLElement;
+operationButtonGroup.onclick = (evt) => {
   const targetElement = evt.target as HTMLElement;
   switch (targetElement.id) {
-    case 'drawCircle':
-      geometry = new CesiumPlot.Circle(Cesium, viewer);
-      break;
-    case 'drawSector':
-      geometry = new CesiumPlot.Sector(Cesium, viewer);
-      break;
-    case 'drawPolygon':
-      geometry = new CesiumPlot.Polygon(Cesium, viewer);
-      break;
-    case 'drawReactangle':
-      geometry = new CesiumPlot.Reactangle(Cesium, viewer);
-      break;
-    case 'drawTriangle':
-      geometry = new CesiumPlot.Triangle(Cesium, viewer);
-      break;
-    case 'drawFineArrow':
-      geometry = new CesiumPlot.FineArrow(Cesium, viewer, {
-        material: Cesium.Color.fromCssColorString('rgba(59, 178, 208, 0.5)'),
-        outlineMaterial: Cesium.Color.fromCssColorString('rgba(59, 178, 208, 1)'),
-        outlineWidth: 3,
-      });
-      break;
-    case 'drawAttackArrow':
-      geometry = new CesiumPlot.AttackArrow(Cesium, viewer, {
-        outlineMaterial: Cesium.Color.RED,
-      });
-      break;
-    case 'drawSwallowtailAttackArrow':
-      geometry = new CesiumPlot.SwallowtailAttackArrow(Cesium, viewer, {
-        outlineMaterial: Cesium.Color.BLUE,
-      });
-      break;
-    case 'drawSquadCombat':
-      geometry = new CesiumPlot.SquadCombat(Cesium, viewer, {
-        outlineMaterial: new Cesium.PolylineDashMaterialProperty({
-          color: Cesium.Color.RED,
-          dashLength: 16.0,
-        }),
-      });
-      break;
-    case 'drawSwallowtailSquadCombat':
-      geometry = new CesiumPlot.SwallowtailSquadCombat(Cesium, viewer);
-      break;
-    case 'drawStraightArrow':
-      geometry = new CesiumPlot.StraightArrow(Cesium, viewer, {
-        material: Cesium.Color.RED,
-      });
-      break;
-    case 'drawAssaultDirection':
-      geometry = new CesiumPlot.AssaultDirection(Cesium, viewer);
-      break;
-    case 'drawCurvedArrow':
-      geometry = new CesiumPlot.CurvedArrow(Cesium, viewer, {
-        material: Cesium.Color.BLUE,
-      });
-      break;
-    case 'drawDoubleArrow':
-      geometry = new CesiumPlot.DoubleArrow(Cesium, viewer, {
-        outlineMaterial: Cesium.Color.GREEN,
-      });
-      break;
-    case 'drawFreehandLine':
-      geometry = new CesiumPlot.FreehandLine(Cesium, viewer);
-      break;
-    case 'drawCurve':
-      geometry = new CesiumPlot.Curve(Cesium, viewer);
-      break;
-    case 'drawEllipse':
-      geometry = new CesiumPlot.Ellipse(Cesium, viewer);
-      break;
-    case 'drawLune':
-      geometry = new CesiumPlot.Lune(Cesium, viewer);
-      break;
-    case 'drawFreehandPolygon':
-      geometry = new CesiumPlot.FreehandPolygon(Cesium, viewer, {
-        material: Cesium.Color.GREEN,
-        outlineMaterial: Cesium.Color.fromCssColorString('rgba(59, 178, 208, 1)'),
-        outlineWidth: 2,
-      });
-      break;
     case 'hide':
       geometry &&
         geometry.hide({
@@ -164,7 +96,6 @@ buttonGroup.onclick = (evt) => {
         geometry.off('editEnd', editEndHandler);
       }
       break;
-
     case 'startGrowthAnimation':
       if (geometry) {
         geometry.startGrowthAnimation();
@@ -173,15 +104,11 @@ buttonGroup.onclick = (evt) => {
     case 'createGeometryFromData':
       if (geometry) {
         const points = geometry.getPoints();
-        // debugger;
-        // CesiumPlot.createGeometryFromData(points);
-
-        CesiumPlot.createGeometryFromData(Cesium, viewer, {
-          type: 'FineArrow',
+        geometry = CesiumPlot.createGeometryFromData(Cesium, viewer, {
+          type: geometryType,
           cartesianPoints: points,
         });
       }
-
       break;
     case 'cancelDraw':
       if (geometry) {
diff --git a/index.html b/index.html
index 19cae77..cd11472 100644
--- a/index.html
+++ b/index.html
@@ -45,25 +45,35 @@
     <div id="root"></div>
     <div id="cesiumContainer"></div>
     <div class="button-container" id="button-group">
-      <button id="drawPolygon">多边形</button>
-      <button id="drawReactangle">矩形</button>
-      <button id="drawTriangle">三角形</button>
-      <button id="drawCircle">圆形</button>
-      <button id="drawSector">扇形</button>
-      <button id="drawStraightArrow">细直箭头</button>
-      <button id="drawCurvedArrow">曲线箭头</button>
-      <button id="drawFineArrow">直箭头</button>
-      <button id="drawAttackArrow">进攻方向箭头</button>
-      <button id="drawSwallowtailAttackArrow">进攻方向箭头(燕尾)</button>
-      <button id="drawSquadCombat">分队战斗方向</button>
-      <button id="drawSwallowtailSquadCombat">分队战斗方向(燕尾)</button>
-      <button id="drawAssaultDirection">突击方向</button>
-      <button id="drawDoubleArrow">双箭头</button>
-      <button id="drawFreehandLine">自由线</button>
-      <button id="drawFreehandPolygon">自由面</button>
-      <button id="drawCurve">曲线</button>
-      <button id="drawEllipse">椭圆</button>
-      <button id="drawLune">半月面</button>
+      <button id="Polygon">多边形</button>
+      <button id="Reactangle">矩形</button>
+      <button id="Triangle">三角形</button>
+      <button id="Circle">圆形</button>
+      <button id="Sector">扇形</button>
+      <button id="StraightArrow">细直箭头</button>
+      <button id="CurvedArrow">曲线箭头</button>
+      <button id="FineArrow">直箭头</button>
+      <button id="AttackArrow">进攻方向箭头</button>
+      <button id="SwallowtailAttackArrow">进攻方向箭头(燕尾)</button>
+      <button id="SquadCombat">分队战斗方向</button>
+      <button id="SwallowtailSquadCombat">分队战斗方向(燕尾)</button>
+      <button id="AssaultDirection">突击方向</button>
+      <button id="DoubleArrow">双箭头</button>
+      <button id="FreehandLine">自由线</button>
+      <button id="FreehandPolygon">自由面</button>
+      <button id="Curve">曲线</button>
+      <button id="Ellipse">椭圆</button>
+      <button id="Lune">半月面</button>
+      <!-- <button id="hide">隐藏</button>
+      <button id="show">显示</button>
+      <button id="remove">删除</button>
+      <button id="addEvent">绑定事件</button>
+      <button id="removeEvent">解绑事件</button>
+      <button id="startGrowthAnimation">生长动画</button>
+      <button id="createGeometryFromData">根据数据生成图形</button>
+      <button id="cancelDraw">取消绘制</button> -->
+    </div>
+    <div class="button-container" id="operation-button-group" style="top: 50px;">
       <button id="hide">隐藏</button>
       <button id="show">显示</button>
       <button id="remove">删除</button>
diff --git a/src/index.ts b/src/index.ts
index 57c9d01..fc66fd0 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -66,6 +66,7 @@ CesiumPlot.createGeometryFromData = (cesium: any, viewer: any, opts: CreateGeome
   }
   geometry.finishDrawing();
   geometry.onClick();
+  return geometry;
 };
 
 export default CesiumPlot;