map-ol-utils 0.1.20 → 0.1.22

package/dist/index.cjs

@@ -700,7 +700,6 @@ var createClusterLayer = (dataList, config) => {
   };
   const vectorLayer = new import_Vector.default({
     zIndex: 200,
-    style: (feature) => buildStyle ? buildStyle(feature) : innerBuildStyle(feature),
     source: new import_Cluster.default({
       distance: distance || 80,
       minDistance: minDistance || 0,
@@ -711,7 +710,8 @@ var createClusterLayer = (dataList, config) => {
           return feature;
         })
       })
-    })
+    }),
+    style: (feature) => buildStyle ? buildStyle(feature) : innerBuildStyle(feature)
   });
   vectorLayer.setProperties({
     _isCustom: true,
@@ -733,8 +733,9 @@ 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,
     minZoom: 8,
     maxZoom: 21,
@@ -777,13 +778,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",
@@ -840,12 +847,9 @@ var createMapWorldLayer = (layerName, tk = "c77eddc667c5bed016fded560baf93e7") =
       }),
       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 +1023,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';
@@ -126,13 +127,13 @@ declare const createWmtsLayer: (serverUrl: string) => (config: WmtsSourceOptions
  * 创建杭州规自地图
  * @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';
@@ -126,13 +127,13 @@ declare const createWmtsLayer: (serverUrl: string) => (config: WmtsSourceOptions
  * 创建杭州规自地图
  * @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

@@ -639,7 +639,6 @@ var createClusterLayer = (dataList, config) => {
   };
   const vectorLayer = new VectorLayer({
     zIndex: 200,
-    style: (feature) => buildStyle ? buildStyle(feature) : innerBuildStyle(feature),
     source: new Cluster({
       distance: distance || 80,
       minDistance: minDistance || 0,
@@ -650,7 +649,8 @@ var createClusterLayer = (dataList, config) => {
           return feature;
         })
       })
-    })
+    }),
+    style: (feature) => buildStyle ? buildStyle(feature) : innerBuildStyle(feature)
   });
   vectorLayer.setProperties({
     _isCustom: true,
@@ -672,8 +672,9 @@ 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,
     minZoom: 8,
     maxZoom: 21,
@@ -716,13 +717,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",
@@ -779,12 +786,9 @@ var createMapWorldLayer = (layerName, tk = "c77eddc667c5bed016fded560baf93e7") =
       }),
       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 +962,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.20",
+  "version": "0.1.22",
   "type": "module",
   "description": "Openlayers utils library",
   "files": [