gisviewer-vue3-arcgis
Version:
在应用中引入私服的包， 项目根目录下 新建文件 .npmrc 在 .npmrc 中对包源进行配置：
175 lines (174 loc) • 6.55 kB
JavaScript
import { Polygon as f } from "@arcgis/core/geometry";
import { webMercatorToGeographic as y } from "@arcgis/core/geometry/support/webMercatorUtils";
import g from "@arcgis/core/Graphic";
import m from "@arcgis/core/layers/GraphicsLayer";
import R from "../../stores/index.mjs";
import w from "./district-controller.mjs";
import D from "./district-renderer.mjs";
import p from "./signal-renderer.mjs";
import C from "./sub-district-renderer.mjs";
class N {
// private roadLines!: IRoadLine[];
constructor(e) {
this.detachmentLayerLoaded = !1, this.view = e;
const t = R.useAppDataStore;
this.mapConfig = JSON.parse(JSON.stringify(t.mapConfig)), this.detachmentLayer = new m(), this.view.map.add(this.detachmentLayer), this.districtRenderer = new D(e), this.subDistrictRenderer = new C(e), this.signalRenderer = new p(e);
}
/**
* 显示所有区控、子区、信号机
* @param params
* @returns
*/
async showSignalControlArea(e) {
this.detachmentLayerLoaded || await this.loadDetachmentLayer(), await this.clearSignalControlArea(), this.districtRenderer.setVisible(!1), this.subDistrictRenderer.setVisible(!1), this.signalRenderer.setClusterVisible(!1), this.signalRenderer.setPointVisible(!1);
const t = [], i = [];
for (const n of e.areaList) {
const s = new w(
n,
e.style || ""
);
t.push(s), i.push(...s.subDistricts);
}
return this.districtRenderer.style = e.style || "", await this.districtRenderer.showDistricts(t), await this.subDistrictRenderer.showSubDistricts(i), await this.signalRenderer.showSignals(t), { status: 0, message: "ok" };
}
/**
* 清空区控、子区、信号机
* @returns
*/
async clearSignalControlArea() {
return await this.districtRenderer.clearDistricts(), await this.subDistrictRenderer.clearSubDistricts(), await this.signalRenderer.clearSignals(), { status: 0, message: "ok" };
}
/**
* 设置区控、子区、信号机图层可见性
* @param layerName
* @param visible
*/
setLayerVisibility(e) {
switch (e.visible === !1 && this.view.closePopup(), e.id) {
case "district":
this.districtRenderer.setVisible(e.visible);
break;
case "subDistrict":
this.subDistrictRenderer.setVisible(e.visible);
break;
case "signal":
this.signalRenderer.setPointVisible(e.visible);
break;
case "signalCluster":
this.signalRenderer.setClusterVisible(e.visible);
break;
case "shanghai_district":
this.detachmentLayer.visible = e.visible;
break;
}
return { status: 0, message: "ok" };
}
/**
* 定位区控、子区、信号机
* @param params
* @returns
*/
async locateSignalControlArea(e) {
switch (e.type) {
case "district":
return await this.districtRenderer.locateDistrict(e.id);
case "subDistrict":
return await this.subDistrictRenderer.locateSubDistrict(e.id);
case "signal":
return await this.signalRenderer.locateSignal(e.id);
default:
return { status: 1, message: "未知类型" };
}
}
/**
* 高亮指定的区控、子区、信号机，其他隐藏
* @param params
* @returns
*/
async highlightSignalControlArea(e) {
switch (this.view.closePopup(), e.type) {
case "district":
return await this.districtRenderer.highlightDistrict(e.id) ? (this.subDistrictRenderer.filter(e), this.signalRenderer.filter(e), await this.subDistrictRenderer.showRoads(e), { status: 0, message: "ok" }) : { status: 1, message: "未找到区控" };
case "subDistrict": {
const { count: t, parentId: i } = await this.subDistrictRenderer.highlightSubDistrict(e.id);
return t > 0 ? (this.districtRenderer.filter(i), this.signalRenderer.filter(e), { status: 0, message: "ok" }) : { status: 1, message: "未找到子区" };
}
case "signal": {
const { districtId: t, subDistrictId: i, count: n } = await this.signalRenderer.highlightSignal(e.id);
return n > 0 ? (this.districtRenderer.filter(t), this.subDistrictRenderer.filter(e), { status: 0, message: "ok" }) : { status: 1, message: "未找到信号机" };
}
default:
return { status: 1, message: "未知类型" };
}
}
/**
* 重置高亮，恢复全图视角
* @returns
*/
async resetHighlight() {
return this.districtRenderer.resetFilter(), this.subDistrictRenderer.resetFilter(), this.signalRenderer.resetFilter(), { status: 0, message: "ok" };
}
/**
* 加载支队图层
* 现场环境用url创建FeatureLayer有各种问题，
* 改为图层导出为json，用json创建Graphic，再将Graphic添加到FeatureLayer
*/
async loadDetachmentLayer() {
const e = this.mapConfig.baseLayers;
if (!e)
return;
const t = e.find(
(i) => i.options.id === "shanghai_district"
);
if (t)
try {
const n = await (await fetch(
"/GisViewerAssets/ShangHai/Layers/district.json"
)).json(), s = [], { renderer: r, labelingInfo: d } = t.options;
n.features.forEach((c) => {
const o = c.attributes.ZD_NAME;
if (o !== "高架支队") {
let l = new f({
rings: c.geometry.rings
});
l = y(l);
const a = new g({
geometry: l,
attributes: c.attributes
});
if (r) {
if (r.type === "simple")
a.symbol = r.symbol;
else if (r.type === "unique-value") {
const h = a.getAttribute("OBJECTID"), u = r.uniqueValueInfos.find(
(b) => b.value == h
);
a.symbol = u ? u.symbol : r.defaultSymbol;
}
} else
a.symbol = {
type: "simple-fill",
color: [227, 237, 255, 0.4],
outline: {
color: [255, 195, 153],
width: 2
}
};
if (s.push(a), d && o !== "边防港航支队" && o !== "机场支队") {
const h = new g({
geometry: l.centroid,
symbol: { ...d.symbol, text: o }
});
s.push(h);
}
}
}), this.detachmentLayer.addMany(s), this.detachmentLayerLoaded = !0;
} catch (i) {
console.error("加载支队图层失败:", i);
return;
}
}
}
export {
N as default
};