From de6fd089b37613808e5a3bef38ecc0761f7456e0 Mon Sep 17 00:00:00 2001
From: Riku <risaku@163.com>
Date: 星期日, 02 三月 2025 22:07:47 +0800
Subject: [PATCH] AOD数据产品
---
src/views/satellitetelemetry/SatelliteProxy.js | 596 +++++++++++++++++++++++++++++++++++++++++++++++++++++------
1 files changed, 531 insertions(+), 65 deletions(-)
diff --git a/src/views/satellitetelemetry/SatelliteProxy.js b/src/views/satellitetelemetry/SatelliteProxy.js
index 34657a1..9088429 100644
--- a/src/views/satellitetelemetry/SatelliteProxy.js
+++ b/src/views/satellitetelemetry/SatelliteProxy.js
@@ -1,77 +1,543 @@
import calculate from '@/utils/map/calculate';
import gridMapUtil from '@/utils/map/grid';
-import { map } from '@/utils/map/index_old';
+import { map, onMapMounted } from '@/utils/map/index_old';
-function clearAll(mapViews) {
- if (mapViews) {
- if (typeof mapViews.textViews === 'object') {
- map.remove(mapViews.textViews);
+export class SatelliteProxy {
+ // 鍦板浘缃戞牸鐩稿叧瀵硅薄
+ mapViews;
+
+ districtPolygon;
+ // 缁樺埗鍖哄幙杈圭晫
+ drawDistrict(districtName, isNew) {
+ onMapMounted(() => {
+ if (this.districtPolygon && !isNew) {
+ map.remove(this.districtPolygon);
+ map.add(this.districtPolygon);
+ } else {
+ // eslint-disable-next-line no-undef
+ var district = new AMap.DistrictSearch({
+ extensions: 'all', //杩斿洖琛屾斂鍖鸿竟鐣屽潗鏍囩瓑鍏蜂綋淇℃伅
+ level: 'district' //璁剧疆鏌ヨ琛屾斂鍖虹骇鍒负鍖�
+ });
+ district.search(districtName, (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
+ this.districtPolygon = new AMap.Polygon({
+ map: map, //鏄剧ず璇ヨ鐩栫墿鐨勫湴鍥惧璞�
+ strokeWeight: 2, //杞粨绾垮搴�
+ path: bounds[i], //澶氳竟褰㈣疆寤撶嚎鐨勮妭鐐瑰潗鏍囨暟缁�
+ fillOpacity: 0, //澶氳竟褰㈠～鍏呴�忔槑搴�
+ fillColor: '#CCF3FF', //澶氳竟褰㈠～鍏呴鑹�
+ // strokeColor: '#ffffff' //绾挎潯棰滆壊
+ strokeColor: '#0552f7', //绾挎潯棰滆壊
+ zIndex: 9
+ });
+ }
+ map.setFitView(); //灏嗚鐩栫墿璋冩暣鍒板悎閫傝閲�
+ }
+ });
+ }
+ });
+ }
+
+ clearAll(mapViews) {
+ if (mapViews) {
+ if (typeof mapViews.gridViews === 'object') {
+ map.remove(mapViews.gridViews);
+ }
}
- if (typeof mapViews.gridViews === 'object') {
- map.remove(mapViews.gridViews);
+ this.clearText(mapViews);
+ }
+
+ clearText(mapViews) {
+ if (mapViews) {
+ if (typeof mapViews.dataTxt === 'object') {
+ map.remove(mapViews.dataTxt);
+ }
+ if (typeof mapViews.dataLayer === 'object') {
+ map.remove(mapViews.dataLayer);
+ }
+ if (typeof mapViews.rankTxt === 'object') {
+ map.remove(mapViews.rankTxt);
+ }
+ if (typeof mapViews.rankLayer === 'object') {
+ map.remove(mapViews.rankLayer);
+ }
}
}
-}
-function clearText(mapViews) {
- if (mapViews && typeof mapViews.textViews === 'object') {
- map.remove(mapViews.textViews);
+ // 缁樺埗缃戞牸绾�
+ 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 drawPolyline(gridInfo) {
- // 缁樺埗缃戞牸
- const points = gridInfo.map((v) => {
- // return calculate.wgs84_To_Gcj02(v.longitude, v.latitude);
- return [v.longitude, v.latitude]
- });
- const gridPoints = gridMapUtil.parseGridPoint(points);
- const gridViews = gridMapUtil.drawPolylines(gridPoints);
- return { gridViews, gridPoints, points };
-}
-
-// 缁樺埗鐩戞祴鏁版嵁鍊�
-function drawDataText(points, gridData, textViews, labelsLayer) {
- const data = gridData.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');
-}
-
-// 缁樺埗鐩戞祴鏁版嵁鎺掑悕鏂囨湰
-function drawRankText(points, gridData, textViews, labelsLayer) {
- const data = gridData.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');
-}
-
-// 缁樺埗鐩戞祴鏁版嵁鍊煎搴旂綉鏍奸鑹�
-function drawColor(gridViews, gridData, customColor) {
- const pm25Data = gridData.map((v) => {
- return v.pm25;
- });
- if (customColor) {
- gridMapUtil.drawGridColorCustom(gridViews, pm25Data);
- } else {
- gridMapUtil.drawGridColor(gridViews, pm25Data, 'PM25');
+ // 缁樺埗鐩戞祴鏁版嵁鍊�
+ 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');
}
+
+ // 缁樺埗鐩戞祴鏁版嵁鎺掑悕鏂囨湰
+ 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');
+ }
+
+ // 缁樺埗鐩戞祴鏁版嵁鍊煎搴旂綉鏍奸鑹�
+ 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 };
+ }
+
+ // 鍗槦缃戞牸閰嶇疆鍑嗗
+ gridPrepare(gridInfo, event) {
+ // clearText(mapViews);
+ this.clearAll(this.mapViews);
+ this.mapViews = this.drawPolyline(gridInfo, event);
+ }
+
+ // 缁樺埗缃戞牸閬ユ劅鏁版嵁鍊煎拰缃戞牸棰滆壊
+ drawGrid({
+ gridData,
+ useCustomColor,
+ opacity,
+ zIndex,
+ showDataTxt,
+ showRankTxt
+ }) {
+ // SatelliteProxy.clearText(mapViews);
+ const { resGridViews, pointsRes } = this.drawColor({
+ gridViews: this.mapViews.gridViews,
+ points: this.mapViews.points,
+ gridDataDetail: gridData,
+ lastGridViews: this.mapViews.lastGridViews,
+ customColor: useCustomColor,
+ opacity: opacity,
+ zIndex: zIndex
+ });
+ this.mapViews.lastGridViews = resGridViews;
+ this.mapViews.lastPoints = pointsRes;
+
+ // 鏁版嵁鏍囪
+ const { textViews: dataTxt, labelsLayer: dataLayer } = this.drawDataText(
+ this.mapViews.lastPoints,
+ gridData,
+ this.mapViews.dataTxt,
+ this.mapViews.dataLayer
+ );
+ this.mapViews.dataTxt = dataTxt;
+ this.mapViews.dataLayer = dataLayer;
+
+ const { textViews: rankTxt, labelsLayer: rankLayer } = this.drawRankText(
+ this.mapViews.lastPoints,
+ gridData,
+ this.mapViews.rankTxt,
+ this.mapViews.rankLayer
+ );
+ this.mapViews.rankTxt = rankTxt;
+ this.mapViews.rankLayer = rankLayer;
+
+ if (showDataTxt) {
+ map.add(this.mapViews.dataTxt);
+ }
+
+ if (showRankTxt) {
+ map.add(this.mapViews.rankTxt);
+ }
+ }
+
+ // 璋冩暣鍚勭被鍦板浘瑕嗙洊鐗╃殑鍙鎬�
+ changeVisibility({ showGridViews, showDataTxt, showRankTxt }) {
+ if (showGridViews != undefined) {
+ showGridViews
+ ? map.add(this.mapViews.lastGridViews)
+ : map.remove(this.mapViews.lastGridViews);
+ }
+ if (showDataTxt != undefined) {
+ showDataTxt
+ ? map.add(this.mapViews.dataTxt)
+ : map.remove(this.mapViews.dataTxt);
+ }
+ if (showRankTxt != undefined) {
+ showRankTxt
+ ? map.add(this.mapViews.rankTxt)
+ : map.remove(this.mapViews.rankTxt);
+ }
+ }
+
+ changeGridOpacity({ isOpacity, opacityValue }) {
+ this.mapViews.lastGridViews.forEach((e) => {
+ e.setOptions({
+ fillOpacity: opacityValue ? opacityValue : isOpacity ? 0.1 : 0.7
+ });
+ });
+ }
+
+ setGridEvent(event) {
+ this.mapViews.gridViews.forEach((polygon) => {
+ event(polygon);
+ });
+ }
+
+
}
-export default {
- drawPolyline,
- drawDataText,
- drawRankText,
- drawColor,
- clearText,
- clearAll
-};
+// // 鍦板浘缃戞牸鐩稿叧瀵硅薄
+// let mapViews;
+
+// 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.gridViews === 'object') {
+// map.remove(mapViews.gridViews);
+// }
+// }
+// clearText(mapViews);
+// }
+
+// function clearText(mapViews) {
+// if (mapViews) {
+// if (typeof mapViews.dataTxt === 'object') {
+// map.remove(mapViews.dataTxt);
+// }
+// if (typeof mapViews.dataLayer === 'object') {
+// map.remove(mapViews.dataLayer);
+// }
+// if (typeof mapViews.rankTxt === 'object') {
+// map.remove(mapViews.rankTxt);
+// }
+// if (typeof mapViews.rankLayer === 'object') {
+// map.remove(mapViews.rankLayer);
+// }
+// }
+// }
+
+// // 缁樺埗缃戞牸绾�
+// 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 };
+// }
+
+// // 鍗槦缃戞牸閰嶇疆鍑嗗
+// function gridPrepare(gridInfo, event) {
+// // clearText(mapViews);
+// clearAll(mapViews);
+// mapViews = drawPolyline(gridInfo, event);
+// }
+
+// // 缁樺埗缃戞牸閬ユ劅鏁版嵁鍊煎拰缃戞牸棰滆壊
+// function drawGrid({
+// gridData,
+// useCustomColor,
+// opacity,
+// zIndex,
+// showDataTxt,
+// showRankTxt
+// }) {
+// // SatelliteProxy.clearText(mapViews);
+// const { resGridViews, pointsRes } = drawColor({
+// gridViews: mapViews.gridViews,
+// points: mapViews.points,
+// gridDataDetail: gridData,
+// lastGridViews: mapViews.lastGridViews,
+// customColor: useCustomColor,
+// opacity: opacity,
+// zIndex: zIndex
+// });
+// mapViews.lastGridViews = resGridViews;
+// mapViews.lastPoints = pointsRes;
+
+// // 鏁版嵁鏍囪
+// const { textViews: dataTxt, labelsLayer: dataLayer } = drawDataText(
+// mapViews.lastPoints,
+// gridData,
+// mapViews.dataTxt,
+// mapViews.dataLayer
+// );
+// mapViews.dataTxt = dataTxt;
+// mapViews.dataLayer = dataLayer;
+
+// const { textViews: rankTxt, labelsLayer: rankLayer } = drawRankText(
+// mapViews.lastPoints,
+// gridData,
+// mapViews.rankTxt,
+// mapViews.rankLayer
+// );
+// mapViews.rankTxt = rankTxt;
+// mapViews.rankLayer = rankLayer;
+
+// if (showDataTxt) {
+// map.add(mapViews.dataTxt);
+// }
+
+// if (showRankTxt) {
+// map.add(mapViews.rankTxt);
+// }
+// }
+
+// // 璋冩暣鍚勭被鍦板浘瑕嗙洊鐗╃殑鍙鎬�
+// function changeVisibility({ showGridViews, showDataTxt, showRankTxt }) {
+// if (showGridViews != undefined) {
+// showGridViews ? map.add(mapViews.lastGridViews) : map.remove(mapViews.lastGridViews);
+// }
+// if (showDataTxt != undefined) {
+// showDataTxt ? map.add(mapViews.dataTxt) : map.remove(mapViews.dataTxt);
+// }
+// if (showRankTxt != undefined) {
+// showRankTxt ? map.add(mapViews.rankTxt) : map.remove(mapViews.rankTxt);
+// }
+// }
+
+// function changeGridOpacity({ isOpacity, opacityValue }) {
+// mapViews.lastGridViews.forEach((e) => {
+// e.setOptions({
+// fillOpacity: opacityValue ? opacityValue : isOpacity ? 0.1 : 0.7
+// });
+// });
+// }
+
+// export default {
+// drawDistrict,
+// drawPolyline,
+// drawDataText,
+// drawRankText,
+// drawColor,
+// gridPrepare,
+// drawGrid,
+// changeVisibility,
+// changeGridOpacity,
+// clearText,
+// clearAll
+// };
--
Gitblit v1.9.3