From f98d55979a613b62caefc4c3ee2b8cbb0e725fc2 Mon Sep 17 00:00:00 2001 From: Junjie <fallin.jie@qq.com> Date: 星期五, 26 五月 2023 15:14:01 +0800 Subject: [PATCH] 地图缩放条 --- src/main/webapp/views/home/map.html | 20 ++++++++++++++++++-- 1 files changed, 18 insertions(+), 2 deletions(-) diff --git a/src/main/webapp/views/home/map.html b/src/main/webapp/views/home/map.html index 79345ee..09d7300 100644 --- a/src/main/webapp/views/home/map.html +++ b/src/main/webapp/views/home/map.html @@ -11,6 +11,11 @@ <script type="text/javascript" src="../../static/js/handlebars/handlebars-v4.5.3.js"></script> <script type="text/javascript" src="../../static/js/common.js"></script> <script type="text/javascript" src="../../static/js/vue.min.js"></script> + + <!-- 寮曞叆鏍峰紡 --> + <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css"> + <!-- 寮曞叆缁勪欢搴� --> + <script src="https://unpkg.com/element-ui/lib/index.js"></script> <style> .pointContainer { display: flex; @@ -402,7 +407,7 @@ </head> <body> <div id="app" style="display: flex;justify-content: space-around;margin-top: 50px;flex-wrap: wrap;" @click="bgClick()"> - <div style="flex: 12;"> + <div style="flex: 12;" :style="{scale:showScale/100.0,marginTop:(showScale-100)*5 + 'px'}"> <div> <div class="pointContainer" v-for="(x,index) in map" :key="index"> <div v-if="index != 0 && (index != map.length-1)" v-for="(y,idx) in x" :key="idx"> @@ -450,6 +455,7 @@ </div> </div> <div style="padding: 20px;flex: 5;margin-top: -70px;"> + <el-slider v-model="showScale" :marks="showScaleMarks"></el-slider> <div style="display: flex;justify-content: space-between;flex-wrap: wrap;"> <div class="hoverCard" style="width: 100%;"> <div class="card-details" style="place-content: normal;height: auto;"> @@ -642,6 +648,17 @@ searchLocNo: "", outSite: null, outSites: null, + showScale: 75, //鎺у埗鍦板浘鏄剧ず澶у皬姣斾緥 + showScaleMarks: {//姣斾緥婊戝姩鏉℃樉绀烘爣璁� + 0: "0%", + 50: { + style: { + color: '#1989FA' + }, + label: "50%" + }, + 100: "100%", + } }, created(){ this.init() @@ -705,7 +722,6 @@ let data = this.map let rowData = data[x] for (var i = 1; i < rowData.length; i++) { - console.log(rowData[i],rowData[i].locNo,rowData[i].locNo != undefined) if (rowData[i].locNo != undefined) { let locNo = rowData[i].locNo; return "#" + parseInt(locNo.substr(0, 2)); -- Gitblit v1.9.1