From b92fdd535cf66641422ba84fe2d86952f0318248 Mon Sep 17 00:00:00 2001
From: hanbaoshan <hanbaoshan@aiotlink.com>
Date: 星期四, 24 十二月 2020 16:28:53 +0800
Subject: [PATCH] 实景图等比缩放适应在固定宽高内
---
src/pages/panoramicView/components/LabelMark.vue | 35 ++++++++++++++++++++++++-----------
1 files changed, 24 insertions(+), 11 deletions(-)
diff --git a/src/pages/panoramicView/components/LabelMark.vue b/src/pages/panoramicView/components/LabelMark.vue
index 16766da..75f6aa9 100644
--- a/src/pages/panoramicView/components/LabelMark.vue
+++ b/src/pages/panoramicView/components/LabelMark.vue
@@ -126,14 +126,18 @@
:on-change="onChange"
:show-file-list="false"
>
- <el-image
+ <!-- <el-image
class="preview"
v-if="panoramaPath"
:src="panoramaPath"
fit="contain"
@mousemove="showCurPos"
@mouseout="isShowCurPos=false"
- ></el-image>
+ ></el-image>-->
+ <div class="img-wrap" v-if="panoramaPath" :style="{width:fixedW+'px',height:fixedH+'px'}">
+ <img v-if="panoramaPath" :style="{width:imgW+'px',height:imgH+'px'}" :src="panoramaPath" @mousemove="showCurPos" @mouseout="isShowCurPos=false">
+ </div>
+
<div class="el-upload__text">
灏嗘枃浠舵嫋鍒版澶勶紝鎴�
<em>鐐瑰嚮涓婁紶</em>
@@ -200,6 +204,10 @@
snapshot_url: '',
panoramaPath: '',
cameraData: [],
+ fixedW: 960,
+ fixedH: 540,
+ imgW: 0,
+ imgH: 0,
traceX: 0,
traceY: 0,
isShowCurPos: false,
@@ -302,7 +310,16 @@
getPanorama () {
let _this = this;
getPanoramaPic().then(res => {
- _this.panoramaPath = res.data.panoramaPath
+ //鍒ゆ柇闀垮姣�
+ let ratio = res.data.width/res.data.height;
+ if(ratio > (_this.fixedW/_this.fixedH)){
+ _this.imgW = _this.fixedW;
+ _this.imgH = _this.imgW*res.data.height/res.data.width;
+ }else{
+ _this.imgH = _this.fixedH;
+ _this.imgW = res.data.width*_this.imgH/res.data.height;
+ }
+ _this.panoramaPath = res.data.panoramaPath + '?' + Math.random();
})
},
showCurPos (e) {
@@ -324,16 +341,12 @@
let param = new FormData();
param.append('file', params.file)
putPanoramaPic(param).then(res => {
- _this.panoramaPath = res.data.panoramaPath + '?' + Math.random();
+ debugger
+ //_this.panoramaPath = res.data.panoramaPath + '?' + Math.random();
+ _this.getPanorama()
_this.$parent.$refs['tracePlot'] && _this.$parent.$refs['tracePlot'].getPanorama();
})
- // let fileReader = new FileReader()
- // fileReader.onload = () => {
- // _this.file = fileReader.result;
- // }
- // if (_file) {
- // fileReader.readAsDataURL(_file)
- // }
+
},
bindListen (e) {
--
Gitblit v1.8.0