@artstesh/maps 1.0.8 → 1.0.9

package/dist/bundles/maps-components.umd.js

@@ -1,8 +1,8 @@
 (function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/common'), require('ol'), require('ol/geom'), require('ol/format'), require('ol/extent'), require('ol/proj'), require('@artstesh/postboy'), require('rxjs/operators'), require('ol/source'), require('ol/interaction'), require('ol/layer/Tile'), require('ol/source/OSM'), require('ol/layer'), require('ol/loadingstrategy'), require('ol/geom/Polygon'), require('ol/source/Cluster'), require('rxjs'), require('ol/Map'), require('ol/View'), require('ol/Overlay'), require('ol/style/Style'), require('ol/style')) :
-    typeof define === 'function' && define.amd ? define('maps-components', ['exports', '@angular/core', '@angular/common', 'ol', 'ol/geom', 'ol/format', 'ol/extent', 'ol/proj', '@artstesh/postboy', 'rxjs/operators', 'ol/source', 'ol/interaction', 'ol/layer/Tile', 'ol/source/OSM', 'ol/layer', 'ol/loadingstrategy', 'ol/geom/Polygon', 'ol/source/Cluster', 'rxjs', 'ol/Map', 'ol/View', 'ol/Overlay', 'ol/style/Style', 'ol/style'], factory) :
-    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global["maps-components"] = {}, global.ng.core, global.ng.common, global.ol, global.geom, global.format, global.extent, global.proj, global.postboy, global.rxjs.operators, global.source, global.interaction, global.TileLayer, global.OSM, global.layer, global.loadingstrategy, global.Polygon, global.Cluster, global.rxjs, global.Map, global.View, global.Overlay, global.Style, global.style));
-})(this, (function (exports, i0, i6, ol, geom, format, extent, proj, postboy, operators, source, interaction, TileLayer, OSM, layer, loadingstrategy, Polygon, Cluster, rxjs, Map, View, Overlay, Style, style) { 'use strict';
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/common'), require('ol'), require('ol/geom'), require('ol/format'), require('ol/extent'), require('ol/proj'), require('@artstesh/postboy'), require('rxjs/operators'), require('ol/source'), require('ol/interaction'), require('ol/interaction/Draw'), require('ol/layer/Tile'), require('ol/source/OSM'), require('ol/layer'), require('ol/loadingstrategy'), require('ol/geom/Polygon'), require('ol/source/Cluster'), require('rxjs'), require('ol/Map'), require('ol/View'), require('ol/Overlay'), require('ol/style/Style'), require('ol/style'), require('ol/proj/epsg4326')) :
+    typeof define === 'function' && define.amd ? define('maps-components', ['exports', '@angular/core', '@angular/common', 'ol', 'ol/geom', 'ol/format', 'ol/extent', 'ol/proj', '@artstesh/postboy', 'rxjs/operators', 'ol/source', 'ol/interaction', 'ol/interaction/Draw', 'ol/layer/Tile', 'ol/source/OSM', 'ol/layer', 'ol/loadingstrategy', 'ol/geom/Polygon', 'ol/source/Cluster', 'rxjs', 'ol/Map', 'ol/View', 'ol/Overlay', 'ol/style/Style', 'ol/style', 'ol/proj/epsg4326'], factory) :
+    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global["maps-components"] = {}, global.ng.core, global.ng.common, global.ol, global.geom, global.format, global.extent, global.proj, global.postboy, global.rxjs.operators, global.source, global.interaction, global.Draw, global.TileLayer, global.OSM, global.layer, global.loadingstrategy, global.Polygon, global.Cluster, global.rxjs, global.Map, global.View, global.Overlay, global.Style, global.style, global.epsg4326));
+})(this, (function (exports, i0, i6, ol, geom, format, extent, proj, postboy, operators, source, interaction, Draw, TileLayer, OSM, layer, loadingstrategy, Polygon, Cluster, rxjs, Map, View, Overlay, Style, style, epsg4326) { 'use strict';
 
     function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -28,6 +28,7 @@
     var i6__namespace = /*#__PURE__*/_interopNamespace(i6);
     var TileLayer__default = /*#__PURE__*/_interopDefaultLegacy(TileLayer);
     var OSM__default = /*#__PURE__*/_interopDefaultLegacy(OSM);
+    var Polygon__default = /*#__PURE__*/_interopDefaultLegacy(Polygon);
     var Cluster__default = /*#__PURE__*/_interopDefaultLegacy(Cluster);
     var Map__default = /*#__PURE__*/_interopDefaultLegacy(Map);
     var View__default = /*#__PURE__*/_interopDefaultLegacy(View);
@@ -674,6 +675,7 @@
     exports.DrawingType = void 0;
     (function (DrawingType) {
         DrawingType[DrawingType["Polygon"] = 1] = "Polygon";
+        DrawingType[DrawingType["Circle"] = 2] = "Circle";
     })(exports.DrawingType || (exports.DrawingType = {}));
 
     exports.FeatureOutputFormat = void 0;
@@ -939,6 +941,26 @@
     }(postboy.PostboyGenericMessage));
     DrawingFinishedEvent.ID = 'c724b68e-b4eb-4783-90f1-a8e31973fd36';
 
+    var GenerateDrawQuery = /** @class */ (function (_super) {
+        __extends(GenerateDrawQuery, _super);
+        function GenerateDrawQuery(layer, style, type) {
+            var _this = _super.call(this) || this;
+            _this.layer = layer;
+            _this.style = style;
+            _this.type = type;
+            return _this;
+        }
+        Object.defineProperty(GenerateDrawQuery.prototype, "id", {
+            get: function () {
+                return GenerateDrawQuery.ID;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        return GenerateDrawQuery;
+    }(postboy.PostboyCallbackMessage));
+    GenerateDrawQuery.ID = 'f01c99ba-0953-4ab5-82f9-04e6fbb678c1';
+
     var MapPostboyService = /** @class */ (function (_super) {
         __extends(MapPostboyService, _super);
         function MapPostboyService() {
@@ -1158,17 +1180,18 @@
                         _this.clearInteraction(l);
                         return;
                     }
-                    var cancelSub = _this.observeCancelation(ev, l);
-                    _this.drawInteraction = new interaction.Draw({
-                        source: l.getSource(),
-                        type: exports.DrawingType[ev.type],
-                        style: ev.style,
-                    });
-                    _this.map.addInteraction(_this.drawInteraction);
-                    _this.drawInteraction.on('drawend', function (evt) {
-                        cancelSub.unsubscribe();
-                        _this.onEnd(evt, ev, l);
+                    var drawQuery = new GenerateDrawQuery(l, ev.style, ev.type);
+                    drawQuery.result.subscribe(function (draw) {
+                        var _a;
+                        var cancelSub = _this.observeCancelation(ev, l);
+                        _this.drawInteraction = draw;
+                        (_a = _this.map) === null || _a === void 0 ? void 0 : _a.addInteraction(_this.drawInteraction);
+                        _this.drawInteraction.on('drawend', function (evt) {
+                            cancelSub.unsubscribe();
+                            _this.onEnd(evt, ev, l);
+                        });
                     });
+                    _this.postboy.fire(drawQuery);
                 });
             });
             this.observeMapRender();
@@ -1217,11 +1240,33 @@
                 type: i0.Injectable
             }], ctorParameters: function () { return [{ type: MapPostboyService }]; } });
 
