From 1dee40ea46601f2ee5d10aa0190625ebf03bdc4e Mon Sep 17 00:00:00 2001
From: shuishen <1109946754@qq.com>
Date: Mon, 02 Dec 2024 17:02:19 +0800
Subject: [PATCH] 1
---
src/pages/map/components/scomponents/tool/measure.vue | 220 +++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 220 insertions(+), 0 deletions(-)
diff --git a/src/pages/map/components/scomponents/tool/measure.vue b/src/pages/map/components/scomponents/tool/measure.vue
new file mode 100644
index 0000000..afcd1c7
--- /dev/null
+++ b/src/pages/map/components/scomponents/tool/measure.vue
@@ -0,0 +1,220 @@
+<!--
+ * @Author: shuishen 1109946754@qq.com
+ * @Date: 2024-10-29 15:48:36
+ * @LastEditors: shuishen 1109946754@qq.com
+ * @LastEditTime: 2024-10-29 19:53:49
+ * @FilePath: \bigScreen\src\views\layout\components\scomponents\tool\location.vue
+ * @Description:
+ *
+ * Copyright (c) 2024 by shuishen, All Rights Reserved.
+-->
+<template>
+ <public-box style="z-index: 100;">
+ <template #name>
+ <div class="name"><i class="fa fa-map-pin"></i> 测量工具</div>
+ </template>
+
+ <template #close>
+ <div class="close cursor-p" @click="$emit('closeChild')"><i class="fa fa-close"></i></div>
+ </template>
+
+ <template #content>
+
+ <div>
+ <div class="container-box">
+ <div v-for="(item, index) in buttonList" :key="index" class="item" @click="item.click">
+ <img class="icon_img" src="../../../../../assets/images/add.png" alt="" srcset="">
+ <div class="text">{{ item.label }}</div>
+ </div>
+ </div>
+
+ <div class="button-clear">
+ <button @click="deactivate">清空测量数据</button>
+ </div>
+ </div>
+
+
+
+ </template>
+ </public-box>
+</template>
+
+<script setup>
+const longitude = ref(0)
+const latitude = ref(0)
+const height = ref(0)
+let measure = reactive({})
+onMounted(() => {
+ measure = new DC.Measure(window.$viewer)
+})
+
+onUnmounted(() => {
+ deactivate()
+})
+// 空间距离
+function calcDistance() {
+ measure.distance()
+}
+// 贴地距离
+function distanceSurface() {
+ measure.distanceSurface()
+}
+// 水平面积
+function calcArea(item) {
+ measure.area()
+}
+// 贴地面积
+function areaSurface() {
+ measure.areaSurface()
+}
+// 角度
+function calcAngle() {
+ measure.angle()
+}
+// 模型角度
+function calcModelAngle() {
+ measure.angle({
+ clampToModel: true
+ })
+}
+// 高度
+function calcHeight() {
+ measure.height()
+}
+// 贴物高度
+function calcModelHeight() {
+ measure.height({
+ clampToModel: true
+ })
+}
+// 航向
+function calcHeading() {
+ measure.heading()
+}
+// 模型航向
+function areaHeight() {
+ measure.areaHeight()
+}
+// 三角测量
+
+function calcTriangleHeight() {
+ measure.triangleHeight()
+}
+// 模型三角测量
+function calcModelTriangleHeight() {
+ measure.triangleHeight({
+ clampToModel: true
+ })
+}
+
+// 清空
+function deactivate() {
+ measure.deactivate()
+}
+
+const buttonList = [
+ {
+ label: '空间距离',
+ value: 'space',
+ imges: '../../../../../assets/images/add.png',
+ click: calcDistance
+ },
+ {
+ label: '贴地距离',
+ value: 'area',
+ imges: '../../../../../assets/images/add.png',
+ click: distanceSurface
+ },
+ // {
+ // label: '剖面',
+ // value: 'volume',
+ // imges: '../../../../../assets/images/add.png'
+ // },
+ {
+ label: '水平面积',
+ value: 'volume',
+ imges: '../../../../../assets/images/add.png',
+ click: calcArea
+ },
+ {
+ label: '贴地面积', value: 'volume',
+ imges: '../../../../../assets/images/add.png',
+ click: areaSurface
+
+ },
+ {
+ label: '角度',
+ value: 'volume',
+ imges: '../../../../../assets/images/add.png',
+ click: calcAngle
+ },
+ {
+ label: '高度差',
+ value: 'volume',
+ imges: '../../../../../assets/images/add.png',
+ click: calcAngle
+ },
+ {
+ label: '三角测量',
+ value: 'volume',
+ imges: '../../../../../assets/images/add.png',
+ click: calcModelTriangleHeight
+ },
+ {
+ label: '贴物高度',
+ value: 'volume',
+ imges: '../../../../../assets/images/add.png',
+ click: calcModelHeight
+ },
+]
+
+const flyTo = () => {
+ // window.$viewer.flyToPosition(new DC.Position(longitude.value, latitude.value, height.value, 0, -90, 0), () => { }, 3)
+}
+</script>
+
+<style lang="scss" >
+.container-box {
+ width: 230px;
+ display: flex;
+ flex-wrap: wrap;
+ font-size: 12px;
+}
+
+.icon_img {
+ width: 40px;
+ height: 40px;
+}
+
+.item {
+ width: 60px;
+ margin: 8px;
+ text-align: center;
+ padding: 3px;
+}
+
+.button-clear {
+ display: flex;
+ justify-content: center;
+ margin: 10px 0;
+}
+
+.button-clear button {
+ padding: 6px;
+ border: none;
+}
+
+.button-clear button:hover {
+ background-color: blue;
+ color: #fff;
+}
+
+.container-box .item:hover {
+ box-shadow: inset 0px 0px 30px 20px rgba(31, 139, 247, 0.949);
+ border-radius: 20%;
+}
+
+.text {
+ // color: pink;
+}
+</style>
\ No newline at end of file
--
Gitblit v1.9.3