export class MapCustom { drawResolve = null; constructor(data) { this.map = new AMap.Map(data.dom, { version: "1.4.15", zoom: 13, center: data.center || [116.397428, 39.90923], //初始化地图中心点 ...data, }); } // 多边形回显 polyEditor(list, fn) { this.map.clearMap(); let pathList = []; list.forEach((item, index) => { let lngLat = new AMap.LngLat(item.lng, item.lat); pathList.push(lngLat); }); const circle = new AMap.Polygon({ map: this.map, path: pathList, // 圆心位置 strokeWeight: 2, strokeStyle: "solid", fillColor: "#00aeff57", strokeColor: "#00AEFF", //描边颜色 fillOpacity: 0.3, //填充透明度 }); let PolygonEditor = new AMap.PolyEditor(this.map, circle); PolygonEditor.open(); PolygonEditor.on("adjust", (event) => { const pathList = event.target.getPath(); let list = []; pathList.forEach((e, i) => { list.push({ lat: e.lat, lng: e.lng }); }); fn && fn(list); // this.ruleForm.points = list; }); } draw() { return new Promise((resolve) => { this.drawResolve = resolve; this.map.clearMap(); let list = []; let mouseTool = new AMap.MouseTool(this.map); // mouseTool.rectangle(); mouseTool.polygon({ center: ["116.368074", "39.927925"], fillColor: "#00aeff57", strokeColor: "#00AEFF", //描边颜色 strokeWeight: 2, strokeStyle: "solid", }); mouseTool.on("draw", (event) => { event.obj.getPath().forEach((e, i) => { list.push({ lat: e.lat, lng: e.lng }); }); mouseTool.close(false); this.drawResolve(list); }); }); } track(list) { let markerList = [] let lineArr = list.map((item) => [item.lng, item.lat]) const newIcon = this.map.icon({ size: new AMap.Size(50, 50), image: require('../../../assets/location.png'), // Icon的图像 imageSize: new AMap.Size(50, 50) }) list.forEach((item, index) => { let marker = this.map.marker({ position: this.map.lngLat(item.lng, item.lat), icon: newIcon, // 添加 Icon 图标 URL offset: new AMap.Pixel(-25, -50) }) marker.setMap(this.map) markerList.push(marker) marker.on('click', () => { this.studentInfo = item this.InfoWindow = this.map.infoWindow({ anchor: 'bottom-center', isCustom: true, //使用自定义窗体 content: document.querySelector('.infoBox'), offset: new AMap.Pixel(0, -90) }) this.InfoWindow.open(this.map, marker.getPosition()) }) }) this.map.polyline({ map: this.map, path: lineArr, showDir: true, strokeColor: '#28F', //线颜色 strokeWeight: 6 //线宽 }) } newIcon(url) { return new AMap.Icon({ size: new AMap.Size(36, 42), image: url, // Icon的图像 imageSize: new AMap.Size(36, 42) }) } // 创建marker marker({ icon, position }) { return new AMap.Marker({ icon, position, map: this.map, offset: new AMap.Pixel(-25, -50), }) } lngLat(lng, lat) { return new AMap.LngLat(lng, lat); } clearMap() { this.map.clearMap(); } }