| | |
|---|
| | | getLogoUrl: this.$systemconfig.basePath + '/statistic/getLogo', |
|---|
| | | findAllUrl: this.$systemconfig.basePath + '/ffzf/user/findAll', |
|---|
| | | illegalCarUrl: this.$systemconfig.basePath + '/ffzf/notice/illegalCar2', |
|---|
| | | getCarNumUrl: this.$systemconfig.basePath + '/ffzf/park/getCarNum' |
|---|
| | | }, |
|---|
| | | weizhangTimer:null, //违章list定时器 |
|---|
| | | getDataTimer:null, //统计数据定时器 |
|---|
| | |
|---|
| | | map:'', |
|---|
| | | centerLng:'114.225914', |
|---|
| | | centerLat:'36.438982', |
|---|
| | | pointNum1: '', |
|---|
| | | pointNum2: '', |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | mounted() { |
|---|
| | |
|---|
| | | this.map = map; |
|---|
| | | // let goodsData = require('../../../assets/custom_map_config.json') |
|---|
| | | // 设定地图的中心点和坐标 |
|---|
| | | let point = new BMap.Point(this.centerLng, this.centerLat); |
|---|
| | | let marker = new BMap.Marker(point) // 创建标注 |
|---|
| | | // 设置中心点坐标和地图级别 |
|---|
| | | this.map.centerAndZoom(point, 1); |
|---|
| | | // 添加自定义覆盖物 |
|---|
| | | this.map.addOverlay(marker) // 将标注添加到地图中 |
|---|
| | | // let point = new BMap.Point(this.centerLng, this.centerLat); |
|---|
| | | // let marker = new BMap.Marker(point) // 创建标注 |
|---|
| | | // // 设置中心点坐标和地图级别 |
|---|
| | | // this.map.centerAndZoom(point, 1); |
|---|
| | | // // 添加自定义覆盖物 |
|---|
| | | // this.map.addOverlay(marker) // 将标注添加到地图中 |
|---|
| | | |
|---|
| | | |
|---|
| | | const centerPoint = new BMap.Point(114.23123, 36.43123); |
|---|
| | | // 定义多点坐标 |
|---|
| | | const points = [ |
|---|
| | | {lng: 114.23123, lat: 36.43123, name: '新世纪停车场', id: 4 }, |
|---|
| | | {lng: 114.18, lat: 36.44, name: '八里方停车场', id: 36 }, |
|---|
| | | {lng: 114.21, lat: 36.43, name: '滏源堤停车场', id: 34 }, |
|---|
| | | {lng: 114.24, lat: 36.42, name: '滏阳湿地公园停车场', id: 33 }, |
|---|
| | | {lng: 114.18, lat: 36.43, name: '陶瓷博物馆停车场', id: 30 }, |
|---|
| | | {lng: 114.21, lat: 36.42, name: '风月关停车场', id: 25 }, |
|---|
| | | {lng: 114.23, lat: 36.44, name: '清泉公园停车场', id: 22 }, |
|---|
| | | {lng: 114.21222, lat: 36.43111, name: '峰峰宾馆停车场', id: 7 }, |
|---|
| | | {lng: 114.23, lat: 36.42, name: '南头村停车场', id: 20 }, |
|---|
| | | {lng: 114.24125, lat: 36.43127, name: '国土局停车场', id: 21 }, |
|---|
| | | {lng: 114.22127, lat: 36.43129, name: '人民广场地下停车场', id: 8 }, |
|---|
| | | ]; |
|---|
| | | // 添加中心点标记 |
|---|
| | | const centerMarker = new BMap.Marker(centerPoint); |
|---|
| | | this.map.addOverlay(centerMarker); |
|---|
| | | // 循环添加其他点 |
|---|
| | | points.forEach(coord => { |
|---|
| | | const point = new BMap.Point(coord.lng, coord.lat); |
|---|
| | | const marker = new BMap.Marker(point); |
|---|
| | | this.map.addOverlay(marker); |
|---|
| | | |
|---|
| | | // 添加鼠标悬停事件 |
|---|
| | | marker.addEventListener("mouseover", (e) => { |
|---|
| | | this.$byutil.postData4(this, this.pageConfig.getCarNumUrl, { parkId: coord.id }, res => { |
|---|
| | | this.pointNum1 = res.data.num // 车位总数 |
|---|
| | | this.pointNum2 = Math.floor(Number(res.data.num) - Number(res.data.carNum)); |
|---|
| | | |
|---|
| | | // 创建信息窗口内容 |
|---|
| | | const content = ` |
|---|
| | | <div style="padding:10px"> |
|---|
| | | <h4>${coord.name}</h4> |
|---|
| | | <p>车位总数: ${this.pointNum1}</p> |
|---|
| | | <p>剩余:${this.pointNum2} </p> |
|---|
| | | </div> |
|---|
| | | `; |
|---|
| | | // 创建信息窗口 |
|---|
| | | const infoWindow = new BMap.InfoWindow(content, { |
|---|
| | | width: 200, |
|---|
| | | title: "详细信息" |
|---|
| | | }); |
|---|
| | | |
|---|
| | | // 在标记点位置打开信息窗口 |
|---|
| | | marker.openInfoWindow(infoWindow, point); |
|---|
| | | }) |
|---|
| | | }); |
|---|
| | | }); |
|---|
| | | // 地图设置... |
|---|
| | | this.map.centerAndZoom(centerPoint, 1); |
|---|
| | | this.map.enableScrollWheelZoom(true); |
|---|
| | | this.map.setZoom(15); |
|---|
| | | // 自动调整视野 |
|---|
| | | const bounds = new BMap.Bounds(); |
|---|
| | | [centerPoint, ...points].forEach(p => bounds.extend(p)); |
|---|
| | | this.map.setViewport(bounds.getSouthWest(), bounds.getNorthEast()); |
|---|
| | | |
|---|
| | | |
|---|
| | | // 允许滚轮缩放 |
|---|
| | | this.map.enableScrollWheelZoom(point, 15); |
|---|
| | | // 设置地图默认缩放比例 |
|---|
