|
|
@@ -182,8 +182,8 @@ import { defaults as defaultControls } from "ol/control.js";
|
|
|
import GeoJSON from "ol/format/GeoJSON";
|
|
|
|
|
|
// 假设你已经有正确的山西省边界数据文件(GeoJSON 格式)
|
|
|
-import shanxiBoundary from "./shanxi.json";
|
|
|
-
|
|
|
+// import shanxiBoundary from "./shanxi.json";
|
|
|
+import shanxiBoundary from "./jilin.json";
|
|
|
import icon01 from "../../assets/img/iconFC.png";
|
|
|
import icon02 from "../../assets/img/iconFC.png";
|
|
|
import icon03 from "../../assets/img/iconFC.png";
|
|
|
@@ -270,44 +270,45 @@ export default {
|
|
|
});
|
|
|
|
|
|
// -------------【添加山西省真实边界线】------------- 定位全国的时候注释这个代码
|
|
|
- // if (this.$route.path === "/home/cockpitManage") {
|
|
|
- // // 通过导入的 JSON 文件加载边界数据(GeoJSON 格式),并解析成矢量要素
|
|
|
- // const shanxiSource = new Vector({
|
|
|
- // features: new GeoJSON().readFeatures(shanxiBoundary, {
|
|
|
- // featureProjection: "EPSG:4326",
|
|
|
- // }),
|
|
|
- // });
|
|
|
- // // 创建矢量图层,仅显示边界线(填充颜色设为透明)
|
|
|
- // const shanxiLayer = new VectorLayer({
|
|
|
- // source: shanxiSource,
|
|
|
- // style: new Style({
|
|
|
- // stroke: new Stroke({
|
|
|
- // color: "rgba(59, 130, 246, 0.5)",
|
|
|
- // width: 3,
|
|
|
- // }),
|
|
|
- // fill: new Fill({
|
|
|
- // color: "rgba(59, 130, 246, 0.05)", // 透明填充
|
|
|
- // }),
|
|
|
- // }),
|
|
|
- // });
|
|
|
- // this.map.addLayer(shanxiLayer);
|
|
|
+ if (this.$route.path === "/home/cockpitManage") {
|
|
|
+ // 通过导入的 JSON 文件加载边界数据(GeoJSON 格式),并解析成矢量要素
|
|
|
+ const shanxiSource = new Vector({
|
|
|
+ features: new GeoJSON().readFeatures(shanxiBoundary, {
|
|
|
+ featureProjection: "EPSG:4326",
|
|
|
+ }),
|
|
|
+ });
|
|
|
+ // 创建矢量图层,仅显示边界线(填充颜色设为透明)
|
|
|
+ const shanxiLayer = new VectorLayer({
|
|
|
+ source: shanxiSource,
|
|
|
+ style: new Style({
|
|
|
+ stroke: new Stroke({
|
|
|
+ color: "rgba(59, 130, 246, 0.5)",
|
|
|
+ width: 3,
|
|
|
+ }),
|
|
|
+ fill: new Fill({
|
|
|
+ color: "rgba(59, 130, 246, 0.05)", // 透明填充
|
|
|
+ }),
|
|
|
+ }),
|
|
|
+ });
|
|
|
+ this.map.addLayer(shanxiLayer);
|
|
|
|
|
|
- // const markerLayer = this.map
|
|
|
- // .getLayers()
|
|
|
- // .getArray()
|
|
|
- // .find((layer) => {
|
|
|
- // return layer.get("id") === "marker";
|
|
|
- // });
|
|
|
- // if (markerLayer) {
|
|
|
- // markerLayer.setZIndex(10);
|
|
|
- // }
|
|
|
+ const markerLayer = this.map
|
|
|
+ .getLayers()
|
|
|
+ .getArray()
|
|
|
+ .find((layer) => {
|
|
|
+ return layer.get("id") === "marker";
|
|
|
+ });
|
|
|
+ if (markerLayer) {
|
|
|
+ markerLayer.setZIndex(10);
|
|
|
+ }
|
|
|
|
|
|
- // // 同时设置高亮图层 zIndex 较低
|
|
|
- // shanxiLayer.setZIndex(1);
|
|
|
- // // -------------【结束】-------------
|
|
|
- // const targetExtent = [106.8, 34.3, 118.6, 41.2];
|
|
|
- // this.map.getView().fit(targetExtent, { duration: 2000 });
|
|
|
- // }
|
|
|
+ // 同时设置高亮图层 zIndex 较低
|
|
|
+ shanxiLayer.setZIndex(1);
|
|
|
+ // -------------【结束】-------------
|
|
|
+ // const targetExtent = [106.8, 34.3, 118.6, 41.2];//山西
|
|
|
+ const targetExtent = [119.65, 40.87, 131.31, 46.30];//吉林
|
|
|
+ this.map.getView().fit(targetExtent, { duration: 2000 });
|
|
|
+ }
|
|
|
// 这个放在外面
|
|
|
this.initEvent();
|
|
|
},
|