Toggle navigation
Toggle navigation
This project
Loading...
Sign in
Hooke
/
map-demo
Go to a project
Toggle navigation
Toggle navigation pinning
Projects
Groups
Snippets
Help
Project
Activity
Repository
Pipelines
Graphs
Issues
0
Merge Requests
0
Wiki
Snippets
Network
Create a new issue
Builds
Commits
Issue Boards
Authored by
hookehuyr
2025-02-08 17:38:20 +0800
Browse Files
Options
Browse Files
Download
Email Patches
Plain Diff
Commit
ff6fa82b3f2c8a6482049cbc248afa98458ef2cf
ff6fa82b
1 parent
e81bab86
fix 文字修改
Hide whitespace changes
Inline
Side-by-side
Showing
1 changed file
with
19 additions
and
19 deletions
src/views/mapCutter.vue
src/views/mapCutter.vue
View file @
ff6fa82
<!--
* @Date: 2025-01-22 11:40:12
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2025-02-08 1
6:15:04
* @LastEditTime: 2025-02-08 1
7:37:19
* @FilePath: /map-demo/src/views/mapCutter.vue
* @Description: 文件描述
-->
...
...
@@ -17,7 +17,7 @@
</div> -->
<div style="display: flex; padding: 1rem; gap: 1rem;">
<div style="display: flex; align-items: center;">
<div>
目标地图经纬度
: </div>
<div>
地图中心坐标
: </div>
<el-input
v-model="map_center"
style="width: 240px"
...
...
@@ -27,7 +27,7 @@
</div>
<div style="display: flex; align-items: center;">
<div>地图层级: </div>
<el-select v-model="map_zoom" placeholder="地图层级" style="width:
24
0px" @change="onZoomChange">
<el-select v-model="map_zoom" placeholder="地图层级" style="width:
8
0px" @change="onZoomChange">
<el-option
v-for="item in zoom_options"
:key="item.value"
...
...
@@ -38,7 +38,7 @@
</div>
<div style="display: flex; align-items: center;">
<div>上传图片
基点
: </div>
<div>上传图片
左下角坐标
: </div>
<el-input
v-model="map_left_bottom_range"
style="width: 240px"
...
...
@@ -52,11 +52,11 @@
placeholder="输入右上角的经纬度"
@blur="onRTRangeBlur"
/> -->
<div>上传图片比例: </div>
<div>上传图片
缩放
比例: </div>
<el-input
v-model="img_ratio"
style="width: 240px"
placeholder="输入
上传图片
比例"
placeholder="输入比例"
@blur="onRatioBlur"
>
</el-input>
...
...
@@ -83,7 +83,7 @@
<el-button type="primary" @click="rotateMap(-10)">地图逆时针旋转</el-button>
</div> -->
<div v-if="log_lnglat" style="position: fixed; top:
5
rem; left: 1rem; color: black; background-color: white; padding: 1rem;">
<div v-if="log_lnglat" style="position: fixed; top:
8
rem; left: 1rem; color: black; background-color: white; padding: 1rem;">
<div style=" display: flex; align-items: center; justify-content: center;">经纬度:{{ log_lnglat }} <el-button @click="copyText(log_lnglat)" type="primary" :icon="Brush" size="small">复制</el-button></div>
</div>
...
...
@@ -367,20 +367,20 @@ imageLayer.value.setBounds(bounds.value);
// ✅ 2. 缩放图片
const scaleImage = (factor) => {
const sw = bounds.value.getSouthWest();
const ne = bounds.value.getNorthEast();
const sw = bounds.value.getSouthWest();
const ne = bounds.value.getNorthEast();
const centerX = (sw.lng + ne.lng) / 2;
const centerY = (sw.lat + ne.lat) / 2;
const newWidth = (ne.lng - sw.lng) * factor;
const newHeight = (ne.lat - sw.lat) * factor;
const centerX = (sw.lng + ne.lng) / 2;
const centerY = (sw.lat + ne.lat) / 2;
const newWidth = (ne.lng - sw.lng) * factor;
const newHeight = (ne.lat - sw.lat) * factor;
bounds.value = new AMap.Bounds(
[centerX - newWidth / 2, centerY - newHeight / 2],
[centerX + newWidth / 2, centerY + newHeight / 2]
);
bounds.value = new AMap.Bounds(
[centerX - newWidth / 2, centerY - newHeight / 2],
[centerX + newWidth / 2, centerY + newHeight / 2]
);
imageLayer.value.setBounds(bounds.value);
imageLayer.value.setBounds(bounds.value);
};
// 旋转地图
...
...
@@ -531,7 +531,7 @@ const onRatioBlur = () => {
.controls-container {
position: absolute;
top:
5
rem;
top:
8
rem;
right: 10px;
display: flex;
flex-direction: column;
...
...
Please
register
or
login
to post a comment