diff --git a/.eslintignore b/.eslintignore
index 787e9b3..55a9bb7 100644
--- a/.eslintignore
+++ b/.eslintignore
@@ -7,6 +7,7 @@ node_modules
.vscode
.idea
dist
+dist.zip
/public
/docs
.husky
diff --git a/package.json b/package.json
index f88ea57..0c4f684 100644
--- a/package.json
+++ b/package.json
@@ -15,6 +15,7 @@
"dependencies": {
"@amap/amap-jsapi-loader": "^1.0.1",
"@iamzzg/data-view": "^2.10.0",
+ "@turf/turf": "^6.5.0",
"autoprefixer": "^10.4.16",
"axios": "^1.6.2",
"dayjs": "^1.11.10",
diff --git a/src/assets/less/amap-item.less b/src/assets/less/amap-item.less
index a847eb7..10ea617 100644
--- a/src/assets/less/amap-item.less
+++ b/src/assets/less/amap-item.less
@@ -31,6 +31,7 @@
//marker
.amap-marker-label {
padding: 0;
+ border: none;
}
.alarm-content {
diff --git a/src/assets/less/index.less b/src/assets/less/index.less
index 3af5ff2..74facab 100644
--- a/src/assets/less/index.less
+++ b/src/assets/less/index.less
@@ -68,6 +68,11 @@
}
// 下拉框样式-start
+.ant-select.bg-000 {
+ color: #fff !important;
+ background-color: #000;
+}
+
.ant-select-dropdown {
background-color: #00152b !important;
border-right: 1px solid #1b7ef2;
diff --git a/src/assets/mapUtils/commonFun.ts b/src/assets/mapUtils/commonFun.ts
index 9cf4d99..75d8b05 100644
--- a/src/assets/mapUtils/commonFun.ts
+++ b/src/assets/mapUtils/commonFun.ts
@@ -1,5 +1,6 @@
import { mapIcon1, mapIcon2, mapIcon3, mapIcon4 } from '/@/components/chinaMap/chinaHooks.ts';
import { watchIcon } from '/@/components/secondaryScreen/secondMap/secondMapHooks.ts';
+import * as turf from '@turf/turf';
/**
* @desc 创建icon
@@ -31,7 +32,7 @@ export function typeToIcon(type: string) {
if (type == '3') {
return createIcon({ icon: mapIcon2, iconSize, imageSize });
}
- if (type == '5') {
+ if (type == '5' || type == '4') {
return createIcon({ icon: mapIcon3, iconSize, imageSize });
}
if (type == '6') {
@@ -60,3 +61,36 @@ export function createCircle(option) {
...option,
});
}
+
+export function getLonLat(result = []) {
+ let arr = [];
+ for (let i = 0; i < result.length; i++) {
+ let { lon, lat, lng } = result[i];
+ if (lng) {
+ lon = lng;
+ }
+ if (!lon || !lat) {
+ continue;
+ }
+ let point = turf.point([lon, lat]);
+ arr.push(point);
+ }
+ return arr;
+}
+
+/**
+ * @desc 根据多点算中心点
+ */
+export function getCenter(list = []) {
+ if (!list || !Array.isArray(list)) {
+ return undefined;
+ }
+ if (list.length < 1) {
+ return undefined;
+ }
+ let features = turf.featureCollection(list);
+ let centerObj = turf.center(features);
+ return centerObj?.geometry?.coordinates;
+}
+
+// export function
\ No newline at end of file
diff --git a/src/assets/mapUtils/map.ts b/src/assets/mapUtils/map.ts
index dc31a2c..da5ab03 100644
--- a/src/assets/mapUtils/map.ts
+++ b/src/assets/mapUtils/map.ts
@@ -1,17 +1,12 @@
import AMapLoader from '@amap/amap-jsapi-loader';
import china from '/@/assets/lngLat/china.ts';
import chinaInner from '/@/assets/lngLat/chinaInner.ts';
-import { createCircle, createIcon, typeToIcon } from '/@/assets/mapUtils/commonFun.ts';
+import { createCircle, createIcon, getCenter, getLonLat, typeToIcon } from '/@/assets/mapUtils/commonFun.ts';
import { aircraftContent, alarmIcon } from '/@/components/chinaMap/chinaHooks.ts';
import { isFunction } from '/@/utils/is.ts';
import { Callback, ExtDataType, InitMap, MarkerOption, ResultType } from '/@/assets/mapUtils/mapFunTypes.ts';
+import { defaultOption, getZoom, mapKey, mapPlugin } from '/@/assets/mapUtils/mapConstant.ts';
-export const defaultOption = {
- center: [106.3, 37.87], //地图中心点
- zoom: 4.3, //地图显示的缩放级别
- mapStyle: 'darkblue', //地图样式
-};
-export const mapPlugin = ['AMap.ToolBar', 'AMap.Driving', 'AMap.GeoJSON', 'AMap.MarkerCluster', 'AMap.PlaceSearch'];
let AMap = null;
export const Map = {
map: null,
@@ -29,7 +24,7 @@ export const Map = {
initMap({ el, option }: InitMap) {
return new Promise((resolve) => {
AMapLoader.load({
- key: '4bbcb216b889f2d612cbed05ae6979c8', // 申请好的Web端开发者Key,首次调用 load 时必填
+ key: mapKey, // 申请好的Web端开发者Key,首次调用 load 时必填
version: '2.0', // 指定要加载的 JSAPI 的版本,缺省时默认为 1.4.15
plugins: mapPlugin, // 需要使用的的插件列表,如比例尺'AMap.Scale'等
}).then((res) => {
@@ -40,7 +35,7 @@ export const Map = {
resizeEnable: true,
center: center,
zoom: zoom,
- mapStyle: 'amap://styles/darkblue',
+ mapStyle: 'amap://styles/' + mapStyle,
version: '2.0',
});
// 异步同时加载多个插件
@@ -105,6 +100,7 @@ export const Map = {
if (this.airMarkerList) {
this.airMarkerList = [];
}
+ this.clearActiveHospital();
// this.map.remove(this.airMarkerList);
}, //
/**
@@ -116,6 +112,10 @@ export const Map = {
createOverlay(result: ResultType[], extData?: ExtDataType, callback?: Callback) {
this.removeOverlayGroup();
this.overlayGroup = new AMap.OverlayGroup();
+ let list = getLonLat(result);
+ let center = getCenter(list);
+ let zoom = getZoom(list);
+ this.setZoomCenter(center, zoom);
for (let i = 0; i < result.length; i++) {
let { type, lon, lat, lng } = result[i];
if (lng) {
@@ -126,7 +126,6 @@ export const Map = {
}
// 创建一个 Icon
let startIcon = typeToIcon(type);
- // debugger;
// 将 icon 传入 marker
let startMarker = new AMap.Marker({
// 点的坐标
@@ -231,23 +230,24 @@ export const Map = {
this.removeOverlayGroup();
this.clearActiveHospital();
if (!cityCode) return;
- this.placeSearch = new AMap.PlaceSearch({
- pageSize: 30, // 单页显示结果条数
- pageIndex: 1, // 页码
- city: cityCode, // 兴趣点城市
- citylimit: true, //是否强制限制在设置的城市内搜索
- map: this.map, // 展现结果的地图实例
- // panel: 'map_hospital', // 结果列表将在此容器中进行展示。
- autoFitView: false, // 是否自动调整地图视野使绘制的 Marker点都处于视口的可见范围
- });
+ if (!this.placeSearch) {
+ this.placeSearch = new AMap.PlaceSearch({
+ pageSize: 30, // 单页显示结果条数
+ pageIndex: 1, // 页码
+ city: cityCode, // 兴趣点城市
+ citylimit: true, //是否强制限制在设置的城市内搜索
+ map: this.map, // 展现结果的地图实例
+ // panel: 'map_hospital', // 结果列表将在此容器中进行展示。
+ autoFitView: false, // 是否自动调整地图视野使绘制的 Marker点都处于视口的可见范围
+ });
+ }
+ this.placeSearch.setCity(cityCode);
//关键字查询
this.placeSearch.search(keywords);
},
clearActiveHospital() {
if (this.placeSearch) {
- // debugger;
this.placeSearch.clear();
- this.placeSearch = null;
}
},
createMarker(option: MarkerOption, callbck?: Callback) {
diff --git a/src/assets/mapUtils/mapConstant.ts b/src/assets/mapUtils/mapConstant.ts
new file mode 100644
index 0000000..5c1e874
--- /dev/null
+++ b/src/assets/mapUtils/mapConstant.ts
@@ -0,0 +1,22 @@
+// 地图默认配置
+export const defaultOption = {
+ center: [108.660704, 36.386058], //地图中心点
+ zoom: 6.5, //地图显示的缩放级别
+ mapStyle: 'darkblue', //地图样式
+};
+// 地图key
+export const mapKey = '4bbcb216b889f2d612cbed05ae6979c8'
+export const mapPlugin = ['AMap.ToolBar', 'AMap.Driving', 'AMap.GeoJSON', 'AMap.MarkerCluster', 'AMap.PlaceSearch'];
+
+//根据数据量设置地图层级
+export function getZoom(list = []) {
+ let len = list.length
+ // console.log('len', len)
+ if (len <= 5) {
+ return 7.5;
+ } else if (len <= 30) {
+ return 6.7;
+ } else {
+ return 7;
+ }
+}
diff --git a/src/components/body-d-left/oneL.vue b/src/components/body-d-left/oneL.vue
index d83b558..966bf9b 100644
--- a/src/components/body-d-left/oneL.vue
+++ b/src/components/body-d-left/oneL.vue
@@ -23,10 +23,10 @@