فهرست منبع

xzqh选中样式

zpf 1 سال پیش
والد
کامیت
578883cb27
2فایلهای تغییر یافته به همراه24 افزوده شده و 17 حذف شده
  1. 9 8
      src/views/map3d.vue
  2. 15 9
      src/views/viewer1.vue

+ 9 - 8
src/views/map3d.vue

@@ -410,6 +410,7 @@ export default {
   background-color: rgba(4, 16, 36, 0) !important;
   position: fixed;
   left: 14.5rem;
+  top: 1rem;
   font-weight: 700;
 
   .el-menu--horizontal>.el-menu-item.is-active,
@@ -426,8 +427,8 @@ export default {
   height: 100%;
   background-color: transparent;
   position: fixed;
-  right: 22.3rem;
-  top: 1.3rem;
+  right: 21.9rem;
+  top: 1.1rem;
   background-color: rgba(4, 16, 36, 0) !important;
   font-weight: 700;
 
@@ -435,8 +436,8 @@ export default {
     background-image: url("/static/images/overview/right_mune_button.png");
     background-size: 100% 100%;
     float: left;
-    height: 37px;
-    line-height: 43px !important;
+    height: 34px;
+    line-height: 34px !important;
     margin: 0;
     border: none;
     color: white;
@@ -486,8 +487,8 @@ export default {
 .is-opend {
   background-image: url("/static/images/overview/left_mune_button.png");
   background-size: 100% 100%;
-  height: 37px;
-  line-height: 43px !important;
+  height: 34px;
+  line-height: 34px !important;
   margin: 0;
   border: none;
   color: white;
@@ -528,8 +529,8 @@ export default {
 /deep/ .el-menu-item,
 /deep/ .el-submenu__title,
 /deep/ .is-opened {
-  height: 37px !important;
-  line-height: 43px !important;
+  height: 34px !important;
+  line-height: 34px !important;
   color: white !important;
   background-color: transparent !important;
   border: none !important;

+ 15 - 9
src/views/viewer1.vue

@@ -25,10 +25,12 @@ import datePicker from './cockpitNew1/datePicker.vue';
 import { cockpitInfo } from '@/api/cockpit'
 import xzqh from "../../static/data/460200_full.json";
 export default {
-    components: { JSYD, TDSC, HYSY, TDSY, GDBH, STXF, WPJG ,datePicker},
+    components: { JSYD, TDSC, HYSY, TDSY, GDBH, STXF, WPJG, datePicker },
     data() {
         return {
-            flag: true
+            flag: true,
+            xzqh_color_click: "rgba(46, 177, 251, 0.6)",
+            xzqh_color: "rgba(10, 95, 152, 0.5)",
         };
     },
     //监听属性 类似于data概念
@@ -41,10 +43,11 @@ export default {
             this.flag = !this.flag;
 
         },
-        deteChange(date){
+        deteChange(date) {
 
         },
         pick_xzqh() {
+            const that = this;
             const handler = new Cesium.ScreenSpaceEventHandler(viewer.scene.canvas);
             handler.setInputAction(event => {
                 let pickObj = viewer.scene.pick(event.position);
@@ -83,14 +86,16 @@ export default {
                             const address = pickObj.id.properties.adcode.getValue();
                             const center = pickObj.id.properties.centroid.getValue();
 
-                            pickObj.id.polygon._material.color = Cesium.Color.fromCssColorString("rgba(19, 119, 176, 0.6)");
+                            pickObj.id.polygon._material.color = Cesium.Color.fromCssColorString(that.xzqh_color_click);
+                            pickObj.id.polygon.extrudedHeight = 850;
 
                             viewer.entities.values.forEach((res) => {
 
                                 if (res.properties.name._value != name) {
                                     // console.log(res.properties.name._value, "其他的");
                                     // console.log(res);
-                                    res.polygon._material.color = Cesium.Color.fromCssColorString("rgba(10, 95, 152, 0.6)")
+                                    res.polygon._material.color = Cesium.Color.fromCssColorString(that.xzqh_color)
+                                    res.polygon.extrudedHeight = 450;
 
                                 }
                             })
@@ -109,6 +114,7 @@ export default {
             }, Cesium.ScreenSpaceEventType.LEFT_CLICK);
         },
         init_xzqh() {
+            const that = this;
             xzqh.features.forEach((res) => {
 
                 const twoDArray = res.geometry.coordinates[0][0];
@@ -120,8 +126,8 @@ export default {
                     position: Cesium.Cartesian3.fromDegrees(res.properties.centroid[0], res.properties.centroid[1], 500),
                     text: res.properties.name,
                     label: {
-                        scale: 1,
-                        font: "bolder 18px sans-serif",
+                        scale: 1.5,
+                        font: "bolder 16px sans-serif",
                         style: Cesium.LabelStyle.FILL_AND_OUTLINE,
                         text: res.properties.name,//图标名称
                         fillColor: Cesium.Color.fromCssColorString("#ffffff"),
@@ -133,7 +139,7 @@ export default {
                         image: "./static/images/overview/htq-f.png",
                         height: 60,
                         // 宽度(以像素为单位)
-                        width: 100,
+                        width: 150,
                         // 相对于坐标的垂直位置
                         // verticalOrigin: Cesium.VerticalOrigin.CENTER,
                         // // 相对于坐标的水平位置
@@ -155,7 +161,7 @@ export default {
                             positions: Cesium.Cartesian3.fromDegreesArray(oneDArray),
                         },
                         outline: false,
-                        material: Cesium.Color.fromCssColorString("rgba(10, 95, 152, 0.6)"),
+                        material: Cesium.Color.fromCssColorString(that.xzqh_color),
                         height: 100,
                         extrudedHeight: 450,