Selaa lähdekoodia

更新 首页船舶样式

wzh 3 vuotta sitten
vanhempi
commit
3edcb389a4
1 muutettua tiedostoa jossa 20 lisäystä ja 2 poistoa
  1. 20 2
      src/views/index/Index.vue

+ 20 - 2
src/views/index/Index.vue

@@ -325,12 +325,23 @@ function drawMarkers() {
       let marker = new AMap.Marker({
         content,
         position: new AMap.LngLat(i.longitude, i.latitude),
-        offset: new AMap.Pixel(-75, i.audit == 1 ? -195 : -30),
+        offset: new AMap.Pixel(-75, 30),
+      });
+      let infoWindowContent = `<div class='window-title pointer' style='font-size:12px'>${i.shipName}</div>
+      <div style='font-size:12px;margin-top:5px'>查看详情</div>
+      `;
+      let infoWindow = new AMap.InfoWindow({
+        position: new AMap.LngLat(i.longitude, i.latitude),
+        offset: new AMap.Pixel(5, 35),
+        content: infoWindowContent,
       });
 
+      marker.on("mouseover", function () {
+        infoWindow.open(map.value);
+      });
       marker.setLabel({
         direction: "top",
-        offset: new AMap.Pixel(10, 0), //设置文本标注偏移量
+        offset: new AMap.Pixel(0, 0), //设置文本标注偏移量
         content: `${i.shipName}`, //设置文本标注内容
         style: "",
       });
@@ -724,4 +735,11 @@ onMounted(() => {
 .card-5 {
   height: 50%;
 }
+
+.window-title {
+  display: none;
+}
+.window-title:hover {
+  display: block;
+}
 </style>