> mapgis-3d-draw

## 属性

| 名称          | 类型    | 默认值                                                                                                                                                  | 描述                                                                                                                                                                                                                          | 是否监听 |
| ------------- | ------- | ------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------- |
| infinite      | Boolean | false                                                                                                                                                   | 是否允许无限绘制。true：允许无限绘制，false：不允许                                                                                                                                                                           | 是       |
| enableControl | Boolean | false                                                                                                                                                   | 添加一个自带的能实现基本功能的按钮控件，可通过传入的属性 position 改变其显示的位置                                                                                                                                            | 否       |
| position      | String  | 'top-right'                                                                                                                                             | 传入的属性 position 改变其按钮控件的位置                                                                                                                                                                                      | 否       |
| clampToGround | Boolean | true                                                                                                                                                    | 绘制在三维图层上，是否贴地贴模型，true 则贴地贴模型。                                                                                                                                                                         | 是       |
| drawStyle     | Object  | {<br/> color: '#FF0000',<br/>opacity: 1,<br/>//点的边线宽度 outlineWidth: 1,<br/>//点的边线颜色 <br/>outlineColor: '#FFA500',<br/>//线宽 width: 2<br/>} | 绘制点、线、矩形、多边形、圆图形样式。目前不支持矩形、多边形、圆的边线样式设置。                                                                                                                                              | 否       |
| vueKey        | String  | default                                                                                                                                                 | mapgis-web-scene 组件的 ID，当使用多个 mapgis-web-scene 组件时，需要指定该值，来唯一标识 mapgis-web-scene 组件，<br/>同时 mapgis-web-scene 插槽中的组件也需要传入相同的 vueKey，让组件知道应该作用于哪一个 mapgis-web-scene。 | 否       |
| vueIndex      | Number  | (Math.random() \* 1000000).toFixed(0)                                                                                                                   | 当 mapgis-web-scene 插槽中使用了多个相同组件时，例如多个 mapgis-3d-igs-doc-layer 组件，用来区分组件的标识符。                                                                                                                 | 否       |

## 槽

### `default`

- **Description:** Draw 的自定义槽的实现，可以自定义绘制控件样式

## 事件

### `@load`

- **Description:** 在 Draw 加载完毕后发送该事件
- **Payload** `{ Draw ,webGlobe }`
- `Draw` Draw 对象
- `webGlobe` 当前绘制组件所在的 webGlobe

### `@unload`

- **Description:** 在 Draw 注销完毕后发送该事件
- **Payload** `{ Draw }`
- `Draw` Draw 对象

### `@drawCreate`

- **Description:** 在 Draw 绘制图形完毕后发送该事件
- **Payload** `{ cartoCoordinate ,degreeCoordinate ,webGlobe}`
- `cartoCoordinate` 笛卡尔坐标集合
- `degreeCoordinate` 经纬度坐标集合
- `webGlobe` 当前绘制组件所在的 webGlobe

### `@drawcreate`

- **Description:** 使用 CDN 的方式引入，会使用全小写的方式，在 Draw 绘制图形完毕后发送该事件
- **Payload** `{ cartoCoordinate ,degreeCoordinate ,webGlobe}`
- `cartoCoordinate` 笛卡尔坐标集合
- `degreeCoordinate` 经纬度坐标集合
- `webGlobe` 当前绘制组件所在的 webGlobe

## 示例

### 简单使用

```vue
<template>
  <div id="app">
    <mapgis-web-scene>
      <mapgis-3d-raster-layer
        url="http://t0.tianditu.com/DataServer?T=vec_w&L={z}&Y={y}&X={x}&tk=9c157e9585486c02edf817d2ecbc7752"
      />
      <mapgis-3d-igs-m3d
        :autoReset="autoReset"
        :maximumScreenSpaceError="maximumScreenSpaceError"
        :url="m3dUrl"
      >
      </mapgis-3d-igs-m3d>
      <mapgis-3d-draw
        :enableControl="enableControl"
        :drawStyle="drawStyle"
        :clampToGround="clampToGround"
        :position="position"
        :infinite="infinite"
      >
      </mapgis-3d-draw>
    </mapgis-web-scene>
  </div>
</template>

<script>
export default {
  name: "cesiumWmtsLayer",
  data() {
    return {};
  },
  methods: {
    m3dUrl: "http://develop.smaryun.com:6163/igs/rest/g3d/DaYanTa",
    autoReset: true,
    maximumScreenSpaceError: 6,
    enableControl: true,
    position: "top-right",
    drawStyle: {
      color: "#FF8C00",
      opacity: 0.6,
      // outlineColor:'#FFA500',
      // width:4,
      // outlineWidth:2
    },
    clampToGround: true,
    infinite: true,
  },
};
</script>

<style>
#app {
  height: 100vh;
  width: 100vw;
}
#toolbar-wrapper {
  position: absolute;
  z-index: 9999;
  display: inline-flex;
  overflow-x: hidden;
  overflow-y: visible;
  top: 20px;
  left: 20px;
}
.toolbar-item {
  background: #ffffff;
  border: 1px dashed #666666;
  text-align: center;
  font-size: 20px;
  line-height: 20px;
  height: fit-content;
  padding: 6px 16px;
  cursor: pointer;
}
</style>
```
