import calculate from '@/utils/map/calculate'; import gridMapUtil from '@/utils/map/grid'; import { map, onMapMounted } from '@/utils/map/index_old'; let districtPolygon; // 绘制区县边界 function drawDistrict(districtName, isNew) { onMapMounted(() => { if (districtPolygon && !isNew) { map.remove(districtPolygon); map.add(districtPolygon); } else { // eslint-disable-next-line no-undef var district = new AMap.DistrictSearch({ extensions: 'all', //返回行政区边界坐标等具体信息 level: 'district' //设置查询行政区级别为区 }); district.search(districtName, function (status, result) { var bounds = result.districtList[0].boundaries; //获取朝阳区的边界信息 if (bounds) { for (var i = 0; i < bounds.length; i++) { //生成行政区划 polygon // eslint-disable-next-line no-undef districtPolygon = new AMap.Polygon({ map: map, //显示该覆盖物的地图对象 strokeWeight: 2, //轮廓线宽度 path: bounds[i], //多边形轮廓线的节点坐标数组 fillOpacity: 0, //多边形填充透明度 fillColor: '#CCF3FF', //多边形填充颜色 // strokeColor: '#ffffff' //线条颜色 strokeColor: '#0552f7', //线条颜色 zIndex: 9 }); } map.setFitView(); //将覆盖物调整到合适视野 } }); } }); } function clearAll(mapViews) { if (mapViews) { if (typeof mapViews.textViews === 'object') { map.remove(mapViews.textViews); } if (typeof mapViews.gridViews === 'object') { map.remove(mapViews.gridViews); } } } function clearText(mapViews) { if (mapViews && typeof mapViews.textViews === 'object') { map.remove(mapViews.textViews); } } // 绘制网格线 function drawPolyline(gridInfo, event) { // 绘制网格 const points = gridInfo.map((v) => { return calculate.wgs84_To_Gcj02(v.longitude, v.latitude); // return [v.longitude, v.latitude]; }); // const gridPoints = gridMapUtil.parseGridPoint(points); // console.log('gridPoints:', gridPoints); const gridPoints = gridInfo.map((v, i) => { return { path: [ calculate.wgs84_To_Gcj02(v.point1Lon, v.point1Lat), calculate.wgs84_To_Gcj02(v.point2Lon, v.point2Lat), calculate.wgs84_To_Gcj02(v.point3Lon, v.point3Lat), calculate.wgs84_To_Gcj02(v.point4Lon, v.point4Lat) // [v.point1Lon, v.point1Lat], // [v.point2Lon, v.point2Lat], // [v.point3Lon, v.point3Lat], // [v.point4Lon, v.point4Lat] ] // eslint-disable-next-line no-undef .map((d) => new AMap.LngLat(d[0], d[1])), extData: points[i] }; }); const gridViews = gridMapUtil.drawPolylines({ points: gridPoints, event }); return { gridViews, gridPoints, points }; } // 绘制监测数据值 function drawDataText(points, gridDataDetail, textViews, labelsLayer) { const data = gridDataDetail.map((v, i) => { return { lnglat_GD: points[i], // data: v.pm25 ? (v.pm25 + 'μg/m³') : '' data: v.pm25 ? v.pm25 : '' }; }); // return gridMapUtil.drawGridTextLabel(data, textViews, labelsLayer, 'bottom'); return gridMapUtil.drawGridText(data, textViews, 'top-center', 'data'); } // 绘制监测数据排名文本 function drawRankText(points, gridDataDetail, textViews, labelsLayer) { const data = gridDataDetail.map((v, i) => { return { lnglat_GD: points[i], // data: v.pm25 ? ('排名: ' + v.rank) : '' data: v.pm25 ? v.rank : '' }; }); // return gridMapUtil.drawGridTextLabel(data, textViews, labelsLayer, 'top'); return gridMapUtil.drawGridText(data, textViews, 'bottom-center', 'rank'); } // 绘制监测数据值对应网格颜色 function drawColor({ gridViews, points, gridDataDetail, lastGridViews, opacity, zIndex, customColor }) { // 根据数据筛选有数据的网格 const res = []; // 以及对应的中心点坐标 const pointsRes = []; gridDataDetail.forEach((d) => { // 根据数据关联的网格编号,找到对应网格 const cellId = d.cellId; if (cellId > gridViews.length) { throw Error( '遥测数据的网格索引编号超出网格组范围,数据和网格组可能不对应' ); } res.push(gridViews[cellId - 1]); pointsRes.push(points[cellId - 1]); }); // 根据绘制颜色方式绘制网格 let resGridViews; if (customColor) { resGridViews = gridMapUtil.drawGridColorCustom( res, gridDataDetail, opacity, zIndex ); } else { resGridViews = gridMapUtil.drawGridColor( res, gridDataDetail, 'PM25', opacity, zIndex ); } if (lastGridViews) { map.remove(lastGridViews); } map.add(resGridViews); map.setFitView(resGridViews); return { resGridViews, pointsRes }; } export default { drawDistrict, drawPolyline, drawDataText, drawRankText, drawColor, clearText, clearAll };