@vcmap/core 5.0.0-rc.0

package/src/vcs/vcm/layer/tileProvider/urlTemplateTileProvider.js

@@ -0,0 +1,106 @@
+import axios from 'axios';
+import { Math as CesiumMath, Rectangle } from '@vcmap/cesium';
+import { parseGeoJSON } from '../geojsonHelpers.js';
+import TileProvider from './tileProvider.js';
+import { getCurrentLocale } from '../../util/locale.js';
+
+/**
+ * @typedef {TileProviderOptions} URLTemplateTileProviderOptions
+ * @property {string} url  url Template in the form `http://myFeatureSource/layer/getFeatures?minx={minx}&miny={miny}&maxx={maxx}&maxy={maxy}` or `http://myFeatureSource/layer/getFeatures?x={x}&y={y}&level={z}`
+ * @api
+ */
+
+/**
+ * replaces {x}, {y}, {z} with the x, y, z tiling coordinates
+ * replaces {minx}, {miny}, {maxx}, {maxy} with extent of the tile if tilingExtent is provided
+ * replaces {locale} with the current locale
+ *
+ * @param {string} url
+ * @param {number} x
+ * @param {number} y
+ * @param {number} z
+ * @param {import("@vcmap/cesium").Rectangle=} tilingExtent
+ * @returns {string}
+ */
+export function getURL(url, x, y, z, tilingExtent) {
+  let replacedURL = url;
+  if (tilingExtent) {
+    const southwest = Rectangle.southwest(tilingExtent);
+    const northeast = Rectangle.northeast(tilingExtent);
+    const minx = CesiumMath.toDegrees(southwest.longitude);
+    const miny = CesiumMath.toDegrees(southwest.latitude);
+    const maxx = CesiumMath.toDegrees(northeast.longitude);
+    const maxy = CesiumMath.toDegrees(northeast.latitude);
+    replacedURL = replacedURL
+      .replace(/\{minx\}/, String(minx))
+      .replace(/\{miny\}/, String(miny))
+      .replace(/\{maxx\}/, String(maxx))
+      .replace(/\{maxy\}/, String(maxy));
+  }
+
+  replacedURL = replacedURL
+    .replace(/\{x\}/, String(x))
+    .replace(/\{y\}/, String(y))
+    .replace(/\{z\}/, String(z))
+    .replace(/\{locale\}/, getCurrentLocale());
+  return replacedURL;
+}
+
+/**
+ * TileProvider loads GeoJSON from the provided URL. The URL has placeholders:
+ * the extent in latitude/longitude via: {minx}, {miny}, {maxx}, {maxy}
+ * tile Coordinates in x, y, z(level) via:  {x}, {y}, {z}
+ * {locale} can be used to request locale aware content.
+ *
+ * @class
+ * @extends {TileProvider}
+ * @export
+ * @api
+ */
+class URLTemplateTileProvider extends TileProvider {
+  /**
+   * @readonly
+   * @returns {string}
+   */
+  static get className() { return 'vcs.vcm.layer.tileProvider.URLTemplateTileProvider'; }
+
+  /**
+   * @returns {URLTemplateTileProviderOptions}
+   */
+  static getDefaultOptions() {
+    return {
+      ...TileProvider.getDefaultOptions(),
+      url: undefined,
+    };
+  }
+
+  /**
+   * @param {URLTemplateTileProviderOptions} options
+   */
+  constructor(options) {
+    const defaultOptions = URLTemplateTileProvider.getDefaultOptions();
+    super(options);
+
+    /**
+     * @type {string}
+     */
+    this.url = options.url || defaultOptions.url;
+  }
+
+  /**
+   * @inheritDoc
+   * @param {number} x
+   * @param {number} y
+   * @param {number} z
+   * @returns {Promise<Array<import("ol").Feature<import("ol/geom/Geometry").default>>>}
+   */
+  async loader(x, y, z) {
+    const rectangle = this.tilingScheme.tileXYToRectangle(x, y, z);
+    const url = getURL(this.url, x, y, z, rectangle);
+    const response = await axios.get(url);
+    const { features } = parseGeoJSON(response.data, { dynamicStyle: true });
+    return features;
+  }
+}
+
+export default URLTemplateTileProvider;

