editPolygon.md 2.0 KB

多边形编辑类 EditPolygonItem 示例

::: details 目录 [[toc]] :::

绘制示例

::: details 示例代码

<<< @/docs/.vuepress/components/edit/items/editpolygon/editpolygon.vue

:::

源代码

::: details 查看代码

<<< @/docs/guides/edit/items/src/EditPolygonItem.ts

:::

代码说明

1 当 EditPolygonItem 为编辑状态时,需要将 EditPolygonItem 赋给 grabItem

``` js {4} // 编辑状态时的 LineItem this.polygonItem = new EditPolygonItem(null); this.polygonItem.status = SItemStatus.Create; this.scene.grabItem = this.polygonItem;

### 2 当 EditPolygonItem 为正常状态时,需要将 grabItem 置为 null
``` js {4}
 // 正常状态时的 LineItem
 this.polygonItem = new EditPolygonItem(null);
 this.polygonItem.status = SItemStatus.Normal;
 this.scene.grabItem = null;

3 当 EditPolygonItem 为试图垂直水平绘制时需要修改 verAndLeve 属性

``` js {3} // 编辑状态时的 LineItem this.polygonItem = new EditPolygonItem(null,); this.polygonItem.status = SItemStatus.Create; this.polygonItem.verAndLeve = true; this.scene.grabItem = this.polygonItem;

### 4 当 EditPolygonItem 修改属性但是画板尚未变化时需要刷新
``` js {4}
 // 编辑状态时的 LineItem
 this.polygonItem = new EditPolygonItem(null);
 this.polygonItem.status = SItemStatus.Create;
 this.view.update();

5 当 EditPolygonItem 需要拖动时设置 moveable = true

``` js {4} // 编辑状态时的 LineItem this.polygonItem = new EditPolygonItem(null); this.polygonItem.status = SItemStatus.Create; this.polygonItem.moveable = true;

### 6 当 EditPolygonItem 绘制完成后的回调函数为 finishCreated
``` js {4}
 // 编辑状态时的 LineItem
  this.polygonItem = new EditPolygonItem(null);
  this.polygonItem.status = SItemStatus.Create;
  this.polygonItem.connect("finishCreated", this, this.finishCreated);
  this.polygonItem.moveable = true;
  methods:{
      finishCreated(){
      }
  }