Niko
/
sy-water-data-board-ui
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

fix: 提交点选查询代码

feature-v1.0.0
chenhaojie 1 month ago
parent
444062e085
commit
75ec10f4c0
1 changed files with 112 additions and 99 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 211
      src/hooks/web/useProject.tsx

211
src/hooks/web/useProject.tsx
View File

@ -1,8 +1,10 @@
import { reactive } from "vue"; import { reactive } from "vue";
import * as SyCim from "sy-cesium-sdk"; import * as SyCim from "sy-cesium-sdk";
import { LayerTypeEnum } from "@/enums/projectEnum"; import { LayerTypeEnum } from "@/enums/projectEnum";
import { queryLayersByPos } from "@/utils/mapUtils";
import axios from "axios"; import axios from "axios";
import { throttle } from "lodash-es"; import { throttle } from "lodash-es";
import { useProjectStore } from "@/store/modules/project";
const clustering = reactive({ const clustering = reactive({
enabled: true, enabled: true,
pixelRange: 200, pixelRange: 200,
@ -272,19 +274,30 @@ const baseLayerActions: Record<string, any> = {
}; };
export function useLayer() { export function useLayer() {
const mouseMoveEvent = throttle((e: any) => { const viewerClickEvent = throttle((e: any) => {
const winPos = e.windowPosition; if (!e.wgs84SurfacePosition) return;
const target = viewer.scene.pick(winPos); const projectStore = useProjectStore();
console.log(target); const selectLayers: any = projectStore.selectedLayers;
// .filter((item: any) => item.isNeedCluster === "1");
queryLayersByPos(e.wgs84SurfacePosition, selectLayers, (res: any) => {
if (res?.attributes?.showCode) {
const { showCode, showName, scale } = res?.attributes;
window.$bus.$emit("open-water-dialog", {
code: showCode,
name: showName,
scale
});
}
});
}, 500); }, 500);
const addMouseMove = () => { const addViewerClick = () => {
window.viewer?.on(SyCim.MouseEventType.MOUSE_MOVE, mouseMoveEvent, window.viewer); window.viewer?.on(SyCim.MouseEventType.CLICK, viewerClickEvent, window.viewer);
}; };
const removeMouseMove = () => { const removeViewerClick = () => {
window.viewer?.off(SyCim.MouseEventType.MOUSE_MOVE, mouseMoveEvent, window.viewer); window.viewer?.off(SyCim.MouseEventType.CLICK, viewerClickEvent, window.viewer);
}; };
const addLayer = async (layerData: any) => { const addLayer = async (layerData: any) => {
// removeMouseMove(); removeViewerClick();
const { layerType, url, id, isNeedCluster } = layerData; const { layerType, url, id, isNeedCluster } = layerData;
let action = null; let action = null;
// 超图 S3M图层 // 超图 S3M图层
@ -308,93 +321,93 @@ export function useLayer() {
} }
if (!layerType || !(action = layerActions[layerType as string])) return; if (!layerType || !(action = layerActions[layerType as string])) return;
let layer: any = await action(layerData); let layer: any = await action(layerData);
if (isNeedCluster === "1") { // if (isNeedCluster === "1") {
let baseUrl = import.meta.env.VITE_BASE_URL; // let baseUrl = import.meta.env.VITE_BASE_URL;
const data = await getFeatures(layerData); // const data = await getFeatures(layerData);
if (data?.features?.[0]?.geometry?.type === 'Point') { // if (data?.features?.[0]?.geometry?.type === 'Point') {
let layerConfig = {}; // let layerConfig = {};
switch (layerData.nameCn) { // switch (layerData.nameCn) {
case "水库点": // case "水库点":
layerConfig = { // layerConfig = {
isUniqueRender: true, // isUniqueRender: true,
field: "ENG_SCAL", // field: "ENG_SCAL",
fieldOptions: [ // fieldOptions: [
{ name: "1.0", attr: "image", value: "reservoir_big.png" }, // { name: "1.0", attr: "image", value: "reservoir_big.png" },
{ name: "2.0", attr: "image", value: "reservoir_big.png" }, // { name: "2.0", attr: "image", value: "reservoir_big.png" },
{ name: "3.0", attr: "image", value: "reservoir_normal.png" }, // { name: "3.0", attr: "image", value: "reservoir_normal.png" },
{ name: "4.0", attr: "image", value: "reservoir_small.png" }, // { name: "4.0", attr: "image", value: "reservoir_small.png" },
{ name: "5.0", attr: "image", value: "reservoir_small.png" }, // { name: "5.0", attr: "image", value: "reservoir_small.png" },
], // ],
width: 24, // width: 24,
height: 24, // height: 24,
image: "reservoir_big.png", // image: "reservoir_big.png",
}; // };
break; // break;
case "水闸": // case "水闸":
layerConfig = { // layerConfig = {
isUniqueRender: true, // isUniqueRender: true,
field: "ENG_SCAL", // field: "ENG_SCAL",
fieldOptions: [ // fieldOptions: [
{ name: "1.0", attr: "image", value: "sluice_big.png" }, // { name: "1.0", attr: "image", value: "sluice_big.png" },
{ name: "2.0", attr: "image", value: "sluice_big.png" }, // { name: "2.0", attr: "image", value: "sluice_big.png" },
{ name: "3.0", attr: "image", value: "sluice_middle.png" }, // { name: "3.0", attr: "image", value: "sluice_middle.png" },
{ name: "4.0", attr: "image", value: "sluice_small.png" }, // { name: "4.0", attr: "image", value: "sluice_small.png" },
{ name: "5.0", attr: "image", value: "sluice_small.png" }, // { name: "5.0", attr: "image", value: "sluice_small.png" },
], // ],
image: "sluice_middle.png", // image: "sluice_middle.png",
}; // };
break; // break;
} // }
layer = new SyCim.ClusterWfsLayer(layerData.id, { // layer = new SyCim.ClusterWfsLayer(layerData.id, {
data, // data,
symbol: { // symbol: {
type: "billboardP", // type: "billboardP",
imageProxy: `${baseUrl}/img/map/`, // 图片代理 // imageProxy: `${baseUrl}/img/map/`, // 图片代理
style: { // style: {
clampToGround: true, // clampToGround: true,
image: "reservoir_small.png", // image: "reservoir_small.png",
...layerConfig, // ...layerConfig,
}, // },
clustering: { // clustering: {
enabled: clustering.enabled, // enabled: clustering.enabled,
pixelRange: clustering.pixelRange, // pixelRange: clustering.pixelRange,
minimumClusterSize: clustering.minimumClusterSize, // minimumClusterSize: clustering.minimumClusterSize,
clusterEvent: undefined, // clusterEvent: undefined,
clusterColors: undefined, // 聚合点颜色 // clusterColors: undefined, // 聚合点颜色
getImage: undefined, // 获取聚合图片的函数 // getImage: undefined, // 获取聚合图片的函数
}, // },
}, // },
}); // });
layer.bindPopup( // layer.bindPopup(
(e: any) => { // (e: any) => {
const graphic = e.graphic; // const graphic = e.graphic;
if (graphic) { // if (graphic) {
const attr = graphic?.attr; // const attr = graphic?.attr;
const code = attr?.RES_CODE ?? attr?.WAGA_CODE; // const code = attr?.RES_CODE ?? attr?.WAGA_CODE;
const name = attr?.RES_NAME ?? attr?.WAGA_NAME; // const name = attr?.RES_NAME ?? attr?.WAGA_NAME;
const scale = attr?.ENG_SCAL ?? attr?.WAGA_TYPE; // const scale = attr?.ENG_SCAL ?? attr?.WAGA_TYPE;
if (attr?.RES_CODE) { // if (attr?.RES_CODE) {
window.$bus.$emit("open-water-dialog", { // window.$bus.$emit("open-water-dialog", {
code, // code,
name, // name,
scale // scale
}); // });
return ""; // return "";
} else { // } else {
return `<div class="box"> // return `<div class="box">
<div class="detail-item"><span>水闸名称</span>：${name}</div> // <div class="detail-item"><span>水闸名称</span>：${name}</div>
<div class="detail-item"><span>水闸编码</span>：${code}</div> // <div class="detail-item"><span>水闸编码</span>：${code}</div>
<div class="detail-item"><span>水闸位置</span>：${attr.WAGA_LOC}</div> // <div class="detail-item"><span>水闸位置</span>：${attr.WAGA_LOC}</div>
</div>`; // </div>`;
} // }
} // }
}, // },
{ // {
closeButton: true, // closeButton: true,
}, // },
); // );
} // }
} // }
layer && window.viewer.addLayer(layer); layer && window.viewer.addLayer(layer);
if (["013000"].includes(layerType)) { if (["013000"].includes(layerType)) {
// 3d tiles // 3d tiles
@ -412,7 +425,7 @@ export function useLayer() {
model.id = layerData.id; model.id = layerData.id;
layer.addGraphic(model); layer.addGraphic(model);
} }
// addMouseMove(); addViewerClick();
}; };
const removeLayer = (layerData: any) => { const removeLayer = (layerData: any) => {
const { id, layerType, isNeedCluster } = layerData; const { id, layerType, isNeedCluster } = layerData;
@ -447,8 +460,8 @@ export function useLayer() {
addLayer, addLayer,
removeLayer, removeLayer,
zoomToLayer, zoomToLayer,
addMouseMove, addViewerClick,
removeMouseMove, removeViewerClick,
}; };
} }

Write Preview
Loading…
Cancel
Save