From 36d70ba5cf8508509ad8a57e4bf53bf955fddcbf Mon Sep 17 00:00:00 2001
From: ZhAkps <46207005+ZhAkps@users.noreply.github.com>
Date: 星期二, 06 二月 2024 15:50:59 +0800
Subject: [PATCH] 更改引用方式
---
src/utils/maptype.JS | 6 +-
src/components/poplayer/history.vue | 26 ++++----
src/components/sideMenu/layerTreePanel/layerTreePanel2.vue | 135 ++++++++++++++++++++++----------------------
3 files changed, 84 insertions(+), 83 deletions(-)
diff --git a/src/components/poplayer/history.vue b/src/components/poplayer/history.vue
index 8519f2e..046f495 100644
--- a/src/components/poplayer/history.vue
+++ b/src/components/poplayer/history.vue
@@ -23,15 +23,15 @@
<script>
import mapType from "@/utils/maptype";
-import { Map, View } from "ol";
-import Tile from "ol/layer/Tile";
-import WMTS from "ol/source/WMTS";
-import WMTSTileGrid from "ol/tilegrid/WMTS";
-import * as olProj from "ol/proj";
-import XYZ from "ol/source/XYZ";
+// import { Map, View } from "ol";
+// import Tile from "ol/layer/Tile";
+// import WMTS from "ol/source/WMTS";
+// import WMTSTileGrid from "ol/tilegrid/WMTS";
+// import * as olProj from "ol/proj";
+// import XYZ from "ol/source/XYZ";
-let view = new View({
- center: olProj.fromLonLat([4.606512, 2.621472]),
+let view = new ol.View({
+ center: ol.proj.fromLonLat([4.606512, 2.621472]),
zoom: 13,
enableRotation: false,
});
@@ -43,14 +43,14 @@
resolutions.push(topResolution / Math.pow(2, zoom));
matrixIds[zoom] = zoom;
}
-let LwSource = new Tile({
- source: new WMTS({
+let LwSource = new ol.layer.Tile({
+ source: new ol.source.WMTS({
url: "https://skyzt.bda.gov.cn/service/ImageEngine/picdis/abc?user=jjjskfq&password=Jjjskfq@2022",
layer: "Shiliang_Lw_2019",
style: "",
format: "image/png",
// 鎶曞奖鍧愭爣绯�
- tileGrid: new WMTSTileGrid({
+ tileGrid: new ol.tilegrid.WMTS({
extent: [371987.18334, 252920.58593, 624459.12036, 423400.07714],
origin: [0, 688194],
resolutions: resolutions,
@@ -80,7 +80,7 @@
},
mounted() {
this.mapList = mapType;
- this.tileLayer1 = new Tile({
+ this.tileLayer1 = new ol.layer.Tile({
source: this.mapList.find((e) => e.id == this.locaMap1).value,
});
// this.tileLayer2 = new Tile({
@@ -90,7 +90,7 @@
},
methods: {
initMap() {
- new Map({
+ new ol.Map({
target: "mapContainer",
layers: [
this.tileLayer1,
diff --git a/src/components/sideMenu/layerTreePanel/layerTreePanel2.vue b/src/components/sideMenu/layerTreePanel/layerTreePanel2.vue
index df8e56b..710fc02 100644
--- a/src/components/sideMenu/layerTreePanel/layerTreePanel2.vue
+++ b/src/components/sideMenu/layerTreePanel/layerTreePanel2.vue
@@ -69,19 +69,20 @@
import store from "@/utils/store2.js";
import axios from "axios";
-import Vector from "ol/source/Vector";
-import GeoJSON from "ol/format/GeoJSON";
-import Cluster from "ol/source/Cluster";
-import Style from "ol/style/Style";
-import Circle from "ol/style/Circle";
-import Stroke from "ol/style/Stroke";
-import Fill from "ol/style/Fill";
-import Text from "ol/style/Text";
-import Icon from "ol/style/Icon";
-import VectorLayer from "ol/layer/Vector";
-import ImageWMS from "ol/source/ImageWMS";
-import Image from "ol/layer/Image";
+import Vector from "ol/source/Vector";
+// import GeoJSON from "ol/format/GeoJSON";
+// import Cluster from "ol/source/Cluster";
+// import Style from "ol/style/Style";
+// import Circle from "ol/style/Circle";
+// import Stroke from "ol/style/Stroke";
+// import Fill from "ol/style/Fill";
+// import Text from "ol/style/Text";
+// import Icon from "ol/style/Icon";
+// import VectorLayer from "ol/layer/Vector";
+
+// import ImageWMS from "ol/source/ImageWMS";
+// import Image from "ol/layer/Image";
export default {
name: "LayerTreePanel",
@@ -1017,8 +1018,8 @@
// ""
// );
debugger;
- var layer = new Image({
- source: new ImageWMS({
+ var layer = new ol.layer.Image({
+ source: new ol.source.ImageWMS({
//涓嶈兘璁剧疆涓�0锛屽惁鍒欏湴鍥句笉灞曠ず銆�
ratio: 1,
url: "http://127.0.0.1:8080/geoserver/province/wms",
@@ -1868,8 +1869,8 @@
});
// 鍔犺浇 GeoJSON 鏁版嵁
- var vectorSource = new Vector({
- format: new GeoJSON(),
+ var vectorSource = new ol.source.Vector({
+ format: new ol.format.GeoJSON(),
url:
treeNode.urls +
"?version=1.3.0&request=GetFeature&format=json&typename=" +
@@ -1877,7 +1878,7 @@
});
// 鍒涘缓鑱氬悎灞�
- var clusterSource = new Cluster({
+ var clusterSource = new ol.source.Cluster({
distance: 40,
source: vectorSource,
});
@@ -1885,13 +1886,13 @@
// 鍒涘缓鑱氬悎鏄剧ず鏍峰紡
var styleCache = {};
if (treeNode.name == "璺伅鏉� ") {
- window.ldgclusterLayer = new VectorLayer({
+ window.ldgclusterLayer = new ol.layer.Vector({
source: clusterSource,
style: function (feature) {
var size = feature.get("features").length;
if (size == 1) {
- return new Style({
- image: new Icon({
+ return new ol.style.Style({
+ image: new ol.style.Icon({
anchor: [0.5, 1],
src: treeNode.image,
}),
@@ -1900,14 +1901,14 @@
if (size > 1000) {
var style = styleCache[size];
if (!style) {
- style = new Style({
- image: new Icon({
+ style = new ol.style.Style({
+ image: new ol.style.Icon({
scale: 0.4,
src: require("@/assets/img/right/test01.png"),
}),
- text: new Text({
+ text: new ol.style.Text({
text: size.toString(),
- fill: new Fill({
+ fill: new ol.style.Fill({
color: "#fff",
}),
}),
@@ -1918,15 +1919,15 @@
}
var style = styleCache[size];
if (!style) {
- style = new Style({
- image: new Icon({
+ style = new ol.style.Style({
+ image: new ol.style.Icon({
// anchor: [0.5, 1],
scale: 0.3,
src: require("@/assets/img/right/jh.png"),
}),
- text: new Text({
+ text: new ol.style.Text({
text: size.toString(),
- fill: new Fill({
+ fill: new ol.style.Fill({
color: "#fff",
}),
}),
@@ -1939,13 +1940,13 @@
window.map.addLayer(window.ldgclusterLayer);
} else if (treeNode.name == "璺悕鐗屾潌 ") {
- window.tldgclusterLayer = new VectorLayer({
+ window.tldgclusterLayer = new ol.layer.Vector({
source: clusterSource,
style: function (feature) {
var size = feature.get("features").length;
if (size == 1) {
- return new Style({
- image: new Icon({
+ return new ol.style.Style({
+ image: new ol.style.Icon({
anchor: [0.5, 1],
src: treeNode.image,
}),
@@ -1954,14 +1955,14 @@
if (size > 1000) {
var style = styleCache[size];
if (!style) {
- style = new Style({
- image: new Icon({
+ style = new ol.style.Style({
+ image: new ol.style.Icon({
scale: 0.4,
src: require("@/assets/img/right/test01.png"),
}),
- text: new Text({
+ text: new ol.style.Text({
text: size.toString(),
- fill: new Fill({
+ fill: new ol.style.Fill({
color: "#fff",
}),
}),
@@ -1972,15 +1973,15 @@
}
var style = styleCache[size];
if (!style) {
- style = new Style({
- image: new Icon({
+ style = new ol.style.Style({
+ image: new ol.style.Icon({
// anchor: [0.5, 1],
scale: 0.3,
src: require("@/assets/img/right/jh.png"),
}),
- text: new Text({
+ text: new ol.style.Text({
text: size.toString(),
- fill: new Fill({
+ fill: new ol.style.Fill({
color: "#fff",
}),
}),
@@ -2011,8 +2012,8 @@
background: "rgba(0, 0, 0, 0.7)",
});
// 鍔犺浇 GeoJSON 鏁版嵁
- var vectorSource = new Vector({
- format: new GeoJSON(),
+ var vectorSource = new ol.source.Vector({
+ format: new ol.format.GeoJSON(),
url:
treeNode.urls +
"?version=1.3.0&request=GetFeature&format=json&typename=" +
@@ -2020,20 +2021,20 @@
});
// 鍒涘缓鑱氬悎灞�
- var clusterSource = new Cluster({
+ var clusterSource = new ol.source.Cluster({
distance: 40,
source: vectorSource,
});
// 鍒涘缓鑱氬悎鏄剧ず鏍峰紡
var styleCache = {};
- window.jkspclusterLayer = new VectorLayer({
+ window.jkspclusterLayer = new ol.layer.Vector({
source: clusterSource,
style: function (feature) {
var size = feature.get("features").length;
if (size == 1) {
- return new Style({
- image: new Icon({
+ return new ol.style.Style({
+ image: new ol.style.Icon({
anchor: [0.5, 1],
src: "./static/SmartEarthSDK/Workers/image/xzspj/spjk.png",
}),
@@ -2042,15 +2043,15 @@
if (size > 1000) {
var style = styleCache[size];
if (!style) {
- style = new Style({
- image: new Icon({
+ style = new ol.style.Style({
+ image: new ol.style.Icon({
// anchor: [0.5, 1],
scale: 0.4,
src: require("@/assets/img/right/test01.png"),
}),
- text: new Text({
+ text: new ol.style.Text({
text: size.toString(),
- fill: new Fill({
+ fill: new ol.style.Fill({
color: "#fff",
}),
}),
@@ -2061,15 +2062,15 @@
}
var style = styleCache[size];
if (!style) {
- style = new Style({
- image: new Icon({
+ style = new ol.style.Style({
+ image: new ol.style.Icon({
// anchor: [0.5, 1],
scale: 0.3,
src: require("@/assets/img/right/jh.png"),
}),
- text: new Text({
+ text: new ol.style.Text({
text: size.toString(),
- fill: new Fill({
+ fill: new ol.style.Fill({
color: "#fff",
}),
}),
@@ -2285,8 +2286,8 @@
background: "rgba(0, 0, 0, 0.7)",
});
// 鍔犺浇 GeoJSON 鏁版嵁
- var vectorSource = new Vector({
- format: new GeoJSON(),
+ var vectorSource = new ol.source.Vector({
+ format: new ol.format.GeoJSON(),
url:
treeNode.urls +
"?version=1.3.0&request=GetFeature&format=json&typename=" +
@@ -2294,20 +2295,20 @@
});
// 鍒涘缓鑱氬悎灞�
- var clusterSource = new Cluster({
+ var clusterSource = new ol.source.Cluster({
distance: 40,
source: vectorSource,
});
// 鍒涘缓鑱氬悎鏄剧ず鏍峰紡
var styleCache = {};
- window.qiyeclusterLayer = new VectorLayer({
+ window.qiyeclusterLayer = new ol.layer.Vector({
source: clusterSource,
style: function (feature) {
var size = feature.get("features").length;
if (size == 1) {
- return new Style({
- image: new Icon({
+ return new ol.style.Style({
+ image: new ol.style.Icon({
anchor: [0.5, 1],
src: treeNode.image,
}),
@@ -2316,15 +2317,15 @@
if (size > 1000) {
var style = styleCache[size];
if (!style) {
- style = new Style({
- image: new Icon({
+ style = new ol.style.Style({
+ image: new ol.style.Icon({
// anchor: [0.5, 1],
scale: 0.4,
src: require("@/assets/img/right/test01.png"),
}),
- text: new Text({
+ text: new ol.style.Text({
text: size.toString(),
- fill: new Fill({
+ fill: new ol.style.Fill({
color: "#fff",
}),
}),
@@ -2335,15 +2336,15 @@
}
var style = styleCache[size];
if (!style) {
- style = new Style({
- image: new Icon({
+ style = new ol.style.Style({
+ image: new ol.style.Icon({
// anchor: [0.5, 1],
scale: 0.3,
src: require("@/assets/img/right/jh.png"),
}),
- text: new Text({
+ text: new ol.style.Text({
text: size.toString(),
- fill: new Fill({
+ fill: new ol.style.Fill({
color: "#fff",
}),
}),
diff --git a/src/utils/maptype.JS b/src/utils/maptype.JS
index 40a2bda..75e15ed 100644
--- a/src/utils/maptype.JS
+++ b/src/utils/maptype.JS
@@ -1,7 +1,7 @@
import XYZ from "ol/source/XYZ";
-import WMTS from "ol/source/WMTS";
-import WMTSTileGrid from "ol/tilegrid/WMTS";
+// import WMTS from "ol/source/WMTS";
+// import WMTSTileGrid from "ol/tilegrid/WMTS";
var topResolution = 896.0859375;
var resolutions = [];
@@ -14,7 +14,7 @@
let list = [
{
name: "2001",
- value: new XYZ({
+ value: new ol.source.XYZ({
url: "https://skyzt.bda.gov.cn/yzAdapter/Vector/?request=1&year=2001&type=Sate&level={z}&x={x}&y={y}",
}),
// value: new WMTS({
--
Gitblit v1.9.3