From be9c1145fc79165142fbe29aacb04dd8e34dd23f Mon Sep 17 00:00:00 2001
From: guonan <guonan201020@163.com>
Date: 星期二, 17 六月 2025 17:32:29 +0800
Subject: [PATCH] 避险场所以及完善弹窗详情
---
src/utils/area.js | 187 ++++++++++++++++++++++++----------------------
1 files changed, 96 insertions(+), 91 deletions(-)
diff --git a/src/utils/area.js b/src/utils/area.js
index eb44444..c4bcf7c 100644
--- a/src/utils/area.js
+++ b/src/utils/area.js
@@ -1,112 +1,116 @@
let areaPrimitives = []
let areaDataSource = []
-export function loadAreaPolygon(url, isPolluted = false) {
- let color = new Cesium.Color(1.0, 0.0, 0.0, 0.1)
+/**
+ * 灏嗛伩闄╁満鎵�鏁版嵁杞负 GeoJSON FeatureCollection
+ */
+export function convertToGeoJson(data, offset = 0.0001) {
+ const features = data.map((item) => {
+ const lon = parseFloat(item.lon);
+ const lat = parseFloat(item.lat);
+
+ // 鏋勯�犱竴涓皬姝ｆ柟褰㈠尯鍩燂紙5绫冲乏鍙筹級
+ const coordinates = [
+ [
+ [lon, lat],
+ [lon + offset, lat],
+ [lon + offset, lat - offset],
+ [lon, lat - offset],
+ [lon, lat],
+ ],
+ ];
+
+ return {
+ type: "Feature",
+ properties: {
+ id: item.safeHavenId,
+ name: item.safeHavenName,
+ locationInfo: item.locationInfo,
+ area: item.area,
+ safeHavenType: item.safeHavenType,
+ accommodatePersonNum: item.accommodatePersonNum,
+ planResettlementPersonNum: item.planResettlementPersonNum,
+ materialReserve: item.materialReserve,
+ remark: item.remark,
+ },
+ geometry: {
+ type: "MultiPolygon",
+ coordinates: [coordinates],
+ },
+ };
+ });
+
+ return {
+ type: "FeatureCollection",
+ name: "emergency_area",
+ crs: {
+ type: "name",
+ properties: {
+ name: "urn:ogc:def:crs:OGC:1.3:CRS84",
+ },
+ },
+ features,
+ };
+}
+
+
+export function loadAreaPolygon(geoJsonData, isPolluted = false) {
+ let color = new Cesium.Color(1.0, 0.0, 0.0, 0.1);
if (isPolluted) {
- color = Cesium.Color.GREEN
+ color = Cesium.Color.GREEN;
}
+
// 浣跨敤 GeoJsonDataSource 鍔犺浇 GeoJSON 鏁版嵁
- const dataSourcePromise = Cesium.GeoJsonDataSource.load(url, {
+ const dataSourcePromise = Cesium.GeoJsonDataSource.load(geoJsonData, {
clampToGround: true,
- })
+ });
// 鑾峰彇 GeoJSON 涓殑绗竴涓� Polygon feature
return dataSourcePromise.then(function (dataSource) {
- viewer.dataSources.add(dataSource)
- // console.log("dataSource", dataSource)
- // 鑾峰彇 GeoJSON 涓殑绗竴涓� Polygon feature
- areaDataSource.push(dataSource)
+ viewer.dataSources.add(dataSource);
+ areaDataSource.push(dataSource);
- // const polygonEntity = dataSource.entities.values[0]
- // let areaPrimitive = createAreaPolygon(polygonEntity, color)
- // areaPrimitives.push(areaPrimitive)
-
- // return areaPrimitive
-
- const polygonEntity = dataSource.entities.values
- // console.log("polygonEntity", polygonEntity)
- const distanceDisplayCondition = new Cesium.DistanceDisplayCondition(1000, 50000000)
+ const polygonEntity = dataSource.entities.values;
+ const distanceDisplayCondition = new Cesium.DistanceDisplayCondition(1000, 50000000);
polygonEntity.forEach(entity => {
- // console.log("entity", entity)
+ entity.polygon.material = new Cesium.ColorMaterialProperty(color);
- entity.polygon.material = new Cesium.ColorMaterialProperty(
- // Cesium.Color.LIGHTSTEELBLUE.withAlpha(0.2)
- color
- // new Cesium.Color.fromCssColorString("#0f2636b3")
- // Cesium.Color.fromRandom({
- // alpha: 0.5,
- // minimumAlpha: 0.2,
- // maximumAlpha: 0.9,
- // })
- )
+ const properties = entity.properties;
+ const fullname = properties.name.getValue();
- // entity.polygon.distanceDisplayCondition = distanceDisplayCondition
+ const positions = entity.polygon.hierarchy._value.positions;
- const properties = entity.properties
- const fullname = properties.name.getValue()
-
- const positions = entity.polygon.hierarchy._value.positions
-
- // entity.position = positions
entity.label = {
- // 鏂囨湰銆傛敮鎸佹樉寮忔崲琛岀鈥� \ n鈥�
text: fullname || "榛樿鏍囩",
- // 瀛椾綋鏍峰紡锛屼互CSS璇硶鎸囧畾瀛椾綋
font: "20pt Source Han Sans CN",
- // 瀛椾綋棰滆壊
-
fillColor: Cesium.Color.WHITE,
- // 鑳屾櫙棰滆壊
backgroundColor: Cesium.Color.BLACK.withAlpha(0.8),
- // 鏄惁鏄剧ず鑳屾櫙棰滆壊
showBackground: false,
- // 瀛椾綋杈规
outline: true,
- // 瀛椾綋杈规棰滆壊
outlineColor: Cesium.Color.WHITE,
- // 瀛椾綋杈规灏哄
outlineWidth: 0,
- // 搴旂敤浜庡浘鍍忕殑缁熶竴姣斾緥銆傛瘮渚嬪ぇ浜庝細1.0鏀惧ぇ鏍囩锛岃�屾瘮渚嬪皬浜庝細1.0缂╁皬鏍囩銆�
scale: 1.0,
scaleByDistance: new Cesium.NearFarScalar(1.5e2, 1.0, 1.5e7, 0.5),
- // 璁剧疆鏍峰紡锛欶ILL锛氬～鍐欐爣绛剧殑鏂囨湰锛屼絾涓嶈鍕惧嫆杞粨锛汷UTLINE锛氭杩版爣绛剧殑鏂囨湰锛屼絾涓嶈濉啓锛汧ILL_AND_OUTLINE锛氬～鍐欏苟姒傝堪鏍囩鏂囨湰銆�
style: Cesium.LabelStyle.FILL_AND_OUTLINE,
- // 鐩稿浜庡潗鏍囩殑姘村钩浣嶇疆
verticalOrigin: Cesium.VerticalOrigin.CENTER,
- // 鐩稿浜庡潗鏍囩殑姘村钩浣嶇疆
horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
- // 璇ュ睘鎬ф寚瀹氭爣绛惧湪灞忓箷绌洪棿涓窛姝ゆ爣绛惧師鐐圭殑鍍忕礌鍋忕Щ閲�
pixelOffset: new Cesium.Cartesian2(0, 0),
- // pixelOffset: new Cesium.Cartesian2(0, 0),
- // 鏄剧ず鍦ㄨ窛鐩告満鐨勮窛绂诲鐨勫睘鎬э紝澶氬皯鍖洪棿鍐呮槸鍙互鏄剧ず鐨�
- // distanceDisplayCondition: distanceDisplayCondition,
- // : new Cesium.DistanceDisplayCondition(0, 50000),
heightReference: Cesium.HeightReference.RELATIVE_TO_GROUND,
disableDepthTestDistance: Number.POSITIVE_INFINITY,
- // 鏄惁鏄剧ず
show: true,
- }
+ };
entity.polyline = {
positions: positions,
width: 2,
- material: new Cesium.ColorMaterialProperty(
- Cesium.Color.YELLOW
- // Cesium.Color.fromRandom({
- // alpha: 0.5,
- // minimumAlpha: 0.2,
- // maximumAlpha: 0.9,
- // })
- ),
+ material: new Cesium.ColorMaterialProperty(Cesium.Color.YELLOW),
clampToGround: true,
- // distanceDisplayCondition: distanceDisplayCondition,
- }
+ };
- viewer.entities.add(entity)
- })
+ viewer.entities.add(entity);
+ });
- return polygonEntity
- })
+ return polygonEntity;
+ });
}
function createAreaPolygon(polygonEntity, color, height) {
if (!polygonEntity) return
@@ -140,29 +144,29 @@
}
export function clearAreaPolygon() {
- // 1. 娓呴櫎閫氳繃 viewer.entities 娣诲姞鐨勫疄浣�
- if (Array.isArray(areaDataSource)) {
- areaDataSource.forEach(dataSource => {
- // 绉婚櫎鏁版嵁婧愪腑鐨勬墍鏈夊疄浣�
- dataSource.entities.values.forEach(entity => {
- viewer.entities.remove(entity);
- });
- // 绉婚櫎鏁版嵁婧愭湰韬�
- viewer.dataSources.remove(dataSource);
- });
- areaDataSource = [];
- }
+ // 1. 娓呴櫎閫氳繃 viewer.entities 娣诲姞鐨勫疄浣�
+ if (Array.isArray(areaDataSource)) {
+ areaDataSource.forEach(dataSource => {
+ // 绉婚櫎鏁版嵁婧愪腑鐨勬墍鏈夊疄浣�
+ dataSource.entities.values.forEach(entity => {
+ viewer.entities.remove(entity);
+ });
+ // 绉婚櫎鏁版嵁婧愭湰韬�
+ viewer.dataSources.remove(dataSource);
+ });
+ areaDataSource = [];
+ }
- // 2. 娓呴櫎閫氳繃 viewer.scene.primitives 娣诲姞鐨勫浘鍏�
- if (Array.isArray(areaPrimitives)) {
- areaPrimitives.forEach(primitive => {
- viewer.scene.primitives.remove(primitive);
- });
- areaPrimitives = [];
- }
+ // 2. 娓呴櫎閫氳繃 viewer.scene.primitives 娣诲姞鐨勫浘鍏�
+ if (Array.isArray(areaPrimitives)) {
+ areaPrimitives.forEach(primitive => {
+ viewer.scene.primitives.remove(primitive);
+ });
+ areaPrimitives = [];
+ }
- // 3. 寮哄埗鍦烘櫙閲嶇粯
- viewer.scene.requestRender();
+ // 3. 寮哄埗鍦烘櫙閲嶇粯
+ viewer.scene.requestRender();
}
export function initAreaLine() {
@@ -236,3 +240,4 @@
})
viewer.dataSources.add(dataSourcePromise)
}
+
--
Gitblit v1.9.3