map-ol-utils 0.1.21 → 0.1.23

package/dist/index.cjs

@@ -733,9 +733,11 @@ var import_source2 = require("ol/source");
 var import_tilegrid = require("ol/tilegrid");
 var import_layer = require("ol/layer");
 var import_WMTS = __toESM(require("ol/tilegrid/WMTS"), 1);
+var import_WebGLTile = __toESM(require("ol/layer/WebGLTile"), 1);
 var createBaseLayer = (layerName = "hzsyvector_dark") => {
-  return new import_layer.Tile({
+  const config = {
     zIndex: -5,
+    preload: 1,
     minZoom: 8,
     maxZoom: 21,
     source: new import_source.XYZ({
@@ -777,13 +779,19 @@ var createBaseLayer = (layerName = "hzsyvector_dark") => {
       _isBaseLayer: true,
       _layerName: layerName
     }
-  });
+  };
+  return isWebGLSupported() ? new import_WebGLTile.default(config) : new import_layer.Tile(config);
 };
 var createMapWorldLayer = (layerName, tk = "c77eddc667c5bed016fded560baf93e7") => {
   const [name, matrixSet] = layerName.split("_");
-  return new import_layer.Tile({
+  const config = {
     cacheSize: 20240,
     zIndex: -10,
+    preload: 1,
+    properties: {
+      _isBaseLayer: true,
+      _layerName: layerName
+    },
     source: new import_source2.WMTS({
       crossOrigin: "anonymous",
       projection: "EPSG:4326",
@@ -794,6 +802,7 @@ var createMapWorldLayer = (layerName, tk = "c77eddc667c5bed016fded560baf93e7") =
       format: "image/png",
       matrixSet,
       tileGrid: new import_WMTS.default({
+        tileSize: 256,
         origin: [-180, 90],
         matrixIds: [
           "1",
@@ -838,14 +847,10 @@ var createMapWorldLayer = (layerName, tk = "c77eddc667c5bed016fded560baf93e7") =
           2682209014892578e-21
         ]
       }),
-      tilePixelRatio: window.devicePixelRatio || 1,
       url: `https://t{0-7}.tianditu.gov.cn/${layerName}/wmts?tk=${tk}`
-    }),
-    properties: {
-      _isBaseLayer: true,
-      _layerName: layerName
-    }
-  });
+    })
+  };
+  return isWebGLSupported() ? new import_WebGLTile.default(config) : new import_layer.Tile(config);
 };
 var getLayerByName = (name) => instance.getAllLayers().find((item) => (item.get("_layerName") || item.getClassName()) === name);
 var removeLayerByName = (name) => {
@@ -1019,6 +1024,10 @@ var determineGeometryType = (coordinates) => {
     return "Invalid" /* Invalid */;
   }
 };
+var isWebGLSupported = () => {
+  const canvas = document.createElement("canvas");
+  return !!canvas.getContext("webgl") || !!canvas.getContext("experimental-webgl");
+};
 
 // src/ogc-utils.ts
 var import_source3 = require("ol/source");

package/dist/index.d.cts

@@ -9,6 +9,7 @@ import { FeatureLike } from 'ol/Feature';
 import { Emitter, EventType } from 'mitt';
 import TileLayer from 'ol/layer/Tile';
 import * as ol_renderer_Layer from 'ol/renderer/Layer';
+import WebGLTileLayer from 'ol/layer/WebGLTile';
 import * as ol_geom from 'ol/geom';
 import { SimpleGeometry, Point } from 'ol/geom';
 import { Options } from 'ol/Overlay';
