rlayers/layer/RLayerVectorTile.js

React Components for OpenLayers

"use strict";
var __extends = (this && this.__extends) || (function () {
    var extendStatics = function (d, b) {
        extendStatics = Object.setPrototypeOf ||
            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
        return extendStatics(d, b);
    };
    return function (d, b) {
        if (typeof b !== "function" && b !== null)
            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
        extendStatics(d, b);
        function __() { this.constructor = d; }
        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
    };
})();
var __assign = (this && this.__assign) || function () {
    __assign = Object.assign || function(t) {
        for (var s, i = 1, n = arguments.length; i < n; i++) {
            s = arguments[i];
            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
                t[p] = s[p];
        }
        return t;
    };
    return __assign.apply(this, arguments);
};
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
var react_1 = __importDefault(require("react"));
var layer_1 = require("ol/layer");
var source_1 = require("ol/source");
var context_1 = require("../context");
var RLayer_1 = __importDefault(require("./RLayer"));
var RFeature_1 = __importDefault(require("../RFeature"));
var REvent_1 = require("../REvent");
var RLayerBaseVector_1 = require("./RLayerBaseVector");
var RStyle_1 = __importDefault(require("../style/RStyle"));
/**
 * A vector tile layer
 *
 * Supports loading of features from vector tile servers.
 *
 * Only the handlers can be dynamically modified.
 *
 * Requires an `RMap` context.
 *
 * It does not provide a vector layer context for JSX-declared `RFeature`s
 * and it is not compatible with RLayerVector.
 *
 * Since 3.0, RLayerVectorTile uses OpenLayers light-weight RenderFeatures by default.
 *
 * @example
 * <RLayerVectorTile url={url} format={new MVT()} />
 *
 * If you need advanced feature functions, you can switch to using full blown OpenLayers features
 * by using a `format` parser that returns Features and, if using TSX, specifying the right
 * generic argument.
 *
 * @example
 * <RLayerVectorTile<Feature> url={url} format={new MVT({featureClass: Feature})} />
 */
var RLayerVectorTile = /** @class */ (function (_super) {
    __extends(RLayerVectorTile, _super);
    function RLayerVectorTile(props) {
        var _this = _super.call(this, props) || this;
        _this.source = new source_1.VectorTile({
            url: _this.props.url,
            format: _this.props.format,
            projection: _this.props.projection,
            cacheSize: _this.props.cacheSize,
            extent: _this.props.extent,
            overlaps: _this.props.overlaps,
            state: _this.props.state,
            tileClass: _this.props.tileClass,
            tileSize: _this.props.tileSize,
            tileGrid: _this.props.tileGrid,
            tileLoadFunction: _this.props.tileLoadFunction,
            tileUrlFunction: _this.props.tileUrlFunction,
            transition: _this.props.transition,
            wrapX: _this.props.wrapX,
            zDirection: _this.props.zDirection
        });
        _this.ol = new layer_1.VectorTile({
            style: RStyle_1.default.getStyle(_this.props.style),
            source: _this.source,
            renderBuffer: _this.props.renderBuffer
        });
        _this.eventSources = [_this.ol, _this.source];
        return _this;
    }
    RLayerVectorTile.prototype.incrementHandlers = function (ev) {
        var _a;
        var featureHandlers = REvent_1.RlayersBase.getOLObject(RLayerBaseVector_1.featureHandlersSymbol, this.ol);
        featureHandlers[ev] = ((_a = featureHandlers[ev]) !== null && _a !== void 0 ? _a : 0) + 1;
    };
    RLayerVectorTile.prototype.decrementHandlers = function (ev) {
        var featureHandlers = REvent_1.RlayersBase.getOLObject(RLayerBaseVector_1.featureHandlersSymbol, this.ol);
        featureHandlers[ev]--;
    };
    RLayerVectorTile.prototype.refresh = function (prevProps) {
        var _this = this;
        _super.prototype.refresh.call(this, prevProps);
        var handlers = Object.keys(this.props)
            .filter(function (ev) { return ev.startsWith('on'); })
            .reduce(function (ac, x) {
            var _a;
            return (__assign(__assign({}, ac), (_a = {}, _a['_' + x.toLowerCase()] = _this.props[x], _a)));
        }, {});
        this.ol.setProperties(handlers);
        if ((prevProps === null || prevProps === void 0 ? void 0 : prevProps.style) !== this.props.style)
            this.ol.setStyle(RStyle_1.default.getStyle(this.props.style));
        if ((prevProps === null || prevProps === void 0 ? void 0 : prevProps.url) !== this.props.url) {
            this.source.setUrl(this.props.url);
            this.source.refresh();
        }
    };
    RLayerVectorTile.prototype.render = function () {
        _super.prototype.render.call(this);
        RFeature_1.default.initEventRelay(this.context.map);
        return (react_1.default.createElement("div", { className: '_rlayers_RLayerVectorTile' },
            react_1.default.createElement(context_1.RContext.Provider, { value: __assign(__assign({}, this.context), { layer: this.ol, vectortilelayer: this.ol, rLayer: this, rLayerVectorTile: this }) }, this.props.children)));
    };
    return RLayerVectorTile;
}(RLayer_1.default));
exports.default = RLayerVectorTile;
//# sourceMappingURL=RLayerVectorTile.js.map