9d482ccf by 杨威

右下角定位样式 及缓冲区分析结果样式 及分析数据展示

1 parent 54cba80d
...@@ -3,11 +3,11 @@ ...@@ -3,11 +3,11 @@
3 <div :id="viewId" class="viewDiv"> 3 <div :id="viewId" class="viewDiv">
4 </div> 4 </div>
5 <div class="mapViewPoint"> 5 <div class="mapViewPoint">
6 <span class="key">比例尺:</span> 6 <!-- <span class="key">比例尺:</span> -->
7 <span class="value">{{ mapInfo.scale }}km</span> 7 <div class="viewScale"><span class="value">{{ mapInfo.scale }}公里</span></div>
8 <span class="key">经度:</span> 8 <span class="key">X坐标</span>
9 <span class="value">{{ mapInfo.x }}</span> 9 <span class="value">{{ mapInfo.x }}</span>
10 <span class="key">纬度:</span> 10 <span class="key">Y坐标</span>
11 <span class="value">{{ mapInfo.y }}</span> 11 <span class="value">{{ mapInfo.y }}</span>
12 </div> 12 </div>
13 </div> 13 </div>
...@@ -70,7 +70,7 @@ ...@@ -70,7 +70,7 @@
70 var point = view.toMap({x: event.x, y: event.y}); 70 var point = view.toMap({x: event.x, y: event.y});
71 self.mapInfo.x = point.longitude.toFixed(6); 71 self.mapInfo.x = point.longitude.toFixed(6);
72 self.mapInfo.y = point.latitude.toFixed(6); 72 self.mapInfo.y = point.latitude.toFixed(6);
73 self.mapInfo.scale = (view.scale/1000).toFixed(3); 73 self.mapInfo.scale = (view.scale/1000).toFixed(0);
74 74
75 }); 75 });
76 }).catch(err => { 76 }).catch(err => {
...@@ -90,22 +90,33 @@ ...@@ -90,22 +90,33 @@
90 width: 100%; 90 width: 100%;
91 } 91 }
92 .mapViewPoint{ 92 .mapViewPoint{
93 display: inline-flex;
93 position: absolute; 94 position: absolute;
94 bottom: 10px; 95 bottom: 10px;
95 left: 5px; 96 left: 5px;
96 background-color: white; 97 line-height: 12px;
97 line-height: 36px;
98 font-size: 12px;
99 border-radius: 4px;
100 box-shadow: 0px 1px 1px 1px rgba(0, 0, 0, 0.18);
101 .key{
102 font-weight: 600;
103 }
104 .value{ 98 .value{
105 margin-left: 0px; 99 margin-left: 0px;
106 } 100 }
107 span{ 101 span{
108 margin:0px 5px; 102 margin:0px 5px;
103 font-family: SFUIDisplay-Medium;
104 font-size: 12px;
105 color: #4A4A4A;
106 font-weight: bold;
107 letter-spacing: 0;
108 text-shadow: 0 -1px 0 #FFFFFF;
109 position: relative;
110 bottom: 9px;
111 }
112 .viewScale{
113 width: auto;
114 background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAANIAAAAOCAYAAABaZUIWAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAA0qADAAQAAAABAAAADgAAAAD7u0TwAAAA4ElEQVRoBe3a4QnCMBCG4UQcpKPU39kpq8UFsoObxBzVH6WeNHBQ2nsDFYlH4j3lI1QMoY/WWumXNorUMBDwKtCDUbRwyGficvOKQ98IWAqsglRrfaWUglzy3nIj1kLg7AL/8rEK0tkb5fsjcJQAQTpKnn0vJXDf0c0sD1o76ihBwK0AJ5LbW0/jlgLqiZRzniw3Yi0ELiAwaT1wImkyzCMwIECQBrAoRUAT+BUkfljQtJhHYBHYZCTK/OdvDvNSwysCCAwIPGOMj++JtEnYwEKUIuBVQHJDdrzeffq2F3gDSn1fbXNQA8oAAAAASUVORK5CYII=) top no-repeat;
115 background-size: contain;
116 background-position-y: 6px;
117 span{
118 margin: 0px 21px;
119 }
109 } 120 }
110 } 121 }
111 } 122 }
......
...@@ -93,7 +93,7 @@ ...@@ -93,7 +93,7 @@
93 </div> 93 </div>
94 <!-- 底部数据展示区域 --> 94 <!-- 底部数据展示区域 -->
95 <div class="bottomResult" v-if="bottomResultDialog"> 95 <div class="bottomResult" v-if="bottomResultDialog">
96 <div class="closeButn" @click="closeBufferDialog"> 96 <div class="closeButn" @click="closeBufferDialog(false)">
97 <i class="el-icon-close"></i> 97 <i class="el-icon-close"></i>
98 </div> 98 </div>
99 <el-tabs v-model="activeName" > 99 <el-tabs v-model="activeName" >
...@@ -476,8 +476,8 @@ export default { ...@@ -476,8 +476,8 @@ export default {
476 color: #F39835; 476 color: #F39835;
477 } 477 }
478 .active{ 478 .active{
479 border-bottom: 1.5px solid #409eff; 479 border-bottom: 2px solid #409eff;
480 padding-bottom: 5px; 480 padding-bottom: 10px;
481 } 481 }
482 } 482 }
483 .searchResult{ 483 .searchResult{
...@@ -575,11 +575,10 @@ export default { ...@@ -575,11 +575,10 @@ export default {
575 background-color: #ffffff; 575 background-color: #ffffff;
576 margin: 10px; 576 margin: 10px;
577 border-radius: 4px; 577 border-radius: 4px;
578 padding: 5px;
579 .closeButn{ 578 .closeButn{
580 position: relative; 579 position: relative;
581 float: right; 580 float: right;
582 font-size: 20px; 581 font-size: 18px;
583 color: #9B9B9B; 582 color: #9B9B9B;
584 z-index: 16; 583 z-index: 16;
585 } 584 }
...@@ -592,6 +591,14 @@ export default { ...@@ -592,6 +591,14 @@ export default {
592 /deep/ .el-table td, .el-table th.is-leaf { 591 /deep/ .el-table td, .el-table th.is-leaf {
593 text-align: center; 592 text-align: center;
594 } 593 }
594 /deep/ .el-tabs__nav :first{
595 margin-left: 33px;
596 }
597
598 /deep/ .el-tabs__item.is-active{
599 color: #505050;
600 background-color:#ffffff;
601 }
595 } 602 }
596 } 603 }
597 </style> 604 </style>
...\ No newline at end of file ...\ No newline at end of file
......
...@@ -377,7 +377,6 @@ ...@@ -377,7 +377,6 @@
377 } 377 }
378 } 378 }
379 //将那个导入图层清除 379 //将那个导入图层清除
380
381 self.createBuffer(this.importGeo,self.bufferParams.distance,self.viewId,function (bufGeo) { 380 self.createBuffer(this.importGeo,self.bufferParams.distance,self.viewId,function (bufGeo) {
382 self.identify(self.layerUrl,self.bufferParams.layerId,bufGeo,function(res){ 381 self.identify(self.layerUrl,self.bufferParams.layerId,bufGeo,function(res){
383 var resultes = res.results; 382 var resultes = res.results;
...@@ -431,6 +430,7 @@ ...@@ -431,6 +430,7 @@
431 getDjzqList(){ 430 getDjzqList(){
432 var self = this, 431 var self = this,
433 djzqLayer= this.getLayerByName("DJZQ"); 432 djzqLayer= this.getLayerByName("DJZQ");
433 self.bufferParams.selectDjzq = "";
434 self.djzqList = []; 434 self.djzqList = [];
435 this.queryAttributes(this.layerUrl+"/"+djzqLayer.id,{"DJZQDM":this.bufferParams.selectDjq},function (features) { 435 this.queryAttributes(this.layerUrl+"/"+djzqLayer.id,{"DJZQDM":this.bufferParams.selectDjq},function (features) {
436 if(features != null){ 436 if(features != null){
......