@@ -124,15 +125,15 @@ declare const createWmtsLayer: (serverUrl: string) => (config: WmtsSourceOptions
 
 /**
  * 创建杭州规自地图
- * @param layerName - hzsyraster hzsyvector hzsyvector_dark
+ * @param layerName - 'hzsyraster' | 'hzsyvector' | 'hzsyvector_dark'
  */
-declare const createBaseLayer: (layerName?: HzsyType) => Tile<XYZ>;
+declare const createBaseLayer: (layerName?: HzsyType) => WebGLTileLayer | Tile<XYZ>;
 /**
  * 创建天地图
  * @param layerName - 图层名称
  * @param tk - 天地图TK
  */
-declare const createMapWorldLayer: (layerName: string, tk?: string) => Tile<WMTS>;
+declare const createMapWorldLayer: (layerName: string, tk?: string) => WebGLTileLayer | Tile<WMTS>;
 /**
  * 根据图层名称获取图层
  * @param name

package/dist/index.d.ts

@@ -9,6 +9,7 @@ import { FeatureLike } from 'ol/Feature';
 import { Emitter, EventType } from 'mitt';
 import TileLayer from 'ol/layer/Tile';
 import * as ol_renderer_Layer from 'ol/renderer/Layer';
+import WebGLTileLayer from 'ol/layer/WebGLTile';
 import * as ol_geom from 'ol/geom';
 import { SimpleGeometry, Point } from 'ol/geom';
 import { Options } from 'ol/Overlay';
@@ -124,15 +125,15 @@ declare const createWmtsLayer: (serverUrl: string) => (config: WmtsSourceOptions
 
 /**
  * 创建杭州规自地图
- * @param layerName - hzsyraster hzsyvector hzsyvector_dark
+ * @param layerName - 'hzsyraster' | 'hzsyvector' | 'hzsyvector_dark'
  */
-declare const createBaseLayer: (layerName?: HzsyType) => Tile<XYZ>;
+declare const createBaseLayer: (layerName?: HzsyType) => WebGLTileLayer | Tile<XYZ>;
 /**
  * 创建天地图
  * @param layerName - 图层名称
  * @param tk - 天地图TK
  */
-declare const createMapWorldLayer: (layerName: string, tk?: string) => Tile<WMTS>;
+declare const createMapWorldLayer: (layerName: string, tk?: string) => WebGLTileLayer | Tile<WMTS>;
 /**
  * 根据图层名称获取图层
  * @param name

package/dist/index.js

@@ -672,9 +672,11 @@ import { WMTS } from "ol/source";
 import { TileGrid } from "ol/tilegrid";
 import { Tile } from "ol/layer";
 import WMTSTileGrid from "ol/tilegrid/WMTS";
+import WebGLTileLayer from "ol/layer/WebGLTile";
 var createBaseLayer = (layerName = "hzsyvector_dark") => {
-  return new Tile({
+  const config = {
     zIndex: -5,
+    preload: 1,
     minZoom: 8,
     maxZoom: 21,
     source: new XYZ({
@@ -716,13 +718,19 @@ var createBaseLayer = (layerName = "hzsyvector_dark") => {
       _isBaseLayer: true,
       _layerName: layerName
     }
-  });
+  };
+  return isWebGLSupported() ? new WebGLTileLayer(config) : new Tile(config);
 };
 var createMapWorldLayer = (layerName, tk = "c77eddc667c5bed016fded560baf93e7") => {
   const [name, matrixSet] = layerName.split("_");
-  return new Tile({
+  const config = {
     cacheSize: 20240,
     zIndex: -10,
+    preload: 1,
+    properties: {
+      _isBaseLayer: true,
+      _layerName: layerName
+    },
     source: new WMTS({
       crossOrigin: "anonymous",
       projection: "EPSG:4326",
@@ -733,6 +741,7 @@ var createMapWorldLayer = (layerName, tk = "c77eddc667c5bed016fded560baf93e7") =
       format: "image/png",
       matrixSet,
       tileGrid: new WMTSTileGrid({
+        tileSize: 256,
         origin: [-180, 90],
         matrixIds: [
           "1",
@@ -777,14 +786,10 @@ var createMapWorldLayer = (layerName, tk = "c77eddc667c5bed016fded560baf93e7") =
           2682209014892578e-21
         ]
       }),
-      tilePixelRatio: window.devicePixelRatio || 1,
       url: `https://t{0-7}.tianditu.gov.cn/${layerName}/wmts?tk=${tk}`
-    }),
-    properties: {
-      _isBaseLayer: true,
-      _layerName: layerName
-    }
-  });
+    })
+  };
+  return isWebGLSupported() ? new WebGLTileLayer(config) : new Tile(config);
 };
 var getLayerByName = (name) => instance.getAllLayers().find((item) => (item.get("_layerName") || item.getClassName()) === name);
 var removeLayerByName = (name) => {
@@ -958,6 +963,10 @@ var determineGeometryType = (coordinates) => {
     return "Invalid" /* Invalid */;
   }
 };
+var isWebGLSupported = () => {
+  const canvas = document.createElement("canvas");
+  return !!canvas.getContext("webgl") || !!canvas.getContext("experimental-webgl");
+};
 
 // src/ogc-utils.ts
 import { WMTS as WMTS2 } from "ol/source";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "map-ol-utils",
-  "version": "0.1.21",
+  "version": "0.1.23",
   "type": "module",
   "description": "Openlayers utils library",
   "files": [