// 坡向分析
|
<template>
|
<div class="aspect">
|
<div>
|
<el-button @click="handleDraw">绘制区域</el-button>
|
<el-button @click="handleClear">关闭坡度</el-button>
|
</div>
|
<div style="margin-top: 10px">
|
<el-button @click="handleaspect">坡度分析</el-button>
|
<el-button @click="handleSlope">坡向分析</el-button>
|
</div>
|
</div>
|
</template>
|
<script setup>
|
import { reactive, defineEmits } from "vue";
|
// 定义 emit 方法
|
const emit = defineEmits(["draw", "clear", "handleaspect", "handleSlope"]);
|
const handleDraw = () => {
|
console.log("绘制区域");
|
emit("draw");
|
};
|
const handleClear = () => {
|
console.log("关闭坡度");
|
emit("clear");
|
};
|
const handleaspect = () => {
|
console.log("坡度分析");
|
emit("handleaspect");
|
};
|
const handleSlope = () => {
|
console.log("坡向分析");
|
emit("handleSlope");
|
};
|
</script>
|
<style lang="less" scoped>
|
.aspect {
|
width: 215px;
|
// height: 50px;
|
background: url("@/assets/img/tools/plotting_new.png") no-repeat;
|
filter: opacity(83%);
|
background-size: 100% 100%;
|
padding: 10px;
|
box-sizing: border-box;
|
}
|
</style>
|
