gisviewer-vue3-arcgis
Version:
在应用中引入私服的包， 项目根目录下 新建文件 .npmrc 在 .npmrc 中对包源进行配置：
337 lines (336 loc) • 10.8 kB
JavaScript
import * as w from "@arcgis/core/core/reactiveUtils";
import { Point as u } from "@arcgis/core/geometry";
import * as g from "@arcgis/core/geometry/support/webMercatorUtils.js";
import L from "@arcgis/core/Graphic";
import b from "@arcgis/core/layers/GraphicsLayer";
import M from "./signal-holo-flow.mjs";
class v extends M {
constructor(e, t) {
var n, a;
super(e), this.waitingAreaLayer = new b(), this.watchHandle = null, this.trajectoryDelayTime = 2, this.stopLineMap = /* @__PURE__ */ new Map(), this.waitingAreaMap = /* @__PURE__ */ new Map(), this.lampGroupMap = /* @__PURE__ */ new Map(), this.countdownPanelProps = t, this.view.map.add(this.waitingAreaLayer), this.trajectoryDelayTime = (a = (n = this.mapConfig.holoFlow) == null ? void 0 : n.signal) == null ? void 0 : a.delay, this.trajectoryDelayTime === void 0 && (this.trajectoryDelayTime = 2);
}
/**
* 读取停止线图层，将灯组面板沿着停止线放置
* @returns
*/
async initializeLayer() {
var a, o, s, i, r;
if (this.stopLineMap.size > 0)
return;
console.time("初始化停止线图层");
let e = (o = (a = this.mapConfig.holoFlow) == null ? void 0 : a.signal) == null ? void 0 : o.stopLineLayer;
if (!e)
return;
e = this.mapConfig.assetsRoot + "/" + e;
let t = await fetch(e), n = await t.json();
for (const l of n.features) {
const { roadId: c, nodeId: d } = l.properties;
let { destinationPoint: p } = l.properties;
const { coordinates: h } = l.geometry;
if (p) {
if (typeof p == "string")
try {
p = JSON.parse(p);
} catch (f) {
console.error("解析面板基准点失败", f);
continue;
}
} else {
const f = h[0], m = h[h.length - 1], y = (f[0] + m[0]) / 2, P = (f[1] + m[1]) / 2;
p = [y, P];
}
this.stopLineMap.set(`${d}_${c}`, {
coord: h,
panelPoint: p
});
}
if (console.timeEnd("初始化停止线图层"), console.time("初始化待行区图层"), e = (i = (s = this.mapConfig.holoFlow) == null ? void 0 : s.signal) == null ? void 0 : i.waitingAreaLayer, !!e) {
e = this.mapConfig.assetsRoot + "/" + e, t = await fetch(e), n = await t.json();
for (const l of n.features) {
const { roadId: c, direction: d, nodeId: p } = l.properties, { coordinates: h } = l.geometry, f = `${p}_${c}`;
this.waitingAreaMap.has(f) || this.waitingAreaMap.set(f, []), (r = this.waitingAreaMap.get(f)) == null || r.push({ coord: h, direction: d });
}
console.timeEnd("初始化待行区图层");
}
}
/**
* 初始化灯组与进口道的关联关系
*/
initializeLampGroup(e) {
const { sigId: t, lampGroupList: n } = e, a = [];
n.forEach((o) => {
const { lampGroupNo: s, lampGroupType: i, crossFlowList: r, pedList: l } = o;
if (r.length > 0)
for (const c of r) {
if (i === 81)
continue;
const d = c.upSectionId;
let p = "s";
switch (c.turn) {
case 1:
p = "s";
break;
case 2:
p = "l";
break;
case 4:
p = "r";
break;
case 8:
p = "u";
break;
}
a.push({
lampGroupId: s,
roadId: d,
dir: p
});
}
l.length > 0;
}), this.lampGroupMap.set(t, a);
}
/**
* 处理统一信控平台信号灯数据
* @param data
*/
handleUniSignalData(e) {
this.watchHandle || (this.watchHandle = w.watch(
() => this.view.extent,
() => this.updatePanelPosition()
));
const { sigId: t, runningStatus: n } = e.data.basicInfo, a = this.lampGroupMap.get(t);
if (!a)
return { status: -1, message: "灯组未初始化" };
const o = /* @__PURE__ */ new Map();
let s = !1;
switch (String(n)) {
case "4": {
s = !0, a.forEach((i) => {
const { roadId: r, dir: l } = i;
o.set(r, {
...o.get(r) || {},
[`${l}Number`]: "",
[`${l}Color`]: "yellow"
});
});
break;
}
case "5": {
a.forEach((i) => {
const { roadId: r, dir: l } = i;
o.set(r, {
...o.get(r) || {},
[`${l}Number`]: "",
[`${l}Color`]: "red"
});
});
break;
}
case "6":
case "9": {
a.forEach((i) => {
const { roadId: r, dir: l } = i;
o.set(r, {
...o.get(r) || {},
[`${l}Number`]: "",
[`${l}Color`]: "off"
});
});
break;
}
default: {
const { curSigColorInfo: i } = e.data;
i.forEach((r) => {
const l = String(r.lamgroupId), { color: c, leftTime: d } = r, p = a.find(
(h) => h.lampGroupId === l
);
if (p) {
const { roadId: h, dir: f } = p;
o.set(h, {
...o.get(h) || {},
[`${f}Number`]: d,
[`${f}Color`]: c === 1 ? "red" : c === 2 ? "yellow" : "green"
});
}
});
}
}
return this.updateLampGroupPanelStatus(t, o, s), { status: 0, message: "ok" };
}
/**
* 根据地图比例尺计算灯组面板缩放比例
*/
getPanelScale() {
const e = this.view.scale;
let t = 1;
return e < 500 ? t = 1.2 : e < 1e3 ? t = 1 : e < 2e3 ? t = 0.8 : e < 4e3 ? t = 0.4 : t = 0, t;
}
/**
* 地图移动时更新灯组面板位置
*/
updatePanelPosition() {
const e = this.getPanelScale();
for (const t of this.countdownPanelProps) {
e !== this.currentPanelScale && (t.scale = e);
const { mapPoint: n } = t;
let a = new u({
x: n[0],
y: n[1]
});
this.view.spatialReference.isWebMercator && (a = g.geographicToWebMercator(
a
));
const o = this.view.toScreen(a);
if (t.position.left = o.x, t.position.top = o.y, this.view.type === "3d") {
const s = this.getPanelRotation(t.stopLine);
t.rotation = s;
}
}
this.currentPanelScale = e;
}
doHoloSignalData(e) {
const t = e.crossId, n = e.phaseCountDownList, a = /* @__PURE__ */ new Map();
for (const o of n) {
let s = "";
for (let c of o.roadIdList)
if (c.startsWith("-") && (c = c.slice(1)), this.stopLineMap.has(`${t}_${c}`)) {
s = `${t}_${c}`;
break;
}
if (!s) {
console.log(`没有找到对应的进口道${t}--${s}`);
continue;
}
let i = a.get(s);
if (i || (i = {}, a.set(s, i)), !o.direction)
continue;
const r = o.direction.toLowerCase(), l = o.color === 1 ? "red" : o.color === 2 ? "yellow" : "green";
r === "u" ? (i.uNumber = o.leftTime, i.uColor = l) : r === "l" ? (i.lNumber = o.leftTime, i.lColor = l) : r === "s" ? (i.sNumber = o.leftTime, i.sColor = l) : r === "r" && (i.rNumber = o.leftTime, i.rColor = l);
}
this.updateLampGroupPanelStatus(t, a), this.updateWaitingArea(t, a);
}
updateWaitingArea(e, t) {
t.forEach((n, a) => {
var o;
if (n.lColor) {
let s = this.waitingAreaLayer.graphics.find(
(i) => i.attributes.roadId === a && i.attributes.direction === "l"
);
if (s)
s.attributes.color !== n.lColor && (s.attributes.color = n.lColor, s.symbol = {
type: "simple-fill",
color: this.getColor(n.lColor),
outline: {
color: this.getColor(n.lColor)
}
});
else {
const i = (o = this.waitingAreaMap.get(a)) == null ? void 0 : o.find((r) => r.direction === "l");
i && (s = new L({
geometry: { type: "polygon", rings: i.coord },
attributes: {
roadId: a,
direction: "l",
color: n.lColor
},
symbol: {
type: "simple-fill",
color: this.getColor(n.lColor),
outline: {
color: this.getColor(n.lColor)
}
}
}), this.waitingAreaLayer.add(s));
}
}
});
}
getColor(e) {
return e === "green" ? [0, 255, 0, 0.8] : e === "yellow" ? [255, 192, 2, 0.8] : [255, 0, 0, 0.8];
}
updateLampGroupPanelStatus(e, t, n = !1) {
t.forEach((a, o) => {
const s = this.stopLineMap.get(o);
if (!s)
return;
const i = this.countdownPanelProps.find(
(r) => r.roadId === o
);
if (i)
i.lampStatus = a, i.flash = n;
else {
let r = new u({
x: s.panelPoint[0],
y: s.panelPoint[1]
});
this.view.spatialReference.isWebMercator && (r = g.geographicToWebMercator(
r
));
const l = this.view.toScreen(r), c = this.getPanelRotation(s.coord);
this.countdownPanelProps.push({
displayMode: "complex",
flash: n,
crossId: e,
roadId: o,
mapPoint: s.panelPoint,
// 定位点地理坐标
stopLine: s.coord,
// 关联的停止线坐标
position: { left: l.x, top: l.y },
// 定位点屏幕坐标
rotation: c,
// 面板旋转角度
scale: this.getPanelScale(),
lampStatus: a
// 灯组状态
});
}
});
}
/**
* 处理全息流信号灯数据
* @param data
* @returns
*/
async handleHoloSignalData(e) {
this.watchHandle || (this.watchHandle = w.watch(
() => this.view.extent,
() => this.updatePanelPosition()
)), this.trajectoryDelayTime === 0 ? this.doHoloSignalData(e) : setTimeout(
() => this.doHoloSignalData(e),
this.trajectoryDelayTime * 1e3
);
}
clearSignal() {
var e;
this.waitingAreaLayer.removeAll(), this.countdownPanelProps.length = 0, (e = this.watchHandle) == null || e.remove(), this.watchHandle = null;
}
/**
* 从停止线坐标计算面板旋转角度
* @param coordinates
* @returns
*/
getPanelRotation(e) {
const t = e[0];
let n = new u({
x: t[0],
y: t[1]
});
this.view.spatialReference.isWebMercator && (n = g.geographicToWebMercator(
n
));
const a = this.view.toScreen(n), o = e[e.length - 1];
let s = new u({
x: o[0],
y: o[1]
});
this.view.spatialReference.isWebMercator && (s = g.geographicToWebMercator(
s
));
const i = this.view.toScreen(s), r = i.x - a.x, l = i.y - a.y;
return Math.atan2(l, r) * (180 / Math.PI);
}
}
export {
v as default
};