+    var DrawingGenerationService = /** @class */ (function () {
+        function DrawingGenerationService(postboy) {
+            this.postboy = postboy;
+        }
+        DrawingGenerationService.prototype.up = function () {
+            this.postboy.subscribe(GenerateDrawQuery.ID).subscribe(function (ev) {
+                ev.finish(new interaction.Draw({
+                    source: ev.layer.getSource(),
+                    type: exports.DrawingType[ev.type],
+                    style: ev.style,
+                    geometryFunction: ev.type !== exports.DrawingType.Circle ? undefined : Draw.createRegularPolygon(32),
+                }));
+            });
+        };
+        return DrawingGenerationService;
+    }());
+    DrawingGenerationService.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: DrawingGenerationService, deps: [{ token: MapPostboyService }], target: i0__namespace.ɵɵFactoryTarget.Injectable });
+    DrawingGenerationService.ɵprov = i0__namespace.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: DrawingGenerationService });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: DrawingGenerationService, decorators: [{
+                type: i0.Injectable
+            }], ctorParameters: function () { return [{ type: MapPostboyService }]; } });
+
     var MessageRegistratorService = /** @class */ (function (_super) {
         __extends(MessageRegistratorService, _super);
-        function MessageRegistratorService(service, management, state, feature, interaction, drawing) {
+        function MessageRegistratorService(service, management, state, feature, interaction, drawing, drawGenerator) {
             var _this = _super.call(this, service) || this;
-            _this.registerServices([management, state, interaction, feature, drawing]);
+            _this.registerServices([management, state, interaction, feature, drawing, drawGenerator]);
             return _this;
         }
         MessageRegistratorService.prototype._up = function () {
@@ -1239,14 +1284,15 @@
             this.registerSubject(StartDrawingCommand.ID);
             this.registerSubject(GetLayerQuery.ID);
             this.registerSubject(DrawingFinishedEvent.ID);
+            this.registerSubject(GenerateDrawQuery.ID);
         };
         return MessageRegistratorService;
     }(postboy.PostboyAbstractRegistrator));
-    MessageRegistratorService.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: MessageRegistratorService, deps: [{ token: MapPostboyService }, { token: MapManagementService }, { token: MapStateService }, { token: MapFeatureService }, { token: MapClickService }, { token: DrawingService }], target: i0__namespace.ɵɵFactoryTarget.Injectable });
+    MessageRegistratorService.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: MessageRegistratorService, deps: [{ token: MapPostboyService }, { token: MapManagementService }, { token: MapStateService }, { token: MapFeatureService }, { token: MapClickService }, { token: DrawingService }, { token: DrawingGenerationService }], target: i0__namespace.ɵɵFactoryTarget.Injectable });
     MessageRegistratorService.ɵprov = i0__namespace.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: MessageRegistratorService });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: MessageRegistratorService, decorators: [{
                 type: i0.Injectable
-            }], ctorParameters: function () { return [{ type: MapPostboyService }, { type: MapManagementService }, { type: MapStateService }, { type: MapFeatureService }, { type: MapClickService }, { type: DrawingService }]; } });
+            }], ctorParameters: function () { return [{ type: MapPostboyService }, { type: MapManagementService }, { type: MapStateService }, { type: MapFeatureService }, { type: MapClickService }, { type: DrawingService }, { type: DrawingGenerationService }]; } });
 
     var TileLayerSettings = /** @class */ (function () {
         function TileLayerSettings() {
@@ -1886,6 +1932,7 @@
             MapClickService,
             MapFeatureService,
             DrawingService,
+            DrawingGenerationService,
         ], usesInheritance: true, ngImport: i0__namespace, template: "<ng-content></ng-content>\r\n<lib-osm-tile-layer *ngIf=\"osmUrl && map\" [map]=\"map\" [url]=\"osmUrl\"></lib-osm-tile-layer>\r\n<lib-feature-layer *ngIf=\"map\" [settings]=\"drawingLayerSettings\"></lib-feature-layer>\r\n", styles: ["lib-map-plate{position:relative;display:flex;flex-direction:column;height:100%}\n"], components: [{ type: OsmTileLayerComponent, selector: "lib-osm-tile-layer", inputs: ["url", "map"] }, { type: FeatureLayerComponent, selector: "lib-feature-layer", inputs: ["settings"] }], directives: [{ type: i6__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: MapPlateComponent, decorators: [{
                 type: i0.Component,
@@ -1901,6 +1948,7 @@
                             MapClickService,
                             MapFeatureService,
                             DrawingService,
+                            DrawingGenerationService,
                         ],
                     }]
             }], ctorParameters: function () { return [{ type: i0__namespace.ElementRef }, { type: MapPostboyService }, { type: MapPlateFactory }, { type: MessageRegistratorService }, { type: i0__namespace.ChangeDetectorRef }]; }, propDecorators: { settings: [{
@@ -2233,6 +2281,59 @@
         return TextStyleHelper;
     }());
 
+    var StringifyFeatureHelper = /** @class */ (function () {
+        function StringifyFeatureHelper() {
+        }
+        StringifyFeatureHelper.polygon = function (feature, format$1) {
+            if (format$1 === void 0) { format$1 = exports.FeatureOutputFormat.GeoJson; }
+            return format$1 === exports.FeatureOutputFormat.GeoJson
+                ? new format.GeoJSON().writeFeature(feature)
+                : new format.WKT().writeFeature(feature);
+        };
+        StringifyFeatureHelper.circle = function (feature, format) {
+            if (format === void 0) { format = exports.FeatureOutputFormat.GeoJson; }
+            // const clone = feature.clone();
+            // clone.setGeometry(fromCircle(feature.getGeometry()! as Circle));
+            var tetemp = feature.getGeometryName();
+            var circle = feature.getGeometry();
+            // const temp = StringifyFeatureHelper.drawCircle(circle.getCenter(), circle.getRadius());
+            var ttt = feature.getGeometry().getExtent();
+            var eastPoint = [ttt[2], (ttt[1] + ttt[3]) / 2];
+            var aaa = __spreadArray(__spreadArray([], __read(proj.transform([ttt[0], ttt[1]], 'EPSG:4326', 'EPSG:3857'))), __read(proj.transform([ttt[2], ttt[3]], 'EPSG:4326', 'EPSG:3857')));
+            var radius = (aaa[2] - aaa[0]) / 2;
+            var radius2 = new geom.LineString([circle.getCenter(), eastPoint]).getLength();
+            var polygonGeom = new Polygon__default["default"](StringifyFeatureHelper.drawCircle(circle.getCenter(), radius));
+            // var edgeCoordinate = [circle.getCenter()[0] + radius, circle.getCenter()[1]];
+            // var wgs84Sphere = new Sphere(6378137);
+            return StringifyFeatureHelper.polygon(new ol.Feature(polygonGeom), format);
+            //  const rad = circle.getRadius();
+            //  const degrees = 180 / Math.PI; // radians to degrees
+            //  const radians = Math.PI / 180; // degrees to radians
+            //  const rlat = rad * degrees * 1000;
+            //  const rlng = rad * radians;
+            //  return StringifyFeatureHelper.polygon(new Feature<Geometry>(circular(circle.getCenter(),circle.getRadius() * METERS_PER_UNIT)), format);
+        };
+        StringifyFeatureHelper.drawCircle = function (point, radius) {
+            var tetetemp = proj.transform(point, 'EPSG:4326', 'EPSG:3857');
+            // const tetetemp = point;
+            var radians = Math.PI / 180; // degrees to radians
+            var degrees = 180 / Math.PI; // radians to degrees
+            var earthsradius = 6378137.0;
+            var rlat = (radius / earthsradius) * degrees;
+            var rlng = rlat / Math.cos(tetetemp[1] * radians);
+            var extp = [];
+            for (var i = 0; i <= 32; i++) {
+                var theta = Math.PI * (i / 16);
+                extp.push([
+                    tetetemp[0] + rlng * Math.cos(theta) * epsg4326.METERS_PER_UNIT,
+                    tetetemp[1] + rlat * Math.sin(theta) * epsg4326.METERS_PER_UNIT,
+                ]);
+            }
+            return [extp.map(function (e) { return proj.transform(e, 'EPSG:3857', 'EPSG:4326'); })];
+        };
+        return StringifyFeatureHelper;
+    }());
+
     /*
      * Public API Surface of maps
      */
@@ -2268,6 +2369,7 @@
     exports.PolygonStyleHelper = PolygonStyleHelper;
     exports.PolygonsComponent = PolygonsComponent;
     exports.StartDrawingCommand = StartDrawingCommand;
+    exports.StringifyFeatureHelper = StringifyFeatureHelper;
     exports.TextStyleHelper = TextStyleHelper;
     exports.TileLayerComponent = TileLayerComponent;
     exports.TileLayerSettings = TileLayerSettings;