From 478b9027e30a8ea8eba0c9360654b5f05fce62e5 Mon Sep 17 00:00:00 2001 From: ZhAkps <46207005+ZhAkps@users.noreply.github.com> Date: 星期二, 06 二月 2024 15:38:16 +0800 Subject: [PATCH] 修改引用openlayer --- src/components/viewer2.vue | 71 ++++++++++++++++++++++++----------- 1 files changed, 49 insertions(+), 22 deletions(-) diff --git a/src/components/viewer2.vue b/src/components/viewer2.vue index 158d9f6..efd53eb 100644 --- a/src/components/viewer2.vue +++ b/src/components/viewer2.vue @@ -80,13 +80,15 @@ import sliderAlpha from "./sideMenu/sliderAlpha/main.vue"; import Axios from "axios"; -import Map from "ol/Map.js"; -import TileLayer from "ol/layer/Tile.js"; -import View from "ol/View.js"; -import { get as getProjection, getTransform } from "ol/proj"; -import { getWidth, getTopLeft, applyTransform } from "ol/extent"; -import WMTS from "ol/source/WMTS"; -import WMTSTileGrid from "ol/tilegrid/WMTS"; +// import Map from "ol/Map.js"; +// import TileLayer from "ol/layer/Tile.js"; +// import View from "ol/View.js"; +// import { get as getProjection, getTransform } from "ol/proj"; +// import { getWidth, getTopLeft, applyTransform } from "ol/extent"; +// import WMTS from "ol/source/WMTS"; +// import WMTSTileGrid from "ol/tilegrid/WMTS"; +// import XYZ from "ol/source/XYZ"; +// import {createXYZ} from "ol/tilegrid"; export default { name: "viewer2", @@ -137,7 +139,7 @@ this.$nextTick(function () { console.log("openlayer init"); - Map.prototype.getLayerByName = function (name) { + ol.Map.prototype.getLayerByName = function (name) { var layer; this.getLayers().array_.forEach(function (lyr) { if (name == lyr.values_.name) { @@ -157,13 +159,13 @@ let _key = TDTKey; let _matrixSets = options.matrixSets; - let projection = getProjection(_proj); + let projection = ol.proj.get(_proj); let projectionExtent = projection.getExtent(); - let origin = projectionExtent ? getTopLeft(projectionExtent) : [-180, 90]; - let fromLonLat = getTransform("EPSG:4326", projection); + let origin = projectionExtent ? ol.extent.getTopLeft(projectionExtent) : [-180, 90]; + let fromLonLat = ol.proj.getTransform("EPSG:4326", projection); let width = projectionExtent - ? getWidth(projectionExtent) - : getWidth(applyTransform([-180.0, -90.0, 180.0, 90.0], fromLonLat)); + ? ol.extent.getWidth(projectionExtent) + : ol.extent.getWidth(ol.extent.applyTransform([-180.0, -90.0, 180.0, 90.0], fromLonLat)); let resolutions = []; let matrixIds = []; @@ -171,7 +173,7 @@ resolutions[z] = width / (256 * Math.pow(2, z)); matrixIds[z] = z; } - let wmtsTileGrid = new WMTSTileGrid({ + let wmtsTileGrid = new ol.tilegrid.WMTS({ origin: origin, resolutions: resolutions, matrixIds: matrixIds, @@ -180,7 +182,7 @@ "url:", `${tiandituUrl}/${_layer}_${_matrixSets}/wmts?tk=${_key}` ); - let wmtsSource = new WMTS({ + let wmtsSource = new ol.source.WMTS({ url: `${tiandituUrl}/${_layer}_${_matrixSets}/wmts?tk=${_key}`, layer: _layer, version: "1.0.0", @@ -191,13 +193,13 @@ style: "default", tileGrid: wmtsTileGrid, }); - let wmtsLayer = new TileLayer({ + let wmtsLayer = new ol.layer.Tile({ name: "褰卞儚鍦板浘", id: _layer + "_" + _matrixSets, source: wmtsSource, }); - let wmtsSource1 = new WMTS({ + let wmtsSource1 = new ol.source.WMTS({ url: `${tiandituUrl}/cia_${_matrixSets}/wmts?tk=${_key}`, layer: "cia", version: "1.0.0", @@ -208,13 +210,13 @@ style: "default", tileGrid: wmtsTileGrid, }); - let wmtsLayer1 = new TileLayer({ + let wmtsLayer1 = new ol.layer.Tile({ name: "璺綉鍥惧眰", id: "cia_c", source: wmtsSource1, }); - let wmtsSource2 = new WMTS({ + let wmtsSource2 = new ol.source.WMTS({ url: `${tiandituUrl}/vec_c/wmts?tk=${_key}`, layer: "vec", version: "1.0.0", @@ -225,7 +227,7 @@ style: "default", tileGrid: wmtsTileGrid, }); - let wmtsLayer2 = new TileLayer({ + let wmtsLayer2 = new ol.layer.Tile({ name: "浜岀淮鍦板浘", id: "cva_c", source: wmtsSource2, @@ -238,10 +240,10 @@ ////璺綉 layers.push(wmtsLayer1); - const map = new Map({ + const map = new ol.Map({ layers: layers, target: "openlayerContainer", - view: new View({ + view: new ol.View({ center: [116.505348, 39.795592], projection: "EPSG:4326", zoom: 12, @@ -250,6 +252,31 @@ window.map = map; + // var url = + // "https://skyzt.bda.gov.cn/gisserver/tmsserver/chengshiguihua_dikuaibianhao_tms/"; + + // var tmslayer = new ol.layer.Tile({ + // source: new ol.source.XYZ({ + // projection: projection, + // tileGrid: ol.tilegrid.createXYZ({ + // extent: [50.731, -90, 180, 70.0478], + // }), + // tileUrlFunction: function (tileCoord, pixelRatio, proj) { + // // return url + (tileCoord[0] - 1) + '/' + tileCoord[1] + '/' + (Math.pow(2, tileCoord[0] - 1) + tileCoord[2]) + '.jpeg'; + // return ( + // url + + // (tileCoord[0] - 1) + + // "/" + + // tileCoord[1] + + // "/" + + // (Math.pow(2, tileCoord[0] - 1) + tileCoord[2]) + + // ".jpeg" + // ); + // }, + // }), + // }); + // window.map.addLayer(tmslayer); + window.layerOpen = function (name, options) { layuiLayer.close(SmartEarthPopupData.layerProp); -- Gitblit v1.9.3