package/src/vcs/vcm/layer/tms.js

@@ -0,0 +1,121 @@
+import RasterLayer from './rasterLayer.js';
+import Openlayers from '../maps/openlayers.js';
+import CesiumMap from '../maps/cesium.js';
+import TMSOpenlayers from './openlayers/tmsOpenlayers.js';
+import TMSCesium from './cesium/tmsCesium.js';
+import { VcsClassRegistry } from '../classRegistry.js';
+
+/**
+ * @typedef {RasterLayerOptions} TMSOptions
+ * @property {string} [format=jpeg]
+ * @property {import("ol/size").Size} [tileSize=[256, 256]]
+ * @api
+ */
+
+/**
+ * @typedef {RasterLayerImplementationOptions} TMSImplementationOptions
+ * @property {string} format
+ * @property {import("ol/size").Size} tileSize
+ */
+
+/**
+ * TMS Layer
+ * @class
+ * @export
+ * @extends {RasterLayer}
+ * @api stable
+ */
+class TMS extends RasterLayer {
+  static get className() { return 'vcs.vcm.layer.TMS'; }
+
+  /**
+   * @returns {TMSOptions}
+   */
+  static getDefaultOptions() {
+    return {
+      ...RasterLayer.getDefaultOptions(),
+      tilingSchema: 'mercator',
+      format: 'jpeg',
+      tileSize: [256, 256],
+    };
+  }
+
+  /**
+   * @param {TMSOptions} options
+   */
+  constructor(options) {
+    const defaultOptions = TMS.getDefaultOptions();
+    options.tilingSchema = options.tilingSchema || defaultOptions.tilingSchema;
+    super(options);
+
+    this._supportedMaps = [
+      Openlayers.className,
+      CesiumMap.className,
+    ];
+
+    /** @type {?string} */
+    this.format = options.format || defaultOptions.format;
+
+    /** @type {import("ol/size").Size} */
+    this.tileSize = Array.isArray(options.tileSize) ? options.tileSize.slice() : defaultOptions.tileSize;
+  }
+
+  /**
+   * @inheritDoc
+   * @returns {TMSImplementationOptions}
+   */
+  getImplementationOptions() {
+    return {
+      ...super.getImplementationOptions(),
+      format: this.format,
+      tileSize: this.tileSize,
+    };
+  }
+
+  /**
+   * @inheritDoc
+   * @param {import("@vcmap/core").VcsMap} map
+   * @returns {Array<TMSOpenlayers|TMSCesium>}
+   */
+  createImplementationsForMap(map) {
+    if (map instanceof Openlayers) {
+      return [new TMSOpenlayers(map, this.getImplementationOptions())];
+    }
+
+    if (map instanceof CesiumMap) {
+      return [new TMSCesium(map, this.getImplementationOptions())];
+    }
+    return [];
+  }
+
+  /**
+   * @inheritDoc
+   * @returns {TMSOptions}
+   */
+  getConfigObject() {
+    const config = /** @type {TMSOptions} */ (super.getConfigObject());
+    const defaultOptions = TMS.getDefaultOptions();
+
+    if (this.tilingSchema !== defaultOptions.tilingSchema) {
+      config.tilingSchema = this.tilingSchema;
+    } else {
+      delete config.tilingSchema;
+    }
+
+    if (this.format !== defaultOptions.format) {
+      config.format = this.format;
+    }
+
+    if (
+      this.tileSize[0] !== defaultOptions.tileSize[0] ||
+      this.tileSize[1] !== defaultOptions.tileSize[1]
+    ) {
+      config.tileSize = this.tileSize.slice();
+    }
+
+    return config;
+  }
+}
+
+VcsClassRegistry.registerClass(TMS.className, TMS);
+export default TMS;