| | |
| | | <div class="map-container"> |
| | | <div class="map-content" id="map" ref="map"></div> |
| | | |
| | | |
| | | <div class="shadow"></div> |
| | | <!-- 图标菜单 --> |
| | | <div class="info-box"> |
| | | <!-- right菜单--> |
| | |
| | | |
| | | import { require } from '@/utils/require.js'; |
| | | |
| | | import icon1 from '@/assets/img/sgyfd.png'; |
| | | import icon2 from '@/assets/img/zdlytd.png'; |
| | | import icon3 from '@/assets/img/djyjq.png'; |
| | | import icon4 from '@/assets/img/jlpb.png'; |
| | | import icon5 from '@/assets/img/dwsg.png'; |
| | | import icon6 from '@/assets/img/jtysqy.png'; |
| | | import icon7 from '@/assets/img/zdlytd.png'; |
| | | import icon8 from '@/assets/img/gjxl.png'; |
| | | import icon9 from '@/assets/img/aqyh.png'; |
| | | import icon1 from '@/assets/img/icon/icon1.png'; |
| | | import icon2 from '@/assets/img/icon/icon2.png'; |
| | | import icon3 from '@/assets/img/icon/icon3.png'; |
| | | import icon4 from '@/assets/img/icon/icon4.png'; |
| | | import icon5 from '@/assets/img/icon/icon5.png'; |
| | | import icon6 from '@/assets/img/icon/icon6.png'; |
| | | import icon7 from '@/assets/img/icon/icon7.png'; |
| | | import icon8 from '@/assets/img/icon/icon8.png'; |
| | | import icon9 from '@/assets/img/icon/icon9.png'; |
| | | |
| | | |
| | | const map = ref(null); |
| | |
| | | // 创建图标 |
| | | const createIcon = (img) => { |
| | | return new AMap.Icon({ |
| | | size: new AMap.Size(34, 41), // 图标尺寸 |
| | | // size: new AMap.Size(43.8, 49.2), // 图标尺寸 |
| | | image: img, // Icon的图像 |
| | | imageSize: new AMap.Size(34, 41) // 根据所设置的大小拉伸或压缩图片 |
| | | imageSize: new AMap.Size(43.8, 49.2) // 根据所设置的大小拉伸或压缩图片 |
| | | }); |
| | | } |
| | | |
| | |
| | | height: 100%; |
| | | position: absolute; |
| | | z-index: 0; |
| | | box-shadow: inset 0px 0px 100px 18px #081729; |
| | | |
| | | .map-content { |
| | | width: 100%; |
| | |
| | | |
| | | .item-tb-img { |
| | | width: 20px; |
| | | height: 20px; |
| | | object-fit: contain; |
| | | margin-right: 5px; |
| | | } |
| | | |
| | | .info-div-p { |
| | |
| | | cursor: pointer; |
| | | |
| | | .item-tb-p { |
| | | font-family: PingFang SC; |
| | | font-family: 'PingFang SC'; |
| | | |
| | | font-weight: 400; |
| | | font-size: 16px; |
| | | color: #FFFFFF; |
| | | line-height: 42px; |
| | | } |
| | | } |
| | | |
| | | .shadow { |
| | | width: 100%; |
| | | height: 100%; |
| | | top: 0; |
| | | left: 0; |
| | | position: absolute; |
| | | box-shadow: inset 0px 0px 100px 120px #081729; |
| | | pointer-events: none; |
| | | } |
| | | |
| | | :deep(.amap-logo) { |
| | | display: none !important; |
| | | } |
| | | |
| | | :deep(.amap-copyright) { |
| | | visibility: hidden !important; |
| | | } |
| | | </style> |