# qe-eagle-view

鹰眼图控件，在浏览模型内部细节时提供一个当前视图在小比例尺下的范围提示。

# 实例

允许解锁鹰眼高度

隐藏代码

<template>

<div style="height: 650px;position: relative;">
      <el-button-group>
        <el-checkbox v-model="enableUnlock" border size="mini" style="margin:0">
          允许解锁
        </el-checkbox>
        鹰眼高度<el-input-number v-model="eagleHeight" :min="100" :step="100" :precision="0" size="mini" style="margin:0">          
        </el-input-number>
      </el-button-group>
    <qe-viewer
      :imagery-type="'AMap'"
      :fullscreen-button="true"
      :default-view="defaultView"
    >
      <qe-eagle-view :eagle-height="eagleHeight" :enable-unlock="enableUnlock" :material="material"/>
    </qe-viewer>
  </div>
</template>

<script>
import { QeViewer,QeEagleView } from  '@qycloud/vue-qearth';
import 'vue2qearth/vue2qearth.css'
import ElementUI from 'element-ui'
import Vue from 'vue'
import 'element-ui/lib/theme-chalk/index.css'
Vue.use(ElementUI)
export default {
  components: {
    QeViewer,
    QeEagleView
  },
  data() {
    return {
      defaultView: [
        118.7863,
        31.9087,
        801.6425,
        1.724684714172732,
        -53.783141852231246,
        0.008819224020548466
      ],
      eagleHeight:2000,
      enableUnlock:false,
      material:'rgba(0,200,0,0.5)'
    };
  },
  methods:{}
}
</script>

# Attributes

参数	说明	类型	可选值	默认值
eagleHeight	鹰眼跟随高度	Number	—	2000
enableUnlock	是否允许取消鹰眼跟随	Boolean	—	false
material	鹰眼图提示区域的css颜色	string	—	'rgba(0,200,0,0.5)'

# Events

覆盖物事件的使用请参照上面TerrainClip 实例

// 可选事件
"ready" // 组件装载后，返回当前实例对象

← qe-layer-control qe-mini-box →